Test component with a store Mocha and Enzyme

Question

I am trying to test my component but because of the store I have an error.

import React from 'react';
import { shallow, simulate } from 'enzyme';
import configureStore from 'redux-mock-store';
import { Provider } from "react-redux";

import DropzoneComponent from '../components/DropzoneComponent';

const mockStore = configureStore();
const store = mockStore({});


describe('Dropzone component live test', () => {
    it('renders the component', () => {
      const wrapper = shallow(
        <Provider store = {store}>
          <DropzoneComponent />
        </Provider>).dive();
      expect(wrapper.exists()).to.equal(true)
    });
});

The error is :

Invariant Violation: Could not find "store" in either the context or props of "Connect(withRouter(DropzoneComponent))". Either wrap the root component in a , or explicitly pass "store" as a prop to "Connect(withRouter(DropzoneComponent))".

Sakhi Mansoor Sakhi Mansoor · Accepted Answer · 2018-08-24T21:18:01

your component is wrapped with withRoter you need to expose it while shallow rendering it with WrappedComponentlike this:

describe('Dropzone component live test', () => {
it('renders the component', () => {
  const wrapper = shallow(
    <Provider store = {store}>
      <DropzoneComponent.WrappedComponent />
    </Provider>).dive();
  expect(wrapper.exists()).to.equal(true)
 });
});

Let me know if the issue still persists

Test component with a store Mocha and Enzyme

1 Answers