酶,ReactTestUtils和反应测试库之间的区别

Bla*_*ack 11 reactjs enzyme react-testing-library

酶,ReactTestUtils和用于反应测试的react-testing-library有什么区别?

ReactTestUtils文档说:

ReactTestUtils使您可以轻松地在您选择的测试框架中测试React组件。

酵素文件只是说:

Enzyme是一种用于React的JavaScript测试实用程序,使断言,操作和遍历React Components的输出变得更加容易。

React-Testing-Library文档:

react-testing-library是用于测试React组件的非常轻巧的解决方案。它在react-dom之上提供了轻量级的实用程序功能。

为什么实际上每个解决方案都更容易,而另一个解决方案却无法实现?

Gio*_*Gpx 25

ReactTestUtils为您提供了测试React组件的最低要求。我还没有看到它被用于大型应用程序。

酶和反应测试库都是很好的库,它们为您提供了测试应用程序所需的所有工具。他们有两种不同的哲学。

酶使您可以访问组件的内部工作原理。您可以读取并设置状态,还可以模拟子项以使测试运行更快。

另一方面,react-testing-library不允许您访问任何实现细节。它呈现了组件并提供了与之交互的实用方法。这个想法是,您应该以与用户相同的方式与应用程序通信。因此,您无需设置组件的状态,而是重现用户为达到该状态所要做的动作。

以我的经验,酶更容易掌握,但从长远来看,它很难维护。react-testing-library迫使您编写平均而言更复杂的测试,但它使您对代码有更高的信心。


Est*_*ask 13

适用于单元/集成测试。其API旨在测试实现。它提供了不需要DOM(用于浅层渲染)的自定义渲染器,其行为与React渲染器不同,并允许对单元测试很重要但默认渲染器无法实现或简单的事情,例如同步状态更新,浅层渲染,禁用生命周期方法等

react-testing-library用于黑盒集成/ e2e测试。它在内部使用React渲染器和ReactTestUtils,需要真实的DOM,因为它是在测试中而不是内部声明的组件输出。它没有提供用于隔离单元测试的功能,但是可以通过模拟包含需要特别通过其他方式进行间谍,模拟或存根的组件的模块来实现jest.mock

react-dom / test-utilsreact-test-renderer包含功能的子集,在它们之上构建了酶和react-testing-library。API稀缺,并且需要编写样板代码或自定义实用程序功能来进行全面的测试。React 正式推广酶和反应测试库作为更好的选择。

  • 截至 2021 年,React 现在仅推荐 React 测试库 (https://reactjs.org/docs/testing.html) (7认同)
  • 一个重要的澄清是酶和React-Testing-Library是在ReactTestUtils之上构建的自定义实用程序。在那非常有用的:) (4认同)

Jas*_*Jin 9

在 Enzyme 中,我们使用组件的状态和属性来测试组件。这通常意味着测试很脆弱。假设我们已经为一个组件编写了测试并且它运行良好。但是,如果有人更改了组件中 state 或 props 的变量名称,那么即使组件的功能没有改变,我们的测试也会失败。这种行为表明了测试的脆弱性。

而在 React 测试库中,我们从用户的角度测试组件。假设我们要测试一个下拉组件,我们不会根据组件的状态和属性来测试该组件。相反,我们使用 DOM 元素来测试它,即用户如何与其交互。

React 测试库的主要目的是通过以用户使用组件的方式测试组件来提高测试的信心。用户并不关心幕后发生的事情,他们只是看到输出并与之交互。您无需访问组件的内部 API 或评估其状态,而是通过根据组件输出编写测试来获得更多信心。

在某种程度上,React 测试库比 Enzyme 得到了更广泛的使用。

在此输入图像描述


Lyd*_*iks 5

React 测试库可以替代 Enzyme。它们有非常不同的测试理念 - Enzyme 鼓励(并提供实用程序)使用渲染的组件实例来测试实现细节,而 RTL 鼓励通过查询实际 DOM 节点并对其进行断言来仅测试“最终结果”。