React Jest匹配快照,使用子组件测试组件时崩溃

托尼·查兹(Toni Chaz)

我有一些组件,这些组件带有第三方插件/库中的子组件。我将Jest用于单元测试和toMatchSnapshot()方法。我试图用排除子组件,jest.unmock('ChildComponet.js')但出现此错误:

调用了jest.unmock('ChildComponet.js'),但禁用了自动模拟功能。通过删除jest.unmock对该测试不必要的调用或启用此测试的自动模拟功能jest.enableAutomock();该警告很可能是Jest 15中默认配置更改的结果。

我启用了jest.enableAutomock();,现在出现错误:

TypeError:无法读取未定义的属性“ DEFINE_MANY”

我把它放在我的package.json上,但是什么也没发生:

“ unmockedModulePathPatterns”:[“ rootDir / node_modules / react”]

有任何想法吗?

React中对组件进行单元测试的正确方法是什么?

安德烈亚斯·科伯勒(AndreasKöberle)

模拟到目前为止我发现的React组件的最简单方法是使用:

jest.mock('component', ()=> 'ComponentName')

在要测试的模块的import语句之前。

第一个参数可以是全局npm模块的名称,也可以是本地组件的路径(请注意,相对于测试文件的路径)。第二个参数只是一个返回字符串的函数(我总是返回我在jsx中使用的相同名称)。这将导致转储组件不执行任何操作,但其名称与原始组件相同。因此,在快照中您将看不到任何区别,除了模拟组件不会渲染任何子项。

现在到您收到的错误消息。

jest.unmock('ChildComponet.js')被调用但是自动模拟被禁用了...

问题是您使用jest.unmock而不是jest.mockJest具有自动模拟模块的所有依赖项的功能。启用自动模拟后,您可以用来jest.unmock为lodash或moment之类的一些基本lib进行真正的植入。由于自动模拟功能使很多人感到困惑,因此他们决定将其设为可选。在Tldr中,您尝试取消对最初没有被模拟的内容的模拟,因为您未启用自动模拟。

TypeError:无法读取未定义的属性“ DEFINE_MANY”

启用自动模拟时,每个导入的模块都将替换为undefined关于unmockedModulePathPatterns设置,我不能说太多,但我相信您必须使用与导入模块相同的模式,因此,如果它是全局的,则不必在其中放置node_modules文件夹的路径

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

异步组件时使用React的Jest和酶进行测试

在 React Jest/Enzyme 中测试子组件的条件渲染

快照测试的工作方式以及在React组件的Jest Snapshot测试中toMatchSnapshot()函数做什么?

使用React和Jest测试React中的组件功能

当组件使用事件时使用酶测试 React 组件

用Jest测试时如何用模拟替换React组件

测试React组件时未调用Jest模拟

Jest快照测试具有随机生成的ID(UUID)的React组件

使用 ts-jest 调试打字稿测试时 .tsx React 组件中的错误

使用Jest使用Hooks测试React功能组件

如何在Jest中使用NavigationEvents测试React Native组件

如何使用Jest + Enzyme测试React组件的样式?

使用Jest / Enzyme延迟后意外测试React组件的行为

使用Enzyme Jest测试React组件以查找HTML元素

开始使用Enzyme和Jest测试React组件

如何使用Jest测试React组件的onClick行?

使用Jest on React组件进行单元测试

使用 jest 和 react-testing-library 测试连接的组件

如何使用Jest通过localStorage测试React组件?

如何使用 Jest 测试 React 函数组件状态?

测试无状态功能组件时,从高阶组件中检索React子组件

React Native 异步 Jest 组件测试

在 React Jest 中测试组件的隔离功能

如何使用React +酶测试子组件不存在

当我使用 jest 测试 react 组件时,它会抛出“Invariant Violation:Element type is invalid: expected a string (for built-in components)”

使用 react-query 和 axios 测试 React 组件中的错误的问题。使用 React 测试库、Jest、MSW 进行测试

如何使用react-testing-library对进行异步数据加载的组件进行快照测试?

测试时在 React 组件回调上使用 sinon fakes

在测试React组件时尝试使用模拟功能