模拟一个标准的 npm 项目很简单。在 node_modules 文件夹旁边创建一个 __mocks__ 文件夹，然后将包的名称作为文件并在其中写入模拟内容。
示例:/__mocks__/axios.ts
我坚持的地方是有一个 npm 包导入，看起来像这样: @auth0/auth0- react
我如何模拟这个文件的内容？我尝试创建一个名为 @auth0/auth0-react.tsx 的文件，但 jest 似乎没有提取模拟文件。当我导入 import { Auth0Provider } from '@auth0/auth0-react'; 和 console.log(Auth0Provider) 时，我得到的只是标准的 Jest。 fn() 属性。
这是模拟文件的内容
/* eslint-disable import/prefer-default-export */
export const Auth0Provider = (component: JSX.Element): JSX.Element => component;
因为我没有在这个方法上使用 jest.fn()，所以我期望 console.log(Auth0Provider) 显示它包含一个函数。
在我的测试代码中，我在测试之前有 jest.mock('@auth0/auth0-react')。有什么想法吗？
最佳答案
我通过 another StackOverflow question 找到了解决方案由 kcarra 提供。
总结一下答案，我会用2点来回答:
__mocks__目录必须在被测试文件附近。如果您的文件在/src/MyComponent 下，那么 mocks 文件夹的路径应该是/src/__mocks__/。__mocks__下的文件夹结构必须模仿导入中显示的路径。在我的场景中，我需要创建一个名为@auth0的文件夹，然后在该文件夹中创建一个名为auth0-react.tsx的文件。
以下是我构建测试和模拟文件的方式。
- 模拟:
/src/__mocks__/@auth0/auth0-react.tsx - 测试:
/src/__tests_/MyComponent.tsx - 实际组件文件:
/src/MyComponent.tsx
关于typescript - 如何模拟包含正斜杠的模块？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/68945478/