获得羯磨，6to5ify和伊斯坦布尔打球 [英] Getting Karma, 6to5ify and Istanbul to play ball

问题描述

我有Browserify，6to5ify和Karma玩得很好，成功地运行我的规格。当我添加代码覆盖，但事情向南。我尝试了几种方法：

• 添加 browserify-istanbul 转换为我的业力.conf.js。但是，这样做会导致在我的规范文件上运行仪器，并且会出现。


• 在我的源文件上运行 coverage 预处理器。但是因为istanbul（甚至 douglasduteil / karma-coverage＃next ）没有读取我的 6to5ify browserify变换，这个崩溃立即在第一个文件中尝试解析（因为 import 语句），或者当我使用karma-coverage＃next时，它不尊重浏览器映射在我的package.json（移动项目，映射到骨干骨骼）。

现在我的 karma.conf.js 看起来像这样： p>

  module.exports = function（karma）{
 karma.set（{
 frameworks：[browserify ，mocha，chai-sinon]，
 browserify：{
 debug：true，
 extensions：[.js，.hbs]，
 transform ：[6to5ify，hbsfy] 
}，
记者：[点，osx，junit，coverage]，
 coverageReporter：{
类型：text
}，
 junitReporter：{
 outputFile：spec / reports / test-results.xml
}，
 preprocessors：{
src / javascript / ** / *：[coverage]，
spec / ** / *：[browserify] 
}，
浏览器： [PhantomJS]，
文件：[spec / unit / ** / * Spec.js]，
 logLevel：LOG_DEBUG，
 autoWatch：true 
} ）; 
}; 
  

我很失落如何让这一切都在一起工作。我尝试遵循这些说明，但这并不奏效，因为它没有遵循我的浏览器节点在 package.json 中。任何帮助将不胜感激。

解决方案

所以，显然我需要 browserify-istanbul 浏览配置钩子，如下所示：

  var to5ify = require '6to5ify'）; 
 var hbsfy = require（'hbsfy'）; 
 var cover = require（'browserify-istanbul'）; 
 
 var coverOptions = {
 ignore：['** / * Spec.js'，'** / lib / *。js'，'** / fixtures / *。hbs' ]，
 defaultIgnore：true 
} 
 
 module.exports = function（karma）{
 karma.set（{
框架：[browserify ，mocha，chai-sinon]，
 browserify：{
 debug：false，
 extensions：[.js，.hbs]，
 configure ：function（bundle）{
 bundle.on（'prebundle'，function（）{
 bundle 
 .transform（to5ify）
 .transform（hbsfy）
。转换（cover（coverOptions））; 
}）; 
} 
}，
记者：[点，osx，junit 
 coverageReporter：{
 type：text
}，
 junitReporter：{
 outputFile：spec / reports / test-results.xml
 } 
预处理器：{
spec / ** / *：[browserify] 
}，
浏览器：[PhantomJS]，
文件：[spec / unit / ** / * Spec.j s]，
 logLevel：LOG_DEBUG，
 autoWatch：true 
}）; 
}; 
  

I have Browserify, 6to5ify and Karma to play nice, successfully running my specs. When I add code coverage however, things go south. I've tried several approaches:

• Add browserify-istanbul transform to my karma.conf.js. However, this results in it trying to run instrumentation on my spec-files as well it would appear.
• Run coverage preprocessor on my source files. But because istanbul (even douglasduteil/karma-coverage#next) doesn't read my 6to5ify browserify transform, this crashes immediately on the first file it tries to parse (because of the import statement), or when I use karma-coverage#next, it doesn't respect the browser mapping in my package.json (mobile project, mapped Backbone to Exoskeleton).

Right now my karma.conf.js looks like this:

module.exports = function(karma){
  karma.set({
    frameworks: ["browserify", "mocha", "chai-sinon"],
    browserify: {
      debug: true,
      extensions: [".js", ".hbs"],
      transform: ["6to5ify", "hbsfy"]
    },
    reporters: ["dots", "osx", "junit", "coverage"],
    coverageReporter: {
      type: "text"
    },
    junitReporter: {
      outputFile: "spec/reports/test-results.xml"
    },
    preprocessors: {
      "src/javascript/**/*": ["coverage"],
      "spec/**/*": ["browserify"]
    },
    browsers: ["PhantomJS"],
    files: ["spec/unit/**/*Spec.js"],
    logLevel: "LOG_DEBUG",
    autoWatch: true
  });
};

I'm kind of lost how to get this all working together. I tried following these instructions, but that didn't work because it didn't follow my browser node in package.json. Any help would be greatly appreciated.

解决方案

So, apparently I need browserify-istanbul, and I need the browserify configure hook, like so:

var to5ify = require('6to5ify');
var hbsfy = require('hbsfy');
var cover = require('browserify-istanbul');

var coverOptions = {
  ignore: ['**/*Spec.js', '**/lib/*.js', '**/fixtures/*.hbs'],
  defaultIgnore: true
}

module.exports = function(karma){
  karma.set({
    frameworks: ["browserify", "mocha", "chai-sinon"],
    browserify: {
      debug: false,
      extensions: [".js", ".hbs"],
      configure: function(bundle){
        bundle.on('prebundle', function(){
          bundle
            .transform(to5ify)
            .transform(hbsfy)
            .transform(cover(coverOptions));
        });
      }
    },
    reporters: ["dots", "osx", "junit", "coverage"],
    coverageReporter: {
      type: "text"
    },
    junitReporter: {
      outputFile: "spec/reports/test-results.xml"
    },
    preprocessors: {
      "spec/**/*": ["browserify"]
    },
    browsers: ["PhantomJS"],
    files: ["spec/unit/**/*Spec.js"],
    logLevel: "LOG_DEBUG",
    autoWatch: true
  });
};

这篇关于获得羯磨，6to5ify和伊斯坦布尔打球的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！