如何使用 npm 脚本运行客户端 javascript 的代码覆盖率

Question

我有一个用基本 javascript 编写的客户端 Web 应用程序，它应该在另一个应用程序内的修改后的 chromium 浏览器中运行。代码被广泛重构以在当前设置中工作并更新以使用 ES6 功能。 旧版本使用 Grunt 进行了一些基于浏览器的 mocha 测试。

我现在想将测试添加到新设置中（并在必要时重写它们）并添加代码覆盖率并用 npm 脚本替换 Grunt。

到目前为止，我设法重写了一些测试并使用：

./node_modules/babel-cli/bin/babel.js js --out-dir tmp/js --source-maps ./node_modules/babel-cli/bin/babel.js test --out-dir tmp/test --source-maps ./node_modules/mocha-phantomjs-core/mocha-phantomjs-core.js test/test-spec.html spec <some options>

这给出了测试的输出。他们都通过了。

现在我想使用 nyc 添加覆盖范围，但我不知道如何让它工作。 我找到了mocha-phantomjs-istanbul，但这似乎使用了 mocha-phantomjs（已弃用）和 istanbul 1.x（已弃用）。

我需要做些什么来为这个配置添加代码覆盖率？

Answer 1

我在伊斯坦布尔和纽约没有太多经验，但不久前我设法获得了一个看起来像这样的工作环境： 在我的 Package.json 中，我定义了几个脚本。覆盖范围如下所示：

scripts : {
    "test:c": "set NODE_ENV=test&& npm run coverage",
    "coverage": "./node_modules/.bin/nyc --reporter=lcov --reporter=text mocha test/*.* --compilers js:babel-core/register --recursive"
}

我启动设置 NODE_ENV 变量的 test:c 脚本，然后运行覆盖脚本。所有测试都在 test 目录中。并且“--compilers js:babel-core/register”标志在那里，因此代码直接从 es6 转译。您似乎已经通过前两个脚本执行此操作，因此您可以跳过该部分。

顺便说一句，这是在 Windows 上。如果我在 unix 系统上没记错的话，您确实可以通过这种方式直接设置 NODE_ENV“NODE_ENV=test”。此外，如果您进行类似的设置，请注意像“set NODE_ENV= test && npm run another script”这样的空格，因为这会将 NODE_ENV 设置为“test”而不是“test”，因此不会使用插件。

我使用以下依赖项：

"mocha": "3.2.0",
"nyc": "^11.0.2",
"babel-plugin-istanbul": "^4.1.4",

这也是我的 .babelrc 配置：

{
  "presets": [
    ["es2015", { "modules": false }],
    "stage-0",
    "airbnb"
  ],
  "env": {
    "test": {
      "plugins": [
        ["istanbul", {
          "exclude": [
            "**/*.spec.js",
            "webpack.config.js"
          ]
        }]
      ]
    }
  }
}

重要的部分可能是在 NODE_ENV 设置为测试时使用的 istanbul 插件的配置。 这个与 nyc 相关的配置是我的 package.json 的一部分：

  "nyc": {
    "include": [
      "src/**/*.js"
    ],
    "exclude": [
      "shared/src/**/*.js"
    ],
    "require": [
      "babel-core/register"
    ],
    "sourceMap": false,
    "instrument": false
  },

无论如何，为了方便起见，最好在 json 包中编写单独的脚本，然后通过另一个脚本将它们串在一起，如下所示：

"script3" :   "npm run script1 && npm run script2"