完整的 Gulp 伊斯坦布尔报道答案

【问题标题】：Full Gulp Istanbul Coverage Report完整的 Gulp 伊斯坦布尔报道
【发布时间】：2014-03-28 01:34:46
【问题描述】：

我正在使用 gulp-istanbul 通过 Gulp 生成 JavaScript 单元测试覆盖率报告。有没有办法配置 Istanbul 以生成我的 gulp 流中所有 JS 文件的完整覆盖率报告，而不仅仅是测试用例涉及的文件。

我正在做一个有很多 JS 的项目，但没有单元测试，我们正在努力增加测试覆盖率。我想要一份覆盖率报告，首先显示我们大多数文件的 0% 覆盖率，但随着时间的推移，覆盖率会越来越高。

gulp.task( 'test', function () {
    gulp.src( [ my source glob ] )
        .pipe( istanbul() )
        .on( 'end', function () {
            gulp.src( [ my test spec glob ] )
                .pipe( mocha( {
                    reporter: 'spec'
                } ) )
                .pipe( istanbul.writeReports(
                    [ output location ]
                ) );
        } );
} );

【问题讨论】：

我知道你已经解决了你的问题，但检查我的答案，似乎他们已经添加了一个更简单的方法，直接进入 gulp-istanbul。可能值得一试/确认它给出了相同的结果。

标签： javascript unit-testing mocha.js gulp istanbul

【解决方案1】：

现在实际上要简单得多，您只需将 includeUntested 添加到您的 istanbul() 调用中。

gulp.task('test', function () {
    return gulp.src('./assets/**/js/*.js')
      // Right there
      .pipe(istanbul({includeUntested: true}))
      .on('finish', function () {
        gulp.src('./assets/js/test/test.js')
          .pipe(mocha({reporter: 'spec'}))
          .pipe(istanbul.writeReports({
            dir: './assets/unit-test-coverage',
            reporters: [ 'lcov' ],
            reportOpts: { dir: './assets/unit-test-coverage'}
          }));
      });
  });

来源：https://github.com/SBoudrias/gulp-istanbul#includeuntested

【讨论】：

我在这个答案中发现的一个关键部分是您正在返回 gulp.src(...)。
@axlj 据我所知，我认为这只是为了帮助 gulp 计算每个任务运行所需的时间。否则，您最终会得到“3 μs 后完成测试”之类的结果

【解决方案2】：

需要文件时执行伊斯坦布尔挂钩。因此，您需要要求所有文件才能将它们包含在最终覆盖率报告中。你可以通过在你的 gulp 任务中注入一个水龙头并在所有选定的文件上调用 require 来实现这一点：

gulp.task( 'test', function () {
    gulp.src( [ my source glob ] )
        .pipe( istanbul() )
        .pipe(tap(function(f) {
            // Make sure all files are loaded to get accurate coverage data
            require(f.path);
        }))
        .on( 'end', function () {
            gulp.src( [ my test spec glob ] )
                .pipe( mocha( {
                    reporter: 'spec'
                } ) )
                .pipe( istanbul.writeReports(
                    [ output location ]
                ) );
        } );
} );

【讨论】：

gulp-tap 抛出此错误no writecb in Transform class，我不知道为什么。其余代码完美运行。有什么想法吗？

【解决方案3】：

我今天一直在努力解决这个问题，但在 Google 上没有找到答案。我终于想出了一个与此处的答案非常相似的答案，但 writeReports 调用必须在调用 mocha 之前进行。

gulp.task('test', ['build'], function(done) {
  gulp.src('lib/**/*.js')
    .pipe($.istanbul({ includeUntested: true }))
    .on('end', function() {
      gulp.src(['test/helpers/**/*.coffee', 'test/spec/**/*.coffee'])
        .pipe($.istanbul.writeReports({
          dir: './coverage',
          reportOpts: {
            dir: './coverage'
          },
          reporters: ['html']
        })).pipe($.mocha({
          reporter: 'spec',
          require: 'coffee-script/register'
        }));
    });
});

我发现在 gulp-istanbul 代码中引用了一张与此相关的票，就在一些巫术魔法使事情正常之前：https://github.com/gotwarlost/istanbul/issues/112

【讨论】：

你可以评论那个答案
@chouaib 这样的完整答案不适合也不属于评论。
对于其他在这个答案和 gulp-mocha 4.0.x+ 上苦苦挣扎的人，请确保您 return gulp.src(...) 并收听 finish 事件。

【解决方案4】：

要显示所有文件的覆盖率，您必须做两件事：

项目中的所有文件都应包含在[my source glob]中。
必须要求所有文件，换句话说，必须在项目中的所有文件上调用require()，因为 istanbul 可能会更改默认 require() 以计算文件中的覆盖率。

你可以在测试文件的开头写这样的东西：

for([all .js files in project]){
  require([file])
}

您可以为此使用require-dir。

改用这个：

var requireDir = require('require-dir');
var dir = requireDir('./projectFolder', {recurse: true});

【讨论】：