使用 ES6+ 在 Karma 中使用伊斯坦布尔设置 Browserify

Question

我正在尝试使用 Karma 为使用 ES6+（包括 ES7 async/await 语法）的文件运行准确的代码覆盖率输出测试。

只有一个源文件：工作

首先，当我只有一个源文件（即我的源文件中没有require 调用）时，我设法使它工作。我刚刚告诉 Karma 使用 babel 并在我的 .babelrc 上配置 babel-plugin-istanbul。

• karma.conf.js:

  preprocessors: {
      "test/*.js": [ "browserify" ],
      "lib/*.js": [ "babel" ]
  }
  

  请注意，"coverage" 预处理器不是故意包含的，因为这是babel-plugin-istanbul 指示要做的（而且确实有效）。另外，我确实需要browserify 进行测试，因为那里有一个require('chai')。

• .babelrc:

  {
      "presets": [ "env" ],
      "env": {
          "test": {
              "plugins": [ "istanbul" ]
          }
      }
  }
  

• 出色的覆盖结果：

多个带有require() 的源文件：不起作用

现在我想在我的真实情况下进行这项工作，这是很多源文件，require() 从一个到另一个调用。为了完成这项工作，我不得不使用browserify 预处理器，而不是简单地使用babel 预处理器，但现在它似乎忽略了我的.babelrc 并且没有使用伊斯坦布尔覆盖的东西来检测代码：

• karma.conf.js 改为：

      preprocessors: {
          "test/*.js": [ "browserify" ],
          "lib/*.js": [ "browserify" ]
      }
  

  没有这个改变，甚至测试都不会运行。有了它，测试运行，但覆盖不起作用。

• 错误的覆盖结果：

我该如何解决这个问题？

---

GitHub 上提供了此问题的存储库

由于发生了很多事情，我决定创建一个 GitHub 存储库，以便任何人都可以立即轻松地重现我的情况：

• 要查看有效的第一部分：

  git clone https://github.com/papb/papb-stackoverflow-q-51812979.git
  cd papb-stackoverflow-q-51812979
  npm install
  npm test
  

• 查看不起作用的部分：

  git checkout doesnt-work
  npm test
  

• 要查看两者的完整差异（仅三行）：see the comparison on GitHub

Answer 1

在这里。我想通了：

npm install browserify-istanbul

将此添加到karma.conf.js：

browserify: {
    configure: function(bundle) {
        bundle.transform(require('browserify-istanbul')({
            ignore: ['test/*.js']
        }));
    }
}

让preprocessors 保持原样（没有coverage 预处理器！）

preprocessors: {
    "test/*.js": [ "browserify" ],
    "lib/*.js": [ "browserify" ]
}

就是这样。你可以去掉.babelrc和babel-plugin-istanbul，它们甚至没有必要。