适合你React项目的JavaScript测试工具,有哪些?

酒囊饭袋 2020-03-11

【金融特辑】光大银行科技部DBA女神带你从0到1揭秘MGR

适合你React项目的JavaScript测试工具,有哪些?

“信任是必须的,但核实也是必要的。”

里根总统带火的一个俄罗斯习语非常符合我们谈论测试和QA时的情境。

每个人都信任自己,每个程序员或开发人员都信任代码。但为什么我们不能“完全信任”他们呢?

因为在编程领域,即便是极小的一个错误也会造成很大很大的损失,这就是为什么我们要反复进行测试与验证的根本原因之一。

前端开发的生态系统正在不断进步并且没有简单一丝一毫。如今的公司在招聘精通各自领域的前端开发人员时竞争激烈。这错综复杂的事物则有逐年倍难的趋势。

来看一些在React.js项目上有所帮助的工具。

适合你React项目的JavaScript测试工具,有哪些?

首先是选择JavaScript测试执行过程管理平台。测试执行过程管理平台是测试堆栈中不可分割的一部分。作为一个ReactJs研发公司发展过程中的一部分,我们可以看到开发人员借助Karma在一个或多个浏览器中同时进行测试。测试执行过程管理平台有助于分析代码是否安全,避免受浏览器怪癖的影响,通常比其他解决方案更加值得信赖。它也可以用来配置使用SauceLabs和BrowserStack这样的的远程服务。

另一个简单易用的选择是 Mocha CLI。Mocha CLI令人相当满意,因为它可以在Node.js环境中轻松运行Mocha tests。遗憾的是,不存在使用Mocha CLI 在浏览器中运行测试的机制。

如果想执行跨浏览器测试或者测试重要的DOM操作,请选择Karma。或者将默认的CLI和其他工具库(如Enzyme和JSDOM)结合使用。

JavaScript框架

请确保你的测试框架对异步代码和同步代码都支持测试并且使其便于关闭测试。Jasmine、Mocha、和Jest都满足这些要求。

Jasmine是一个行为驱动的开发框架,用于测试JavaScript代码; 它不依赖于任何其他的JavaScript框架,也不需要DOM,而且它具有简洁清晰的语法可以让你轻松地编写测试代码。

下列是Jasmine的一些示例代码。

适合你React项目的JavaScript测试工具,有哪些?

Jasmine拥有断言功能, 被称之为matchers,其内置在Jasmine中。这些断言消除了涵盖外部断言库(如Chai和Should.js)的必要性,还能够模拟函数以从作用域中删除一些依存树。

Facebook的测试框架Jest,专为React设计。Jest很好地响应了基本的测试需求,但是今天的亮点是快照测试。它允许你序列化组件的输出并且保存,同时轻松检测出序列何时发生更改。快照是保存到源代码管理中的文本文件并且快照要与未来运行的测试进行对比。

此外,像Jasmine一样,Jest还提供基本的断言和模拟功能。

适合你React项目的JavaScript测试工具,有哪些?

回到Mocha上来,它专注于成为一个可靠的测试框架。它看上去既没有断言库也不能做类型奇特的测试。然而,能做之事,它做得都不错。

如果选择Mocha,就意味着还必须专门选择断言库和mocking库。这种情况下,你大概只能使用Chai和Sinon.js了。如果想寻求更多的选择,有一个关于Mocha的维基页面 概述了一些常见的选择。

在这种情况下,如果没有特殊偏好,Jest 或Jasmine应该是首选。尽管Jest 是一个通用的JavaScript测试框架,但快照测试功能仅限于React组件。

测试附加组件

如果要在组件上执行浅渲染和断言,有两个选择:

  • React-test renderer 用于浅渲染。
  • React-test-utils 用于断言。

另外一个选择是爱彼迎公司的工具库Enzyme。它是为React设计的测试工具,方便判断、操纵和遍历React组件的输出。

相关推荐