I used to have a global file with all my selector mocks. It was a list of all my store selectors and looked like below:
jest.mock('redux/mainData/selectors', () => ({
selectLoading: jest.fn(() => false),
selectData: jest.fn(() => [{ id: '1' }]),
}));
It used to work like a charm, but when I tried upgrading Jest to v29 it doesn't any more.
In jest.setup.ts
there was (and is):
jest.mock('react-redux', () => ({
useSelector: jest.fn(fn => fn()),
}));
When I'm testing a component, that has:
const data = useSelector(selectData);
and then below in the component
data?.map(...)
I'm getting:
Error: Uncaught [TypeError: Cannot read properties of undefined (reading 'data')]
My file with mocked selectors has about 300 mocked selectors so now basically every test fails.
I tried doing:
jest.mock('redux/mainData/selectors', () => ({
selectData: () => ([{ id: '1' }]),
}));
or
jest.mock('redux/mainData/selectors', () => ({
selectData: jest.fn().mockReturnValueOnce([{}]);
}));
but both didn't work.
My example selector:
export const selectData = createSelector(
selectMainData,
({data}) => data,
);
I'm using Jest v29.5.0 and Reselect v4.1.8