问题标签 [jest-dom]

当我添加到我的 test-setup.js 中 import "@testing-library/jest-dom";时，当我运行任何测试时，Jest 会抛出这个错误。如果我删除导入一切正常。尝试直接在测试文件中添加导入，没有成功。

这就是 test-setup.js 的样子：

错误：

我想将反应测试库添加到使用 mocha 和 chai 进行单元测试的项目中。当我写断言时，我有点难过，大多数例子都使用了 jest 和 jest-dom。我真的很热衷于使用像toBeInTheDocument或这样的断言toHaveTextContent

我想知道是否有适合替代 jest-dom 的 chai 插件？或者您找到了哪些替代解决方案来使用带有 mocha 和 chai 的反应测试库？

我使用“create React App”创建了一个 React.js 应用程序，并且我正在学习运行测试。

expect().toBeInTheDocument如果我不导入，为什么在下面的代码中可以使用@testing-library/jest-dom？

我正在测试一个反应组件，它有一个Material-ui更新布尔字段的简单开关。当我在本地运行应用程序时，该组件可以正常工作。

在我的测试中，我通过MockedProvider. 模拟的提供者按预期工作，我可以看到初始响应和更新响应到达并更新状态。但是，当我找到开关并在屏幕上检查它时，它保持未选中状态。我的测试失败了：

Received element is checked: <input checked="" class="PrivateSwitchBase-input-40 MuiSwitch-input" name="callbackEnabled" type="checkbox" value="" />

我的第一个猜测是 React 不会重新渲染这种状态变化。我需要以某种方式强制重新渲染吗？或者测试这种行为的正确方法是什么？

考试：

我正在开发一个反应应用程序，突然添加两个测试后我得到一个错误，即

我试图实施我在互联网上找到的解决方案，但没有任何效果。这是我的两个测试文件，第一个，

第二个是，

最后是我的 package.json

这就是我的 JSON 文件的样子。我试图编辑 setuptest.js 文件。但问题还是一样。

我正在尝试添加@testing-library/jest-dom到我的项目中，但没有运气。它由 yarn 安装到我的开发依赖项中，并在 setupTests.js 中导入：

测试失败：

我哪里错了？

我想用 Jest 编写一个单元测试，用jest-dom作为一个模拟 DOM——而不必转译。我希望我所要做的就是通过 CommonJS 导入来导入 jest-dom 包。但是当我这样做时，然后运行我的测试（使用npm test），它仍然失败：

ReferenceError: document is not defined（此处为完整输出）

任何想法如何解决这个问题？我的测试文件如下。

谢谢。

我的代码

myApp.test.js

我正在为我的 React 项目编写测试代码。我要检查的是“如果输入类型是数字，则不允许插入文本”。下面是我写的测试代码。

我在这里所期望的是获得初始值0，作为 的结果toHaveValue。但它实际上返回null。

你可能会想'是的，你试图在数字类型的输入中插入一个文本，这就是它返回 null 的原因'，但有趣的是它debug()并按我的预期console.log(input.value)返回。0

而且，如果您手动尝试将文本值插入浏览器上的数字输入，它实际上会显示初始值 0。任何人都知道为什么toHaveValue并debug显示不同的结果？

我正在测试我的应用程序，但遇到了问题。当试图测试我的下拉组件中的一行是否对悬停产生影响时，我注意到我无法检查元素的背景颜色，我觉得这很奇怪。

尝试使用 jest-dom 匹配器“toHaveStyle()”，以下是一个我一生都无法让它工作的例子。

dropdown.test.tsx

错误

我也尝试过使用“背景颜色”，使用十六进制值（另一个有趣的错误是 PrettyDom 将十六进制转换为 RGB），或者添加 ; toHaveStyle() 中的声明。

我确定元素确实是白色的，我不明白出了什么问题。如果我的方法是不好的做法，并且您对如何检查有更好的了解，或者您对我的问题有解决方案，请告诉我！

我正在尝试为复选框组件创建一些测试，但看起来我无法断言input[type="checkbox"]何时被禁用。

在前两个块中，我正在测试复选框是否可以选中/取消选中元素是否被禁用，这里一切正常。

对于最后两个块，我正在尝试相同的方法来检查/取消选中，但现在我将属性设置disabled为元素，但看起来库忽略了属性

这是我的测试

和控制台输出