如何基于Jasmine的SpecRunner.html生成LCOV报告？

Question

我们正在使用Jasmine进行JavaScript单元测试。我们有一个SpecRunner.html文件来运行测试。是否存在这样的工具，我可以将SpecRunner.html文件的路径和JavaScript目录（而不是规范文件）的路径传递给它，它会生成一个LCOV报告。例如，像这样的东西：

phantomjs jasmine_lcov.js SpecRunner.html WebContent/js

- SBel

Answer 1

我同意@zaabalonso的观点，Karma 是正确的选择。由于您想要LCOV报告，您还需要karma-coverage插件，并且假设您想在CI中运行无头浏览器，您可能希望使用karma-phantomjs-launcher。通过Grunt运行是可选的，因为您可以始终使用karma-cli从命令行直接运行karma（npm install -g karma-cli）。

一个基本的设置（带有requireJS），看起来像这样： package.json

{
  "private": "true",
  "devDependencies": {
    "grunt": "^0.4.5",
    "grunt-jasmine-node": "^0.3.1",
    "grunt-karma": "^0.10.1",
    "jasmine-core": "^2.3.4",
    "karma": "^0.12.32",
    "karma-coverage": "^0.3.1",
    "karma-jasmine": "^0.3.5",
    "karma-phantomjs-launcher": "^0.1.4",
    "karma-requirejs": "^0.2.2",
    "requirejs": "^2.1.17"
  }
}

karma.conf.js（注意 preprocessors 和 coverageReporter 部分）

module.exports = function(config) {
  config.set({
  basePath: '.',
  frameworks: ['jasmine', 'requirejs'],
  files: [{
        pattern: 'src/**/*.js',
        included: false
      }, {
        pattern: 'spec/**/*.js',
        included: false
      },
      "test-main.js"],

  preprocessors: {
    'src/**/*.js': ['coverage']
  },

  reporters: ['progress', 'coverage'],

  coverageReporter: {
    // specify a common output directory
    dir: 'build/reports/coverage',
    reporters: [
      { type: 'lcov', subdir: 'report-lcov' },
      { type: 'lcovonly', subdir: '.', file: 'report-lcovonly.txt' }
    ]
  },

  browsers: ['PhantomJS']
  });
};

test-main.js

var allTestFiles = [];
var TEST_REGEXP = /^\/base\/spec\/\S*(spec|test)\.js$/i;

var pathToModule = function (path) {
    return path.replace(/^\/base\//, '').replace(/\.js$/, '');
};

Object.keys(window.__karma__.files).forEach(function (file) {
    if (TEST_REGEXP.test(file)) {
        // Normalize paths to RequireJS module names.
        allTestFiles.push(pathToModule(file));
    }
});

require.config({
    // Karma serves files under /base, which is the basePath from your config file
    baseUrl: '/base/',
    enforceDefine: true,
    xhtml: false,
    waitSeconds: 30,

    // dynamically load all test files
    deps: allTestFiles,
    callback: window.__karma__.start
});

Gruntfile.js（如果您想使用Grunt，则为可选项）

module.exports = function(grunt) {
  grunt.initConfig({
    karma: {
      unit: {
        configFile: 'karma.conf.js',
        options: {
          singleRun: true
        }
      }
    }
  });
  grunt.loadNpmTasks('grunt-karma');
  grunt.registerTask('default', ['karma:unit']);
};

你可以通过命令行运行测试命令：karma start。这将启动karma服务器并运行一次测试。它将保持服务器在线并在您修改源代码或测试源代码时重新运行测试。如果您只想运行一次测试（例如在CI中），则只需运行karma start --single-run。

- johnmcase

---

这是一个不错的解决方案，但实际上我有一个NODE环境来进行测试，所以我可以使用浏览器运行测试，因此我需要不使用Karma来做到这一点，你知道有什么方法吗？ - Juan Henao

帮我在几分钟内设置了我的LCOV报告输出。非常好的答案。由于自从给出这个答案以来已经过去了3年以上：现在使用PhantomJS相当危险，因为该项目的主要贡献者已经离开了船，并且自2018年3月以来该项目已经停滞不前。我将改用ChromeHeadless。 - Marcel Dutt

Answer 2

Chutzpah也可以做到这一点。它专注于Windows平台，因此可能适用或不适用于您。这是完整的命令行选项文档, 但是您的命令可能类似于以下内容：

chutzpah.console.exe SpecRunner.html /coverage /lcov coverage.dat

如果您需要微调例如覆盖排除或引用等内容，您可以使用json配置文件，该文件放置在测试区域中，如此处所述。无需在命令行上指定要测试的Javascript代码的位置，因为其会自动通过SpecRunner.html中的引用进行检测。

我发现Chutzpah非常流畅且易于使用。

- ioscode

Answer 3

我们正在使用 Karma 而不是 grunt，配置看起来像这样：

  options = {
        karma: {
            unit: {
                options: {
                    files: ['test/unit/specs/*.js'],
                    reporters: ['progress', 'coverage'],
                    preprocessors: {
                        'src/js/*.js': ['coverage']
                    },
                    coverageReporter: {
                        type : 'html',
                        dir : 'build/coverage/'
                    },
                    frameworks: ['jasmine'],
                    singleRun: true
                }
            }
        }
}

你没有指定

SpecRunner.js

但是你可以为所有的规范文件指定*.js。

你可以使用以下命令运行：

grunt karma

这将生成类似于你展示的报告。

- fizampou