理解代码覆盖率工具 Istanbul

@sakila1012 2019-01-04 13:18:03发表于 sakila1012/blog

写在前面

在看源码的时候,总会看到一行注释 /*istanbul ignore next*/,遇到好几次,但都没有明白它的意思。实际的意思忽略当前的测试。

测试的时候,我们非常关心,是否所有的代码都测试到了。目前为止,我写的前端代码还没有被测试过。今年,要前端测试代码提上日程。

这个指标就是“代码覆盖率”(code coverage)。它有四个测试维度。

- 行覆盖率(line coverage):是否每一行都执行了?
- 函数覆盖率(function coverage):是否每个函数都调用了?
- 分支覆盖率(branch coverage):是否每个 if 代码块都执行了?
- 语句覆盖率(statement coverage):是否每个语句都执行了?

Istanbul 是 JavaScript 程序的代码覆盖率工具,本文介绍它的用法。

这个软件以土耳其最大的城市伊斯坦布尔命名,因为土耳其地毯世界闻名,而地毯是用来覆盖的。

Istanbul 是一个 npm 模块,安装非常简单,就一行命令

npm install -g istanbul

覆盖率测试

来看一个例子,怎么使用 Istanbul。下面是脚本文件 simple.js

var a = 1;
var b = 1;
if ((a+b) > 2) {
  console.log("大于2")
}

使用 Istanbul cover 命令,就能得到覆盖率

istanbul cover simple.js

===== Coverage summary =====
Statements   : 75% ( 3/4 )
Branches     : 50% ( 1/2 )
Functions    : 100% ( 0/0 )
Lines        : 75% ( 3/4 )
=======================

返回结果显示,simple.js 有 4 个语句(statement),执行了 3 个;有 2 个分支(branch),执行了 1 个;有 0 个函数,调用了 0 个;有 4行代码,执行了3行。

这条命令同时还生成一个 coverage 子目录,其中的 coverage.json 文件包含覆盖率的原始数据,coverage/lcov-report 是可以在浏览器打开的覆盖率报告,其中有详细信息,到底哪些代码没有覆盖到。