Search code examples
code-coveragekarma-runnerbrowserifyecmascript-6karma-coverage

Getting Karma, 6to5ify and Istanbul to play ball


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.


Solution

  • 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
      });
    };