使用 node-jscover 做测试覆盖率检测

node-jscoverjscover 的 javascript 实现,通过和 nodejs 结合,特别是通过配合 nodejs server 的拦截功能可以很方便得做测试覆盖率检测.

安装

在根目录执行 npm install express node-jscover node-jscover-handler –save-dev

on fly intrument

node-jscover 提供了 express 的中间件 node-jscover-handler 可以对请求的源码进行动态 instrument.

例如源代码地址为 localhost/i18n.js,文件内容为

modulex.add('i18n', {
    alias: function (mx, name) {
        return name + '/i18n/' + mx.Config.lang;
    }
});

那么可以访问一个实际不存在的文件 localhost/i18n-coverage.js 得到 nodejs-cover 动态 instrument 的脚本:

if (! _$jscoverage['lib/i18n.js']) {
  _$jscoverage['lib/i18n.js'] = {};
  _$jscoverage['lib/i18n.js'].lineData = [];
  _$jscoverage['lib/i18n.js'].lineData[6] = 0;
  _$jscoverage['lib/i18n.js'].lineData[8] = 0;
}
if (! _$jscoverage['lib/i18n.js'].functionData) {
  _$jscoverage['lib/i18n.js'].functionData = [];
  _$jscoverage['lib/i18n.js'].functionData.index = [];
  _$jscoverage['lib/i18n.js'].functionData[0] = 0;
  _$jscoverage['lib/i18n.js'].functionData.index[0] = ['alias',7,12];
}
if (! _$jscoverage['lib/i18n.js'].branchData) {
  _$jscoverage['lib/i18n.js'].branchData = {};
}
_$jscoverage['lib/i18n.js'].lineData[6]++;
modulex.add('i18n', {
  alias: function (mx, name) {
    _$jscoverage['lib/i18n.js'].functionData[0]++;
    _$jscoverage['lib/i18n.js'].lineData[8]++;
    return name + '/i18n/' + mx.Config.lang;
  }
});

中间件使用起来也很简单:

var app = require('express')();
// 动态 intrument -coverage 结尾的 js 文件
app.use(require('node-jscover-handler')());
app.listen(8000);

测试覆盖率结果的简单展示

首先需要修改测试驱动页面 runner.html 引入 node-jscover 前端资源以及 instrument 后的脚本文件和测试框架的报告文件,例如 mocha (jasmine也类似):

<!-- jscover 前端资源-->
<script src="/node_modules/node-jscover/lib/front-end/header.js"></script>
<script src="/node_modules/node-jscover/lib/front-end/jscoverage-branch.js"></script>

<!-- instrumented 源码文件-->
<script src="/lib/i18n-coverage.js"></script>

<!-- mocha 以及 node-jscover 的适配报告 -->
<script src='/node_modules/chai/chai.js'></script>
<script src='/node_modules/mocha/mocha.js'></script>
<script src='/node_modules/node-jscover/lib/reporters/mocha/console.js'></script>

那么当 runner.html 执行完毕后可以在控制台看到测试覆盖率的数据展示,例如

node-jscover-console

测试覆盖率结果的详细展示

如果想要更详细的结果可以访问 jscover 的前端展示页面,例如

http://localhost:8000/node_modules/node-jscover/lib/front-end/jscoverage.html?w=http://localhost:8000/tests/runner.html?coverage

结果的详细展示:

info

info

和 coveralls 的整合

node-jscover 通过通过中间件还可以整合 coveralls,首先配置 coveralls 为 github 的 hook。然后使用 node-jscover-coveralls 来处理和 coveralls 服务器的交互。

服务器端加入该中间件,例如:

app.use(require('node-jscover-coveralls')());

runner.html 加入 report 逻辑:

<script src='/node_modules/node-jscover-coveralls/lib/reports/mocha.js'></script>
<script>
(function () {
        var runner;
        if (window.mochaPhantomJS) {
            runner = mochaPhantomJS.run();
            window.nodeJsCoverCoveralls(runner);
        } else {
            runner = mocha.run();
        }
    })();
</script>

之后配合 mocha-phantomjstravis 就可以在提交文件后将测试覆盖率结果发动到 coveralls了,例如: https://coveralls.io/r/kissyteam/modulex?branch=master

Advertisements

发表评论

Fill in your details below or click an icon to log in:

WordPress.com 徽标

You are commenting using your WordPress.com account. Log Out /  更改 )

Google photo

You are commenting using your Google account. Log Out /  更改 )

Twitter picture

You are commenting using your Twitter account. Log Out /  更改 )

Facebook photo

You are commenting using your Facebook account. Log Out /  更改 )

Connecting to %s