enzymejs / enzymejs/enzyme

Issue with shallow testing component handling redux hooks

Open
#2,282 12 comments 14 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
19.8k
Forks
2k
PR merge metrics
No merged PRs in 30d

Description

Hello,

I have an issue concerning shallowing component with redux provider.

I'm using a useSelector hook from "react-redux", but this one seems not being able to reach the redux context despite this one to be mounted in the wrappingComponent option of shallow.

Here's my code:

```
import configureStore from 'redux-mock-store';
import { Provider } from 'react-redux';
import { shallow, mount } from 'enzyme';

const mockStore = configureStore([]);
store = mockStore({
data
});

const wrapper = shallow(, {
wrappingComponent: Provider,
wrappingComponentProps: { store }
})
```

I also tried this solution, not working either:
```
const wrapper = shallow(, {
wrappingComponent: ({ children }) => (

)
})
```

And I'm getting the following error:

```
Invariant Violation: could not find react-redux context value; please ensure the component is wrapped in a
```

I also tried to dive() the shallowed provider. Same issue.

I think the problem is in the library, cause the lone solution found (and working) is mounting... But I try to avoid mounting for performance reasons. I'm asking here because I don't know if I have to ask enzyme or react-redux but in my opinion, since it's the test issue, asking here seems being pertinent, maybe I'm wrong...

I'm using enzyme-adapter-react-16 as well.

Would you have a solution or will you publish a fix for this?

Thanks :)

Contributor guide

Open the contributing guide

Research direction

Start by reproducing the provided shallow() examples with the React-Redux Provider and enzyme-adapter-react-16, then compare their behavior with mount(). Inspect Enzyme's shallow rendering and wrappingComponent handling. Done means determining whether the library can expose the Redux context to useSelector during shallow rendering, or documenting that mounting is required.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react
Domain
frontend, testing-qa
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
30/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.