1

does anyone have any ideas how I can fix the following error?

could not find react-redux context value; please ensure the component is wrapped in a Provider

Here's the component part that fails:

const Main = () => {
    const toggleMoreOptions = useSelector(selectToggleMoreOptions);
    return (<div>...</div>)
    ...
}

Here's the test suite:

import React from 'react';
import { shallow } from 'enzyme';

describe('Main', () => {
    let mainWrapper;

    beforeAll(() => {
        mainWrapper = shallow(<Main />);
    });
    ...
}

I've also tried doing this instead:

const initialState = { toggleMoreOptions: false };
const mockStore = configureStore();
let store, mainWrapper;

beforeAll(() => {
    store = mockStore(initialState);
    mainWrapper = mount(
        <Provider store={store}>
            <Main />
        </Provider>
    );
    ...
}

Which results in this error:

TypeError: Cannot read property 'toggleMoreOptions' of undefined

Thank you in advance, I appreciate any insight anyone has...

  • Seems like the second one you tried is correct, have you checked if you are properly initializing the `selectToggleMoreOptions` in redux? – psdr03 May 18 '21 at 00:44
  • No, I double checked. I've used this configuration with other projects. It's redux toolkit. I'm not sure if that's the issue. Thank you for the suggestion though. – Ari Toren-Herrinton May 18 '21 at 17:00

0 Answers0