【问题标题】:Difference between enzyme, ReactTestUtils and react-testing-library酶、ReactTestUtils 和 react-testing-library 之间的区别
【发布时间】:2019-06-06 17:34:34
【问题描述】:

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

ReactTestUtils 文档说:

ReactTestUtils 使得在测试中测试 React 组件变得容易 您选择的框架。

酶文档只是说:

Enzyme 是一个用于 React 的 JavaScript 测试实用程序,它使测试变得更容易 断言、操作和遍历 React 组件的输出。

React-testing-library 文档:

react-testing-library 是一个非常轻量级的测试解决方案 反应组件。它提供了轻量级的实用功能 反应域。

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

【问题讨论】:

标签: reactjs enzyme react-testing-library


【解决方案1】:

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

Enzyme 和 react-testing-library 都是很好的库,可为您提供测试应用程序所需的所有工具。不过,他们有两种不同的理念。

Enzyme 允许您访问组件的内部工作。您可以读取和设置状态,还可以模拟孩子以使测试运行得更快。

另一方面,react-testing-library 不会让您访问任何实现细节。它呈现组件并提供与它们交互的实用方法。这个想法是您应该以与用户相同的方式与您的应用程序进行通信。因此,与其设置组件的状态,不如重现用户为达到该状态而执行的操作。

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

【讨论】:

    【解决方案2】:

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

    react-testing-library 用于黑盒集成/e2e 测试。它在内部使用 React 渲染器和 ReactTestUtils,需要真正的 DOM,因为它是在测试中断言的组件输出,而不是内部。它不提供用于隔离单元测试的工具,但可以通过模拟包含需要通过其他方式监视、模拟或存根的组件的模块来做到这一点,特别是jest.mock

    react-dom/test-utilsreact-test-renderer 包含功能的子集,Enzyme 和 react-testing-library 是在它们之上构建的。 API 稀缺,需要编写样板代码或自定义实用程序函数以进行全面测试。 React officially promotes Enzyme 和 react-testing-library 作为更好的选择。

    【讨论】:

    • 一个重要的说明是 Enzyme 和 react-testing-library 是构建在 ReactTestUtils 之上的自定义实用程序。非常有用的:)
    • 截至 2021 年,React 现在只推荐 React 测试库 (reactjs.org/docs/testing.html)
    • 所以“jest”仅用于模拟目的?
    • @vikramvi 用于模拟、断言、运行测试... Jest 是测试框架,这就是它的目的。关于jest.mock 的提及,Enzyme 提供了额外的工具来模拟组件,这应该是在使用 RTL 时通过 Jest 来完成的。
    【解决方案3】:

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

    【讨论】:

      猜你喜欢
      • 2020-03-28
      • 2021-10-20
      • 2021-06-02
      • 2019-07-07
      • 2020-08-31
      • 1970-01-01
      • 2021-08-09
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多