javascript - Karma Coverage 和 Babel+Browserify 预处理

我正在使用 Karma 来测试我的 ES6 代码。当我将 karma-coverage 添加到组合中时，我需要添加覆盖工具的所有源文件以制作有用的报告，但是当我这样做时，Karma 在所有浏览器中都给我这个错误:



我的 karma 配置文件是:

basePath: '',
browserNoActivityTimeout: 100000,
frameworks: ['phantomjs-shim', 'mocha', 'chai', 'browserify'],
files: [
  './client/**/*.js',
  './client/**/*.spec.js'
],
exclude: [
  './client/dist/*.js',
],
preprocessors: {
  './client/**/*.js': ['browserify', 'sourcemap', 'coverage']
},
browserify: {
  debug: true,
  transform: [
    ['babelify', {
        optional: ["runtime"],
        plugins: ["rewire"]
    }],
  ]
},
coverageReporter: {
  instrumenters: { isparta : require('isparta') },
  instrumenter: {
    '**/*.js': 'isparta'
  },
  type : 'html',
  dir : './coverage/'
},
reporters: ['mocha', 'coverage'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: false,
browsers: ['Chrome', 'Firefox', 'Safari', 'PhantomJS'],
singleRun: true

如果我从 './client/**/*.js', 数组中删除 files，测试会工作，但是覆盖率只显示测试代码。我将 gulp 中的 Karma 与 gulp-karma 一起使用，但我认为这与问题没有任何关系。

最佳答案

我遇到了同样的问题，在我的情况下，这是因为 React 找不到它需要呈现 html 的元素。

我通过将以下 if 语句添加到我的主 js 文件中找到了一个快速修复:

if ($('#container').length <= 0) {
  $('body').prepend('<div id="container"></div>');
}

ReactDom.render(
  <App />,
  document.getElementById('container')
);

我知道这一定不是修复它的最佳方法，但至少它现在有效。如果有人知道更好的方法，请告诉我们!

关于javascript - Karma Coverage 和 Babel+Browserify 预处理，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/30751385/