具有顶级导出功能的 Jest 手动模拟子模块答案

【问题标题】：Jest manual mock sub modules with top level export具有顶级导出功能的 Jest 手动模拟子模块
【发布时间】：2021-06-27 13:35:29
【问题描述】：

在使用 React 和 Jest 时，我遇到了手动模拟的用例，我不知道如何克服。给定以下结构：

.
├── code.test.tsx
└── module
    ├── __mocks__
    ├── index.tsx
    ├── module.tsx
    └── submodule
        ├── __mocks__
        └── index.tsx

我正在code.test.tsx 中编写测试。组件 module 和 submodule 确实包含手动文件模拟，它们返回用于单元测试目的的虚拟代码。

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__ 导出了仅定义自身的模拟，因此底层组件未定义。在这种情况下，我通常会调整导入以直接指向组件。但由于导入提供了高级可读性，我想递归地模拟有__mocks__ 目录的子文件夹。有可能实现吗？

【问题讨论】：

【解决方案1】：

根据Jest docs on using manual mocks，明确要求您模拟存在于__mocks__ 目录中的模块。

当我们在测试中需要该模块时，显式调用 jest.mock('./moduleName') 是必需的。

请确保您在测试文件中明确模拟了模块和子模块导入。

【讨论】：