Redux DevTools Dispatch

Dispatch your actions manually to test if your app reacts well.

Installation

npm install --save-dev redux-devtools-dispatch

Usage

You can declare your Dispatcher the same way you declare a Monitor in your Dev Tools.

import React from 'react';
import { createDevTools } from 'redux-devtools';
import Dispatcher from 'redux-devtools-dispatch';

export default createDevTools(
  <Dispatcher />
);

You can inject action creators to ease the process of testing your app firing yourself actions.

import React from 'react';
import { createDevTools } from 'redux-devtools';
import Dispatcher from 'redux-devtools-dispatch';

const actionCreators = {
  increment() {
    return {type: 'INCREMENT_COUNTER'};
  },
  decrement() {
    return {type: 'DECREMENT_COUNTER'};
  },
  nested: {
    worksToo() {
      return {type: 'NESTED_WORKS_TOO', cool: true};
    },
  },
};

export default createDevTools(
  <Dispatcher actionCreators={actionCreators} />
);

You can also use <MultipleMonitors> from redux-devtools-multiple-monitors to use multiple monitors into the <DockMonitor>:

import React from 'react';

import { createDevTools } from 'redux-devtools';
import LogMonitor from 'redux-devtools-log-monitor';
import DockMonitor from 'redux-devtools-dock-monitor';
import Dispatcher from 'redux-devtools-dispatch';
import MultipleMonitors from 'redux-devtools-multiple-monitors';

export default createDevTools(
  <DockMonitor toggleVisibilityKey="ctrl-h" changePositionKey="ctrl-q" defaultIsVisible={false}>
    <MultipleMonitors>
      <LogMonitor />
      <Dispatcher />
    </MultipleMonitors>
  </DockMonitor>
);

Then, just write an JSON action in the field, click on Dispatch, and that's all!

Props

Contributing

As this package is my first, any comment, pull request, issue is welcome so I can learn more from everyone.

License

MIT