运行摩卡+伊斯坦布尔+通天塔

Question

我在使用 Mocha 和 Babel 编译器运行伊斯坦布尔时遇到了一些问题。

我的所有测试都运行良好，但在完成所有测试后，它会向我显示以下消息：

No coverage information was collected, exit without writing coverage information

而且它没有生成任何覆盖率报告。

我正在运行的命令是：

NODE_ENV=test istanbul cover _mocha -- --require babel-core/register --recursive

项目托管在 GitHub 上： https://github.com/weslleyaraujo/react-flux-puzzle/tree/feat/unit-tests-24

有什么想法吗？

Answer 1

使用 Babel 6.x，假设我们有文件 test/pad.spec.js:

import pad from '../src/assets/js/helpers/pad';
import assert from 'assert';

describe('pad', () => {
  it('should pad a string', () => {
    assert.equal(pad('foo', 4), '0foo');
  });
});

装一堆废话：

$ npm install babel-istanbul babel-cli babel-preset-es2015 mocha

创建一个.babelrc：

{
  "presets": ["es2015"]
}

运行测试：

$ node_modules/.bin/babel-node node_modules/.bin/babel-istanbul cover \   
node_modules/.bin/_mocha -- test/pad.spec.js


  pad
    ✓ should pad a string


  1 passing (8ms)

=============================================================================
Writing coverage object [/Volumes/alien/projects/forked/react-flux-puzzle/coverage/coverage.json]
Writing coverage reports at [/Volumes/alien/projects/forked/react-flux-puzzle/coverage]
=============================================================================

=============================== Coverage summary ===============================
Statements   : 100% ( 4/4 )
Branches     : 66.67% ( 4/6 ), 1 ignored
Functions    : 100% ( 1/1 )
Lines        : 100% ( 3/3 )
================================================================================

更新：我已经成功使用nyc（消耗istanbul）而不是istanbul/babel-istanbul。这不那么复杂。试试看：

安装东西（你可以删除babel-istanbul和babel-cli）：

$ npm install babel-core babel-preset-es2015 mocha nyc

如上创建.babelrc。

执行这个：

$ node_modules/.bin/nyc --require babel-core/register node_modules/.bin/mocha \ 
test/pad.spec.js

...这应该会给您类似的结果。默认情况下，它将覆盖信息放入.nyc-output/，并在控制台中打印出漂亮的文本摘要。

注意：您可以在将命令放在package.json 的scripts 字段中时从这些命令中删除node_modules/.bin/。

Answer 2

PS：我现在建议使用单个 jest 而不是 mocha/instanbul/nyc/chai/etc。

---

解决方案 A：使用 nyc 和 babel-plugin-istanbul

设置（不要忘记@next for nyc）：

npm install --save-dev nyc babel-plugin-istanbul babel-register

将环境添加到babel 配置：

{
  "env": {
    "nyc": { "plugins": ["istanbul"] }
  }
}

nyc 配置：

{
  "reporter"   : ["text", "text-summary", "lcov", "html"],
  "include"    : ["src/**/*.js"],
  "require"    : ["babel-register"],
  "sourceMap"  : false,
  "instrument" : false,
  "all"        : true
}

PS：include字段需要在package.json的.nycrc中指定，如果在命令行中指定，覆盖将不起作用

运行测试：

# 1. Build
NODE_ENV=nyc babel src --out-dir lib

# 2. Coverage
nyc mocha

---

解决方案 B：没有额外的包：只有基本的包

最近在伊斯坦布尔 (1.0.0-alpha.2) 上进行了工作，以支持使用源映射生成 Babel 代码（参见 #212 和 this 示例）。

有两种方式：

• A.针对之前转译的代码编写的测试
• 乙。针对原始代码编写并在运行时在内存中一起编译的测试

B1。导出（以前）转译代码的测试

这分两步完成：首先，使用 babel 构建您的源代码（例如，从 ./src 到 ./out）并针对转译的源代码 (export foo from "./out/foo";) 编写测试。

然后您将能够使用 istanbul 1.0.0-alpha.2 运行测试：

istanbul cover _mocha -- ./test --compilers js:babel-register 

现在，如果您希望代码覆盖率遵循您编写的原始代码（而不是转译代码），请确保在构建时将 babel source-maps options 设置为 both：

babel ./src --out-dir ./out --source-maps both

PS：如果需要你也可以这样做：

istanbul cover _mocha -- ./test --compilers js:babel-register \
   --require babel-polyfill \
   --require should \
   --require sinon

B2。直接导出原始代码的测试

在这种情况下，您针对原始源 (export foo from "./src/foo";) 编写测试，无需进一步的步骤，您直接使用 babel-node 针对 cli.js 运行 istanbul 1.0.0-alpha.2：

babel-node ./node_modules/istanbul/lib/cli.js cover _mocha -- ./test

PS：如果需要你也可以这样做：

babel-node ./node_modules/istanbul/lib/cli.js cover _mocha -- ./test
   --require babel-polyfill \
   --require should \
   --require sinon

Answer 3

截至 2016 年 4 月 17 日，这个覆盖率报告内容仍然有点混乱，而对于我的具有 .jsx 文件和帮助文件的 React 项目，覆盖率报告脚本如下所示：

istanbul cover node_modules/mocha/bin/_mocha -- \
   --compilers js:babel-core/register \
   --require ./test/testhelper.js  \
   \"test/**/*@(.js|.jsx)\"

因此，伊斯坦布尔的当前版本 0.4.3 不能与 Babel 一起使用并不容易，因此您必须使用实验性 alpha 版本：

npm install istanbul@1.0.0-alpha.2 --save-dev

然后您需要 .istanbul.yml -file 以便伊斯坦布尔识别具有这些行的 .jsx 文件：

instrumentation:
  root: .
  extensions: ['.js', '.jsx']

现在它应该可以工作了。另外，如果您想使用 Travis 和 Coveralls 添加报道报告，您应该：

1. 启用https://coveralls.io中的项目
2. 添加工作服npm i coveralls --save-dev

3. 将此添加到您的.travis.yml：

   script:
     - npm --silent test
     - cat ./c
   coverage/lcov.info | coveralls
   

现在您可以将这个很酷的徽章放入您的自述文件中。尼托！