Newton's Poleless Magnet

    enzyme-context-redux
    TypeScript icon, indicating that this package has built-in type declarations

    2.0.0 • Public • Published

    enzyme-context-redux

    Introduction

    This plugin sets up react-redux context to test components that are connect()ed to redux.

    Installation

    1. Setup required peer dependencies: enzyme, react, react-redux, react-test-renderer, and redux.

    2. Install via yarn or npm

      $> yarn add -D enzyme-context enzyme-context-redux
    3. Add to plugins:

      import { createMount, createShallow } from 'enzyme-context';
      import { reduxContext } from 'enzyme-context-redux';
      import { createStore } from 'redux';
      import reducer from './reducer';
       
      const plugins = {
        store: reduxContext({ createStore: () => createStore(reducer) }),
      };
       
      export const mount = createMount(plugins);
      export const shallow = createShallow(plugins);

    Usage

    After adding the plugin to your mount/shallow, it can be used in your tests like so:

    import { mount } from './test-utils/enzyme'; // import the mount created with enzyme-context
    import MyComponent from './MyComponent';
     
    describe('<MyComponent />', () => {
      let wrapper;
     
      beforeEach(() => {
        wrapper = mount(<MyComponent />);
      });
     
      it('responds to state updates', () => {
        wrapper.store.dispatch({ type: 'MY_ACTION' });
        wrapper.update();
        expect(wrapper.text()).toBe('...');
      });
    });

    Configuration API

    reduxContext(options) => EnzymePlugin

    Arguments

    1. options (Object):

      • options.createStore (() => Store): a function which must return a redux store

    Returns

    EnzymePlugin: The plugin which can be passed to createMount/createShallow.

    Example:

    import { createMount, createShallow } from 'enzyme-context';
    import { reduxContext } from 'enzyme-context-redux';
    import { createStore } from 'redux';
    import reducer from './reducer';
     
    const plugins = {
      store: reduxContext({ createStore: () => createStore(reducer) }),
    };
     
    export const mount = createMount(plugins);
    export const shallow = createShallow(plugins);

    Mount/Shallow API

    This plugin also allows some configuration to be passed at mount-time:

    1. initialActions (Action[] [optional]): an array of initial actions to be dispatched before the component is mounted. Useful to get the redux state into a desired form before the component initializes.
      • Example:
        const wrapper = mount(<MyComponent />, {
          initialActions: [{ type: 'MY_ACTION' }],
        });

    Install

    npm i enzyme-context-redux

    DownloadsWeekly Downloads

    172

    Version

    2.0.0

    License

    MIT

    Unpacked Size

    6.33 kB

    Total Files

    6

    Last publish

    Collaborators

    • jkillian
    • minznerjosh