Full support for ImmutableJS out of the box

Now you can persist, import, and investigate ImmutableJS data:

Just pass the Immutable library to the new serialize parameter like so:

import Immutable from 'immutable';
// ...

const store = createStore(rootReducer, window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__({
  serialize: {
    immutable: Immutable
  }
}));

It will support all ImmutableJS structures. You can even export them into a file and get them back. The only exception is Record class, for which you should pass in addition the references to your classes:

import Immutable from 'immutable';
// ...

const ABRecord = Immutable.Record({ a:1, b:2 });
const myRecord = new ABRecord({ b:3 }); // used in the reducers

const store = createStore(rootReducer, window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__({
  serialize: {
    immutable: Immutable,
    refs: [ABRecord]
  }
}));

New serialize parameter and deprecations

We're deprecating (de)serializeState / (de)serializeAction parameters in favour of the new one:

• serialize (object) - contains { replacer: function, reviver: function, options: object/boolean, refs: array }

  • replacer function(key, value) - JSON replacer function used for both actions and states stringify.

  • reviver function(key, value) - JSON reviver function used for parsing the imported actions and states.

  • options object or boolean:

    • undefined - use regular JSON.stringify to send data - the fast mode.
    • false - handle only circular references.
    • true - handle also dates, regexes, undefined, error objects, symbols, and functions.
    • object, which contains date, regex, undefined, error, and function keys. Fo each of them you can indicate whether to include (if set as true). For function key you can also specify a custom function which handles serialization. See jsan for more details. Example:

    const store = Redux.createStore(reducer, window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__({
     serialize: { 
       options: {
        undefined: true,
        function: function(fn) { return fn.toString() }
       }
    }
    }));

  Example of usage with mori data structures:

    const store = Redux.createStore(reducer, window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__({
      serialize: {
        replacer: (key, value) => value && mori.isMap(value) ? mori.toJs(value) : value
      }
    }));

File an issue if you still need deSerializeState / deSerializeAction, which were getting the whole root state / action payload, instead of (key, value).

Specify action type key for non-redux apps via getActionType callback parameter

If you're using the extension for non-redux apps, now you can specify what will be shown in the monitors:

window.__REDUX_DEVTOOLS_EXTENSION__.connect({ getActionType: (a) => a.Case })

See elmish/elmish#18 for details.