I have a basic app based on stock create-react-app, meaning its jest configuration is default as well. My folder structure is as follows:
src
└── __mocks__
└── Item.js
└── __tests__
└── Item.test.js
└── List.test.js
└── Item.js
└── List.js
My mock is rather simple - I'm retrieving the original component that is wrapped within react-dnd context:
../__mocks__/Item.js
import Item from "../Item"
export default Item.DecoratedComponent
In my Item.test.js, if I import from the __mocks__ folder directly, my tests run just fine:
import Item from '../__mocks__/Item'
However, I would like to instead instruct jest to use the mocked version of this module, something like this:
import Item from '../Item'
jest.mock('../Item')
The reason I want to do this is because when I write tests for the List component, which internally renders a number of Item components, I will not be importing the Item components directly in the List.test.js, but instead I would like to also instruct jest to use the mocked Item module.
The above, however, doesn't work for me, i.e. my tests seem to be using the original Item component, although there are suggestions that this should work.
What am I doing wrong? How do I instruct jest correctly to use the mocked instance of the module?
