问题标签 [react-testing-library]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
reactjs - 为什么 react hook 与 fetch api 一起使用时会抛出 act 错误？
Warning: An update to App inside a test was not wrapped in act(...).每当我发出 API 请求并更新状态时，我都会不断地进入我的测试套件。
我正在使用反应测试库。我也尝试使用 ReactDOM 测试工具，得到了相同的结果。我尝试的另一件事是将容器包装在 中act，仍然得到相同的结果。
请注意：我的应用程序有效并且我的测试通过了。我只需要知道我做错了什么，或者是否是 react-dom 包中的错误导致该错误出现。模拟控制台错误并将其静音是不好的。
这是钩子的实现：
reactjs - eslint 插件 fp、jest 和 react 测试库导致不必要的 linting 错误
我安装了插件eslint-plugin-fp来帮助我编写更好的代码。我正在编写一个 React 应用程序。我使用 Jest 和 react-testing-library 进行 TDD 编写测试。
我遇到的问题是该插件在测试文件中引发了很多错误，因为describe没有返回任何内容。
您如何将该插件与测试结合使用？
reactjs - 开玩笑 - 承诺在模拟中解决多少时间后？
我有一个开玩笑的测试，我在其中模拟 axios 的实现。
当我渲染我的组件时，它会发出一个 api 调用。
我需要测试我们拨打电话时是否出现了微调器。我需要测试调用完成后微调器是否消失。
我怎么知道模拟承诺何时解决？
not.toBeNull我如何确定在调用时承诺尚未解决？
注意：我正在使用反应测试库，但问题通常与模拟承诺解决的时间有关。
reactjs - 使用 react-testing-library 进行测试时，我可以手动触发状态更改吗？
我仍在将我的酶测试转移到 react-testing-library 的过程中，并且我有一个相当常见的场景，当组件安装时，它会启动 Ajax 请求以获取一些数据。就在 fetch 开始之前，它设置了一些状态值来指示它正在加载，这反过来又呈现了一个微调器。完成后，状态将同时更新数据，并且“loadingState”在适当的情况下设置为“Completed”或“Failed”。
使用 Enzyme，我可以手动将状态设置为任何一个loadingStates键，并断言渲染条件会渲染适当的更改。
有没有办法可以在 RTL 中做到这一点？
reactjs - 使用 react-testing 库提交 Formik 表单
我正在寻找为 LoginForm 触发提交处理程序。但是，由于某种原因，不是调用我的模拟函数，而是触发了组件的实际处理程序（调用外部 api）。如何确保我的模拟处理程序被调用？
下面是三个感兴趣的组件（演示、容器和测试套件）
登录表单.js
登录页面.js
登录页面.spec.js
reactjs - 如何使用 react-testing-library 在 react-select 组件上触发更改事件？
鉴于我无法直接使用 测试内部react-testing-library，我将如何测试使用 的组件react-select？例如，如果我有一个基于 的值的条件渲染react-select，它不渲染传统的<select/>，我仍然可以触发更改吗？
我什至不确定我应该查询什么。是隐藏输入吗？
reactjs - react-testing-library: Render prop - 最后一次调用的预期模拟函数：[false] 但它没有被调用
今天我面临一个使用react-testing-library.
出于某种原因，react-testing-library似乎不明白渲染道具已被调用。更准确地说，它似乎不会在第一次渲染后重新渲染孩子。
代码看起来像这样（简化）
index.test.js
index.js
不幸的是，当我这样运行测试时，它没有通过：
如果我在它工作正常props.children(false)之前添加。if (loading) {} condition
如果我console.log在 index.js 中，我可以看到代码到达最后，即之前return props.children(someData)但react-testing-library不明白有重新渲染并且再次调用渲染道具。
有没有人遇到过这样的问题？谢谢 ！
javascript - TypeError：无法读取未定义的属性“更改”
为什么下面的代码会出现这个错误？我已经从“react-testing-library”导入了“模拟”，但错误指出“模拟”是“未定义”
我正在搜索此问题，但找不到有关“模拟”行为的任何信息
react-testing-library - react-testing-library 使用完整渲染不是多余的吗？
我有一个关于反应测试库的问题。如果您正在进行钩子开发，这似乎是测试库的首选，因为 Enzyme 目前似乎不支持钩子，谁知道它是否至少从浅渲染的角度来看......至少从我'此时已阅读。所以让我对 react-testing-library 有点疯狂的原因是它建议进行完整的渲染、触发点击、更改等来测试你的组件。那么，如果您要更改 Button 组件的功能，我们会说，所有使用它的测试都会破坏吗？当您已经在测试该组件时，在该组件的每个子组件上渲染和运行测试似乎不是很奇怪吗？您是否希望在父组件中模拟所有这些组件？不'
reactjs - 测试是否已使用 Jest 调用了 React prop 方法
我有一个 Input 组件，它接受一个 prop 方法并在用户输入内容时调用它。代码本身按预期工作，但由于某些原因，测试失败。它认为没有调用 prop 方法。为什么会这样？出于测试目的，我使用 Jest 和 react-testing-library。
第二个问题。在实际应用中，我的想法是测试传递给该 prop 方法的参数。它是否被认为是一个实现测试（我知道我应该测试它）？
输入.js
测试