如何在 react-testing-library 中设置状态
How to setState in react-testing-library
概览：
- 我重构脚本测试之前是用Enzyme测试的，现在想用@testing-library/react
问题：
- 我在@testing-library/react
中找不到setState的解决方案
无论是否使用测试库，使用 setState 都是危险的方法。
- 这取决于实施细节（例如，属性 状态内的名称）因此维护测试变得更加困难 - 更多测试需要更改，当应用程序正常时容易导致测试中断等。
- 一旦将 class 组件转换为带有挂钩的功能组件，就无法调用它。所以你更依赖于实现细节。
- 最后，直接状态操作可能会以您在现实世界中永远无法获得的状态结束。这意味着你的组件将被破坏，因为它不可能达到某种状态，但你的直接初始化测试会很好。
那么你最好做什么？提供道具、更改道具、调用道具（wrapper.find('button').filter(button => button.text() === 'Cancel').props().onClick() 用于酶，fireEvent.click(getByText(/Cancel/i)) 用于 RTL）并验证渲染的内容。
这样您的测试将更短、最实际并且在您更新被测组件后需要更少的更改。
概览：
- 我重构脚本测试之前是用Enzyme测试的，现在想用@testing-library/react
问题：
- 我在@testing-library/react 中找不到setState的解决方案
无论是否使用测试库，使用 setState 都是危险的方法。
- 这取决于实施细节（例如，属性 状态内的名称）因此维护测试变得更加困难 - 更多测试需要更改，当应用程序正常时容易导致测试中断等。
- 一旦将 class 组件转换为带有挂钩的功能组件，就无法调用它。所以你更依赖于实现细节。
- 最后，直接状态操作可能会以您在现实世界中永远无法获得的状态结束。这意味着你的组件将被破坏，因为它不可能达到某种状态，但你的直接初始化测试会很好。
那么你最好做什么？提供道具、更改道具、调用道具（wrapper.find('button').filter(button => button.text() === 'Cancel').props().onClick() 用于酶，fireEvent.click(getByText(/Cancel/i)) 用于 RTL）并验证渲染的内容。
这样您的测试将更短、最实际并且在您更新被测组件后需要更少的更改。