Home

Awesome

Rax Developer Tools

Rax Developer Tools lets you inspect the Rax component's structure, props and state.

Go to Chrome extension store to install this extension.

Pre-packaged

The official extensions represent the current stable release.

Usage

  1. Install the Chrome Rax Developer Tools extension
  2. Import the "rax/lib/devtools" module in your app
import 'rax/lib/devtools';
  1. Set process.env.NODE_ENV to 'development'
  2. Reload and go to the 'Rax' tab in the browser's development tools

Tree View

Side Pane

Search Bar

Handy Tips

Finding Component by a DOM Node

If you inspect a Rax element on the page using the regular Elements tab, then switch over to the Rax tab, that element will be automatically selected in the Rax tree.

Finding DOM Node by a Component

You can right-click any Rax element in the Rax tab, and choose "Find the DOM node". This will bring you to the corresponding DOM node in the Elements tab.