【发布时间】：2019-11-16 17:07:39
【问题描述】：
概述：
- 我在使用 Enzyme 测试之前重构了脚本测试，但现在，我想使用 @testing-library/react
问题：
- 我在 @testing-library/react 中找不到 setState 的解决方案
【问题讨论】：
标签： setstate react-testing-library
【发布时间】：2019-11-16 17:07:39
【问题描述】：
无论使用测试库，使用setState 都是危险的方法。
- 这取决于实现细节（例如，状态内的属性名称），因此维护测试变得更加困难 - 需要更改更多测试，在应用正常时很容易破坏测试等等。
- 一旦将类组件转换为带钩子的功能组件，就不能调用它。因此，您更加依赖实施细节。
- 最后，直接状态操作可能会以您在现实世界中永远无法获得的状态结束。这意味着您的组件将被破坏，因为它不可能达到某种状态，但您的直接初始化测试会很好。
那你最好做什么？提供道具、更改道具、调用道具（wrapper.find('button').filter(button => button.text() === 'Cancel').props().onClick() 用于酶，fireEvent.click(getByText(/Cancel/i)) 用于 RTL）并验证渲染的内容。
这样，您的测试将更短、更实际，并且在您更新被测组件后需要更少的更改。
【讨论】：
-
这是一个很好的理想，但不是很实用。如果按钮不在此组件中怎么办？我们应该单击其他一些组件按钮吗？这也很脆弱，打破了测试单元的想法。
-
其他“其他组件按钮”如何影响该组件的状态？传递道具？更新共享上下文？导航到浏览器位置？他们以任何方式交流，您都可以用来间接设置状态
-
传递一个道具。说它消耗页脚或其他东西。该页脚拥有该按钮。我们传递一个状态改变函数给它。我们无法访问 prop 本身，因此我们必须单击另一个组件拥有的按钮。然后有时会更新页脚组件以具有不同的按钮文本，为什么测试会在消费组件中中断？这会破坏单元测试
-
我不关注，抱歉。你在谈论渲染道具还是什么？还是传送门？
-
还是您的意思只是典型的“组件页脚在内部呈现组件按钮”？如果是这样，并且您真的担心“组件 Button 会显着改变其逻辑并开始渲染一些真正不同的东西”，您可以使用
jest.mock()模拟测试页脚的按钮，这样您将始终拥有@987654325 @ 是原生的<button>，即使真正的<Button>开始渲染<svg>。因此，<Footer>的测试将尽可能“隔离”。