Using a Provider but still seeing error Invariant Violation: Could not find "store" in the context of "Connect

Question

I have looked at several answers but all recommend to wrap the main component in a Provider.

I have already done that but the error remains.

This is my App.js component

const App = ({ store }) =>
  <Provider store={store}>
    <div className="App">
      <Users/>
    </div>
  </Provider>

And I am doing a very simple test. First time using enzyme,

import React from 'react'
import Adapter from 'enzyme-adapter-react-16'
import Users from './'
import { shallow, configure } from 'enzyme'

configure({adapter: new Adapter()});

describe('First React component test with Enzyme', () => {
  it('renders without crashing', () => {
    shallow(<Users />);
  });
});

The error is:

Invariant Violation: Could not find "store" in the context of "Connect(Users)". Either wrap the root component in a Provider, or pass a custom React context provider to Provider and the corresponding React context consumer to Connect(Users) in connect options.

Answer 1

A possible solution is as follows:

import React from "react";
import { shallow } from "enzyme";
import { Provider } from "react-redux";
import configureMockStore from "redux-mock-store";
import Userfrom "../User";

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

describe('First React component test with Enzyme', () => {
  it('renders without crashing', () => {
    shallow(
     <Provider store={store}>
      <User/>
     </Provider>
    );
  });
});