redux-devtools - npm Package Compare versions

Comparing version 1.1.0 to 1.1.1

lib/react/JSONTree/JSONArrayNode.js

@@ -85,3 +85,3 @@ 'use strict';
           var prevData = undefined;
-          if (typeof _this.props.previousData !== 'undefined') {
+          if (typeof _this.props.previousData !== 'undefined' && _this.props.previousData !== null) {
             prevData = _this.props.previousData[idx];
@@ -88,0 +88,0 @@ }

lib/react/JSONTree/JSONIterableNode.js

@@ -105,3 +105,3 @@ 'use strict';
         var prevData = undefined;
-        if (typeof this.props.previousData !== 'undefined') {
+        if (typeof this.props.previousData !== 'undefined' && this.props.previousData !== null) {
           prevData = this.props.previousData[key];
@@ -108,0 +108,0 @@ }

lib/react/JSONTree/JSONObjectNode.js

@@ -83,3 +83,3 @@ 'use strict';
           var prevData = undefined;
-          if (typeof this.props.previousData !== 'undefined') {
+          if (typeof this.props.previousData !== 'undefined' && this.props.previousData !== null) {
             prevData = this.props.previousData[k];
@@ -86,0 +86,0 @@ }

package.json

 {
   "name": "redux-devtools",
-  "version": "1.1.0",
+  "version": "1.1.1",
   "description": "Redux DevTools with hot reloading and time travel",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

README.md

@@ -24,2 +24,50 @@ Redux DevTools
 
+DevTools is a [store enhancer](http://rackt.github.io/redux/docs/Glossary.html#store-enhancer), which should be added to your middleware stack *after* [`applyMiddleware`](http://rackt.github.io/redux/docs/api/applyMiddleware.html) as `applyMiddleware` is potentially asynchronous. Otherwise, DevTools won’t see the raw actions emitted by asynchronous middleware such as [redux-promise](https://github.com/acdlite/redux-promise) or [redux-thunk](https://github.com/gaearon/redux-thunk).
+
+To install, firstly import `devTools` into your root React component:
+
+```js
+// Redux utility functions
+import { compose, createStore, applyMiddleware } from 'redux';
+// Redux DevTools store enhancers
+import { devTools, persistState } from 'redux-devtools';
+// React components for Redux DevTools
+import { DevTools, DebugPanel, LogMonitor } from 'redux-devtools/lib/react';
+```
+
+Then, add `devTools` to your store enhancers, and create your store:
+
+```js
+const finalCreateStore = compose(
+  // Enables your middleware:
+  applyMiddleware(thunk),
+  // Provides support for DevTools:
+  devTools(),
+  // Lets you write ?debug_session=<name> in address bar to persist debug sessions
+  persistState(window.location.href.match(/[?&]debug_session=([^&]+)\b/)),
+  createStore
+);
+
+const store = finalCreateStore(reducer);
+```
+
+Finally, include the `DevTools` in your page. You may pass either `LogMonitor` (the default one) or any of the custom monitors described below. For convenience, you can use `DebugPanel` to dock `DevTools` to some part of the screen, but you can put it also somewhere else in the component tree.
+
+```js
+export default class Root extends Component {
+  render() {
+    return (
+      <div>
+        <Provider store={store}>
+          {() => <CounterApp />}
+        </Provider>
+        <DebugPanel top right bottom>
+          <DevTools store={store} monitor={LogMonitor} />
+        </DebugPanel>
+      </div>
+    );
+  }
+}
+```
+
 [This commit](https://github.com/gaearon/redux-devtools/commit/0a2a97556e252bfad822ca438923774bc8b932a4) should give you an idea about how to add Redux DevTools for your app **but make sure to only apply `devTools()` in development!** In production, this will be terribly slow because actions just accumulate forever. (We'll need to implement a rolling window for dev too.)
@@ -26,0 +74,0 @@

No alert changes

Improved metrics

Total package byte prevSize

111323

increased by1.86%

Number of lines in readme file

130

increased by58.54%

No dependency changes