I am using Jest + React Testing Library in my project, and in one of my components, I have a common index.ts
that exports all the internal components like:
src/components/commonComponents/index.ts:
import A, { IAProps as AType } from './components/A';
import B, { IBProps as BType } from './components/B';
import { C, commonFunc } from './components/Shared';
export type IAProps = AType;
export type IBProps = BType;
export { A, B, C, commonFunc };
And I have a component making use of that like:
src/mainComponent:
import { A, commonFunc } from 'components/commonComponents';
I am trying to test mainComponent
, as can be seen on top, I need to import 2 of the components being exported in the same index.
I mocked all redux selectors so that, I wouldn't have issues with it. But for some reason the import on top, makes react-testing-library to give me an error on redux (a-if I missed mocking a function) on component B that I am not using anywhere and therefore also not mocking anything for that. But if I changed the above import to something like:
import A from 'components/commonComponents/components/A';
import { commonFunc } from 'components/commonComponents/components/Shared';
I don't get the error anymore...
Any idea what can I do? I can't change all my components to be imported directly from each main file since sometimes I wrap my component with HOC in the index, and they will be needed in future tests...