在使用React和Jest时,我遇到了一个手动模拟的用例,我不知道如何克服它。给定以下结构:
.
├── code.test.tsx
└── module
├── __mocks__
├── index.tsx
├── module.tsx
└── submodule
├── __mocks__
└── index.tsx
我正在code.test.tsx
中编写测试。组件module
和submodule
确实包含手动文件mock,它返回用于单元测试目的的伪代码。
module/index.tsx
充当组件本身和子模块的导出点:
export * from './submodule'
export { module } from './module.tsx'
通过这种方式,code.tsx
内部的导入更加有序:
import { module, submodule } from './module'
最后,在code.test.tsx
中,我通过调用jest.mock('./module')
来模拟module
的导入。所需的行为应该是module
和submodule
被模拟,因为这两个组件都包含一个__mocks__
文件夹。
由于module/__mocks__
导出的mock只定义其自身,因此底层组件是未定义的。在这种情况下,我通常会调整导入以直接指向组件。但是,由于导入提供了高级可读性,我希望递归地模拟存在__mocks__
目录的子文件夹。有可能实现吗?
根据关于使用手动mock的Jest文档,明确要求对__mocks__
目录中的模块进行mock。
当我们在测试中需要该模块时,显式调用需要jest.mmock('./moduleName'(。
请确保您已在测试文件中显式模拟模块和子模块导入。