Skip to content

v2.5.0

Compare
Choose a tag to compare
@zalmoxisus zalmoxisus released this 14 Aug 14:12
· 380 commits to master since this release

Autogenerate "real" tests

As announced at React Europe, the extension can generate tests for the inspected actions.

Thanks to Redux principles, it's a rather simple task:

expect(reducer(pervousState, action), currentState);

However, such tests are difficult to maintain and they aren't human-readable. Hacking a lot these days, we can now check only what was changed.

So, instead of

expect(
  reducers(
    {counter:0},
    {type:'INCREMENT_COUNTER'}
  )
).toEqual(
  {counter:1}
);

the extension generates tests like so

state = reducers(
  {counter:0},
  {type:'INCREMENT_COUNTER'}
);
expect(state.counter).toEqual(1);

Or for arrays, instead of

expect(
  reducers(
    {todos:[{text:'Use Redux',completed:false,id:0}]},
    {type:'ADD_TODO',text:'Generate tests'})
  )
).toEqual(
  {todos:[{id:1,completed:false,text:'Generate tests'},{text:'Use Redux',completed:false,id:0}]}
);

it will check only the length and new elements:

state = reducers(
  {todos:[{text:'Use Redux',completed:false,id:0}]},
  {type:'ADD_TODO',text:'Generate tests'})
);
expect(state.todos.length).toEqual(2);
expect(state.todos[0]).toEqual({id:1,completed:false,text:'Generate tests'});

Here's the full autogenerated test with also changing and removing an item:
screen shot 2016-08-14 at 5 00 16 pm

There are default templates for Mocha, Tape and Ava, you can select and edit. You can also add you specific templates there.

Correlate time travelling to state and actions

In log monitor you can now identify actions from "the future":
demo

Import actions saved from production

The extension can import now not only full lifted state from a file, but also just an array of actions which you could save from a redux middleware and send to a monitoring service. An example of such implementation is redux-trackjs-logger.