TypeError: Cannot redefine property: useSelector

What version of React, ReactDOM/React Native, Redux, and React Redux are you using?

• React: “17.0.2”
• React Native: “0.68.2”
• Redux: “4.2.0”
• React Redux: “8.0.1”

What is the current behavior?

In some test cases I used spyOn for mock useSelector hook -

import * as ReactRedux from 'react-redux';

jest.spyOn(ReactRedux, 'useSelector').mockReturnValueOnce({value: mockValue});

after updating to “8.0.1”, I’m getting error -

TypeError: Cannot redefine property: useSelector
        at Function.defineProperty (<anonymous>)

What is the expected behavior?

everything was okay on

"react-redux": "7.2.8",
"redux": "4.1.2",

Which browser and OS are affected by this issue?

No response

Did this work in previous versions of React Redux?

• Yes

[cafesanu]

This solved our issue:

const mockDispatch = jest.fn();
const mockSelector = jest.fn();

jest.mock("react-redux", () => ({
 ...jest.requireActual("react-redux"),
 useDispatch: () => mockDispatch,
 useSelector: () => mockSelector,
}));

[phryneas]

I will add to that that this is caused by a babel default setting. Mocking imports is extremely flimsy and cannot really be relied on. While we can make this work for now, I want to 💯 stress what @markerikson already said a few times: this is not how we recommend testing components. Testing components in isolation with directly mocked methods will not give you a lot of confidence at all - you are essentially testing implementation details, not actual functionality.