Redux DevTools

[ronag]

Is there a reason why we don't use this?

[grabbou]

No, just didn't have enough time to implement. If you feel fancy, give it a go. The only issue is (that I've already told @steida) that function configureStore from common package needs to support one extra argument - a function to add to composition. It's because web & native will require their own set of tools & modules thus this is a must (because for now - no dev tools for native)

[ronag]

I do it like this:

if (process.env.NODE_ENV === 'development' && process.env.IS_BROWSER) {
  const { devTools, persistState } = require('redux-devtools')
  enhancers = [
    // Batch React updates that occur as a result of Redux dispatches,
    // to prevent cascading renders.
    // https://github.com/gaearon/redux/issues/125
    // https://github.com/tappleby/redux-batched-subscribe
    batchedSubscribe(batchedUpdates)
  ]
  .concat(enhancers)
  .concat([
    devTools(),
    persistState(global.window.location.href.match(/[?&]debug_session=([^&]+)\b/))
  ])
}

ReactDom.render(
  <Provider store={store}>
    <Router history={createBrowserHistory()}>
      {routes}
    </Router>
  </Provider>,
  // Never render to body. Everybody updates it.
  // https://medium.com/@dan_abramov/two-weird-tricks-that-fix-react-7cf9bbdef375
  document.getElementById('app')
)

if (process.env.NODE_ENV === 'development') {
  ReactDom.render(
    <DebugPanel top right bottom>
      <DevTools store={store} monitor={LogMonitor} />
    </DebugPanel>,
    // Never render to body. Everybody updates it.
    // https://medium.com/@dan_abramov/two-weird-tricks-that-fix-react-7cf9bbdef375
    document.getElementById('debug')
  )

  window.React = React // enable debugger

  const reactRoot = window.document.getElementById('app')

  invariant(reactRoot &&
            reactRoot.firstChild &&
            reactRoot.firstChild.attributes &&
            reactRoot.firstChild.attributes['data-react-checksum'],
    'Server-side React render was discarded. ' +
    'Make sure that your initial render does not contain any ' +
    'client-side code.')
}

[ronag]

I can take a go at it. The biggest problem is that the current version of devtools throws warnings in React 0.14.

reduxjs/redux-devtools#128

[gaearon]

We're waiting for 0.14 to ship before requiring it as a peer.

[steida]

Yes.