- How to get it work
- How to disable/enable it in production
- How to persist debug sessions across page reloads
- How to open DevTools programmatically
- How to enable/disable errors notifying
- How to get it work with WebWorkers, React Native, hybrid, desktop and server side apps
- Keyboard shortcuts
- Check the extension with Counter or TodoMVC demo.
- Reload the extension on the extensions page (
chrome://extensions/). - If something goes wrong, open an issue or tweet me: @mdiordiev.
Usually you don't have to. See the article for details on how to include it in production.
Just click the Persist button or add ?debug_session=<session_name> to the url.
window.__REDUX_DEVTOOLS_EXTENSION__.open();Make sure to have it conditionally. Auto opening windows is a bad DX. See the API for details.
Just find Redux DevTools on the extensions page (chrome://extensions/) and click the Options link to customize everything. The errors notifying is disabled by default. If enabled, it works only when the store enhancer is called (in order not to show notifications for any sites you visit). In case you want notifications for a non-redux app, init it explicitly by calling window.__REDUX_DEVTOOLS_EXTENSION__.notifyErrors() (probably you'll check if window.__REDUX_DEVTOOLS_EXTENSION__ exists before calling it).
It is not possible to inject extension's script there and to communicate directly. To solve this, use Remote Redux DevTools. After including it inside the app, click Remote button for remote monitoring.
To set/change the keyboard shortcuts, click "Keyboard shortcuts" button on the bottom of the extensions page (chrome://extensions/). By default only Cmd (Ctrl) + Shift + E is available, which will open the extension popup (only when the Redux store is available in the current page).