问题标签 [react-testing-library]

我正在使用 TypeScript 构建一个 React Native 应用程序。我正在使用React Native 测试库进行组件测试。

我有一个简单的组件，它呈现两个可点击的图标和一个文本。这是一个可以递增和递减数字的计数器。

我想写一个简单的单元测试，看看用户是否能看到金额。这是我写的。

问题是这个测试抛出错误：

即使在输出中debug我可以看到渲染的数量：

这里发生了什么？为什么 React 测试库看不到这段文字？我该如何测试呢？

尝试使用 react-testing-library 编写我的第一个测试，但它似乎无法获取正确的 material-ui 元素。

https://codesandbox.io/s/lx5nl1839z

我收到错误消息说该事件从未被触发。

预期的模拟函数被调用了一次，但它被调用了零次。

当我将button材料 ui 中的 Button 更改为常规按钮而不是 Button 时，它就可以工作了。

这是我的测试

这是我的组件：

https://github.com/greena13/react-hotkeys

https://github.com/kentcdodds/react-testing-library

我无法触发热键（开玩笑）。一个演示组件：

这是一个测试：

这是我的笑话设置文件：

有任何想法吗？

新反应。什么是测试组件值更新的正确方法，这取决于其他组件中的操作？使用jest+ react-testing-library。

想象一下，只有 2 个组件（兄弟）和一个通过全局状态更新的值。

这是测试：

表单位于一个组件中，而值显示在另一个组件中。它们是同时渲染的。在此测试中，第二个组件中的值永远不会更新。测试它的正确方法是什么？如果这是正确的方法 - 可能出了什么问题？

使用 AirBnB 的酶，我们可以设置组件的状态：

我想使用 react-testing-library 做同样的事情。

谢谢！

我刚刚开始使用 react-testing-library，所以我猜测这最终归结为用户错误，但我看到以下行为对我来说没有意义。

对于在新创建的 CRA 应用程序中运行以下测试并使用 jest-dom 3.0.0 和 react-testing-library 5.4.4：

因为事情是我得到以下失败：

根据作业验证 UI 状态 › 使用以前的数据挂载

但是，如果我禁用第一个测试，第二个现在应该会通过。如果我重新排序，第一个测试总是通过，第二个总是失败，即使第一个测试是“使用先前数据装载”测试。

不确定这是否是测试库、jest-dom 或我的代码中的问题，但对于如何正确构建这些测试的任何建议将不胜感激。

What is the difference between enzyme, ReactTestUtils and react-testing-library for react testing?

The ReactTestUtils documentation says:

ReactTestUtils makes it easy to test React components in the testing framework of your choice.

The enzyme documentation just says:

Enzyme is a JavaScript Testing utility for React that makes it easier to assert, manipulate, and traverse your React Components' output.

React-testing-library documentation:

The react-testing-library is a very light-weight solution for testing React components. It provides light utility functions on top of react-dom.

Why is actually every solution easier and what can't be achieved with the other one?

我正在使用getByTestIdReact 测试库中的函数：

是否可以/建议搜索 HTML 元素？所以是这样的：

在 Create React App 创建的应用程序模板中的测试脚本中，我看到了一个函数 it()，如下所示：

它来自哪个图书馆？它有什么作用？

谢谢你。

典型的在线购物商店。我正在尝试测试当用户尝试下订单时 AJAX 请求失败的场景。用户也可以选择订阅服务，但只有在下单成功的情况下才会发出订阅请求。

为了测试这个失败的场景，我使用了 Promise 拒绝，但未捕获的错误冒泡并导致测试失败。

有谁知道我如何测试这个，最好不要在组件的方法中添加catch链接？Jest或react-testing-library是否提供替代方法来测试这种情况？onSubmitConfirmationwait

我知道 Jest 提供.rejects但我无法弄清楚我应该如何重组我的测试以使其与 .rejects 一起使用wait。

组件：

考试：

请注意，上面的代码片段是不可执行的——实际上，该组件比上面的示例要复杂一些，但我已尝试在不歪曲问题的情况下尽可能地简化它。

编辑

用错误边界包装<Confirmation/>另一个组件似乎也不起作用。该错误仍然会使组件树冒泡以使测试失败：