【全栈React】第22天: 测试简介

本文转载自：众成翻译
译者：iOSDevLog
链接：http://www.zcfy.cc/article/3809
原文：https://www.fullstackreact.com/30-days-of-react/day-22/

测试套件是一项前期投资，可在系统的整个生命周期内获得回报。今天我们将介绍测试的主题，并讨论我们可以写的不同类型的测试。

好了, 闭上你的眼睛, 等一下, 不要... 你很难闭着眼睛阅读, 但是想象一下, 你的应用正在接近你的第一个部署。

它越来越近, 它变得无聊, 不断添加在您的浏览器运行的功能,。

一定还有更好的办法..。

测试

当我们谈论测试时, 我们讨论的是自动建立和测量我们的假设的过程, 而不是关于我们的应用的功能断言。

当我们谈论在React中的front-end（前后端） 测试时, 我们指的是对我们的Reac应用渲染什么以及它如何响应用户交互的断言过程。

我们将讨论三种不同的软件测试范例: 单元测试、功能测试和集成测试。

单元测试

单元测试是指测试我们的代码中的各个部分 (或单元, 因此是名称), 这样我们就可以确信这些特定的代码部分能够像我们期望的那样工作。

例如, 我们的应用中已经有一些归并器。这些归并器由一个单一的函数组成, 我们可以在不同的场景下进行断言。

在Reac中, 单元测试通常不需要浏览器, 可以快速运行 (不需要写入 DOM), 断言本身通常是简单而简洁的。

我们主要集中在回答这个问题: 用一组给定的输入 (状态和属性), 输出是否符合我们对虚拟 dom 中 应该 的期望。在这种情况下, 我们正在测试渲染输出。

功能测试

通过功能测试, 我们的重点是测试组件的行为。例如, 如果我们有一个带有用户登录/注销按钮的导航栏, 我们可以测试我们的期望:

• 给定一个登录的用户, 导航呈现一个带有文本 Logout 的按钮

• 由于没有登录的用户, 导航会呈现一个带有文本 Login 的按钮

功能测试通常是隔离运行的 (即测试组件功能而不需要应用的其余部分)。

集成测试

最后, 我们将研究的最后一种测试是集成测试。这种类型的测试测试我们应用的整个服务, 并尝试复制 end-user(终端用户) 在使用我们的应用时的体验。

在速度和效率的顺序上, 集成测试非常缓慢, 因为它需要对实时运行的浏览器运行预期, 因为单元和功能测试的运行速度会更快 (尤其是在功能测试针对内存中的虚拟 dom 而不是实际的浏览器呈现的情况下进行测试时)。

当测试响应组件时, 我们将测试我们对虚拟 dom 中包含的内容的期望, 以及实际 dom 中反映的内容。

工具

我们将使用一个名为 jasmine 的测试库来提供可读的测试语言和断言。

至于测试运行, 有一个一般性的辩论围绕哪一个测试亚军是最容易/最有效的工作, 主要在mocha 和 jest。

我们要在React中使用在我们的冒险测试Jest, 因为它是 官方 (将信将疑) 测试员。我们将要写的大部分代码将是在Jasmine。可以随意使用mocha 如果它是你的测试库的选择。

最后, 我们将使用一个我们不能离开的库：Enzyme, 这使得在功能测试的更有乐趣。Enzyme提供了一些相当不错的Reac测试实用功能, 使我们的断言写得很容易。

明天, 我们将得到我们的应用设置与测试工具就位, 以便我们可以开始测试我们的应用, 并有信心它的工作是按我们预期的。明天见！