测试工具比较:选Jest,不选Mocha小白教程_测试指南教程

我们Automattic公司的WordPress.com是由Calypso项目推动的,而这个项目中所有的测试用的都是Mocha框架。项目中还包括端到端测试,都保存在自己独立的代码库里。这套设定我们已经用了三年多了,我觉得是时候该重新审查一下这个选择。我发现这篇[单元测试工具的比较]文章(https://mo.github.io/2017/06/05/java

测试工具比较:选Jest,不选Mocha小白教程

我们Automattic公司的WordPress.com是由Calypso项目推动的,而这个项目中所有的测试用的都是Mocha框架。项目中还包括端到端测试,都保存在自己独立的代码库里。这套设定我们已经用了三年多了,我觉得是时候该重新审查一下这个选择。我发现这篇[单元测试工具的比较]文章(https://mo.github.io/2017/06/05/javascript-unit-testing.html)非常有帮助,可以用来评估不同的选择。文中,作者**Martin Olsson**给我们分享了他的结论,我强烈赞同这个结论:

测试工具比较:选Jest,不选Mocha小白教程_测试指南教程

在这个贴子里,我想突出说明一下这个名叫Jest的测试工具的特色。这些特色使它成为一个很有吸引力的选择。我们有几次简单地内部讨论过Jest,主要集中在快照功能这一独特的测试方法上。在我看来,这个功能只不过是锦上添花,所以我更想讨论一下其它我认为更重要的优点。

Calypso项目的概念验证

我创建了两个合并请求,调查把测试从Mocha迁移到Jest需要花多少功夫。所有验证服务器代码执行的单元测试都要能在Jest里正常运行,要达到这个程度还是相当易的。我又重写了测试文件,用了Jest的API接口,和Mocha进行比较来说明其测试编写方法如何。这些基本层面以外,我甚至都已经可以把Jest和Circle CI持续集成,以及PhpStorm编辑器结合起来了,还有设置代码覆盖率(code coverage)和监控模式(watc也没花多少时间。想要更多细节的话,可以去看这个合并请求,已经快敲定了。

对于客户端运行的测试,我也做了试验。和之前服务器代码相同,多数情况下复制粘贴,再加上一些变动,就足以让测试协助开发了。可惜70

所有550多个通过的测试在Moc一a其中一位行的时间是10秒,但剩下的150多个测试却又花了40秒,这个情况比较有意思。在Jest里,通过的测试20秒,未通过的测试50秒。我觉得就算把mockery模拟模块换成Jest自己的模拟功能,再加上useFakeDom辅助函数和Jest浏览器环境选项,也很难说性能会怎么样,不过个人估计还是会有些提高的。

另外,我们这里还在说几秒几秒,别的公司转到Jest后已经能够将执行时间减少几分钟了,这也是挺有意思的。查一下爱彼迎的个案研究。

Jest总述

我第一次听说Jest是在去年,但是Facebook的工程师已经使用了多年。目前它还是由Facebook开发并维护,但外部协助开发也越来越多。

要了解Jest,最好的方法就是听一听其中一位创作者怎么说的。我推荐去看一下由Chris Pojer作的演讲,创建高质量JavaScript工具,录于2017年欧洲JS大会

我们Automattic公司已经在使用Jest了,测试Delphin项目的代码。就是这个项目推动了https://get.blog博客功能,使是用户能注册.blog域名。还有Simplenote for Electron也是使用Jest验证代码的项目。

简化API

Jest既简单又强大,内置支持以下功能:

  • 灵活的配置:比如,可以用文件名通配符来检测测试文件。

  • 测试的事前步骤(Setup)和事后步骤(Teardown),同时也包括测试范围。

  • 匹配表达式(Matchers):能使用期望expect句法来验证不同的内容。

  • 测试异步代码:支持承诺(promise)数据类型和异步等待async / await功能。

  • 模拟函数:可以修改或监查某个函数的行为。

  • 手动模拟:测试代码时可以忽略模块的依存关系。

  • 虚拟计时:帮助控制时间推移。

还有更多的功能,有些我会在下面的部分里更宽泛地谈谈。

性能与隔离

Jest文档里写道:

Mocha用一个进程运行所有的测试,和它比较起来,Jest则完全不同。要在测试之间模拟出隔离效果,我们必须要引入几个测试辅助函数来妥善管理清除工作。这种做法虽然不怎么理想,但99%的情况都可以用,因为测试是按顺序进行的。

沉浸式监控模式

快速互动式监控模式可以监控到哪些测试文件有过改动,只运行与改动过的文件相关的测试,并且由于优化作用,能迅速放出监控信号。设置起来非常简单,而且还有一些别的选项,可以用文件名或测试名来过滤测试。我们用Mocha时也有监控模式,不过没有那么强大,要运行某个特定的测试文件夹或文件,就不得不自己创造解决方法,而这些功能Jest本身就已经提供了,不用花力气。

代码覆盖率

Jest内置有代码覆盖率报告功能,设置起来易如反掌。可以在整个项目范围里收集代码覆盖率信息,包括未经受测试的文件。同样的结果到目前为止我们还未能用Mocha实现过,当然也可能是因为我们没花太多时间尝试。

与IDE的整合

靠命令行和持续集成工具CircelCI上运行的配置文件,我把Jest和PhpStorm整合了起来,只要点击就能浏览并找到指定的测试,也可以只重新执行单个测试。这种事我的同事过去经常问我怎么做,过去也曾把Mocha和IDE整合起来过工作,但引入自主测试文件收集机制之后就无法使用了。

自定义报告整合

要使完善Circle CI整合,只需要一个自定义报告功能。有了Jest,用jest-junit-reporter就可以做到,其用法和Mocha几乎相同。

快照功能

第一次看到Jest快照功能操作时,我对这个概念有了一丝疑虑,因为这个概念不符合测试优先(test-first)方式。不过,第一次听到JSX和Redux时,我也是心情复杂。既然有了那种体会,那一旦用了这个快照功能,相信我也一定会成为它点赞的。最终结果是快照帮助我们确信界面的变化不是无法预测的。以下是Jest文档里对这个功能的描述:

要想更多了解Jest快照功能,可以看一下Rogelio Guzman在2017年React大会上录制的演讲:

多重项目运行功能

目前我们设置了四个部分,每个部分都在不同的配置下运行测试。我们这么做是想能够同时运行整合测试与单元测试。单元测试需要接触位于服务器上、在浏览器中执行的代码,还要对一些测试辅助函数本身进行验证。Jest团队最近引进了一个方法能够同时运行多个项目,这将极大地简化监控模式和IDE整合。我还没能找到方法来把这个功能应用到我们的代码基上,但看起来很有前景。

新的测试框架

在Facebook公司,人们也在一直努力想换掉Jasmine框架,改用自己测试框架叫jest-circus。第一批改动已经完成,并进入Jest的软件库了:

他们还把Jasmin 2.5版进行了分支,归入到了Jest自己的测试运行器中去,Jasmine中很大的几部分都重写了,并在最新的Jest 20版中发布了。

小结

Jest的未来看起来非常令人激动!看到Jest推陈出新如此快速,我感觉它将很快成为整个React生态系统中大部分项目的首选工具。

我建议,应该把测试迁移到Jest上去。要最终决定,以下几点应该考虑:

正面因素:

  • API更简单,样板代码更少。

  • 灵活且容易配置。

  • 测试文件彼此隔离执行。

  • 高级监控模式。

  • 快照支持,测试更容易上手。

  • 代码覆盖率。

负面因素:

  • 多一次迁移活动。

  • Mocha性能仍然略胜一筹(依据是我的快速测试)

海计划公众号
(0)
上一篇 2020/04/06 04:07
下一篇 2020/04/06 04:07

您可能感兴趣的内容