Trouble using with 6to5ify

[StevenLangbroek]

I'm trying to get code coverage reports for an app I'm writing, which is intended to be consumed in an iOS or Android webview. Because of severe bandwidth restrictions, I'm swapping out the backbone dependency through a mapping in my package.json's browser node. This works in browserify, but apparently isparta doesn't read this. This silently fails and causes my coverage to report 100% coverage, but when I run it from command line I get an error about this dependency. Any idea how I can get proper instrumentation on my Browserified 6to5 code?

[douglasduteil]

Use a browserify code coverage tool maybe ?

[StevenLangbroek]

I tried that, but if I use a browserify transform for code-coverage, it'll try to apply it to my spec-files as well.

[lukescott]

@StevenLangbroek, this is how I did it:

var isparta = require("isparta");
var istanbul = require("browserify-istanbul");

module.exports = function(config) {
    config.set({
        frameworks: ["browserify", "mocha", "expect"],
        files: [
            "node_modules/core-js/client/core.js",
            "app/**/*.js",
            "test/**/*.js"
        ],
        reporters: ["coverage", "progress"],
        preprocessors: {
            "app/**/*.js": ["browserify"],
            "test/**/*.js": ["browserify"]
        },
        browserify: {
            transform: [istanbul({
                instrumenter: new isparta.Instrumenter({
                    to5Options: {
                        optional: ["spec.protoToAssign"]
                    }
                })
            })]
        },
        browsers: ["Chrome"]
    });
};

I'm using a fork from this PR of browserify-istanbul and istanbul's fork of karma. In this configuration you do not need to use 6to5ify as isparta is already doing the transformation.

I keep the above as a separate "karma-cover.conf.js" config. For my standard "karma.conf.js" config I use 6to5ify like this:

var to5ify = require("6to5ify");

module.exports = function(config) {
    config.set({
        frameworks: ["browserify", "mocha", "expect"],
        files: [
            "node_modules/core-js/client/core.js",
            "test/**/*.js"
        ],
        reporters: ["progress"],
        preprocessors: {
            "test/**/*.js": ["browserify"]
        },
        browserify: {
            transform: [to5ify.configure({
                optional: ["spec.protoToAssign"]
            })]
        },
        browsers: ["Chrome"],
        singleRun: true
    });
};

[egor-smirnov]

@StevenLangbroek Thank you very much, this helped me a lot! After few hours of trying to make code coverage work with 6to5 + browserify this finally helped.

[lukescott]

Since browserify-istanbul was updated and 6to5 was renamed to babel, here's an updated example:

var isparta = require("isparta");
var istanbul = require("browserify-istanbul");

module.exports = function(config) {
    config.set({
        frameworks: ["browserify", "mocha", "expect"],
        files: [
            "node_modules/core-js/client/core.js",
            "app/**/*.js",
            "test/**/*.js"
        ],
        reporters: ["coverage", "progress"],
        preprocessors: {
            "app/**/*.js": ["browserify"],
            "test/**/*.js": ["browserify"]
        },
        browserify: {
            transform: [istanbul({
                instrumenter: isparta,
                instrumenterConfig: {
                    babelOptions: {
                        optional: ["spec.protoToAssign"]
                    }
                }
            })]
        },
        browsers: ["Chrome"]
    });
};

[egor-smirnov]

@lukescott what karma fork should we use? I can't find istanbul fork of karma at the moment.

[lukescott]

@lastday douglasduteil/karma-coverage until karma-runner/karma-coverage/pull/130 has been merged. Istanbul doesn't need to be forked. Isparta pulls it in as a dependency - it actually extends Istanbul. Isparta replaces Istanbul as an instrumenter.

[egor-smirnov]

@lukescott thank you, that's exactly what I've done.

I just was a bit confused by your phrase 'I'm using a fork from this PR of browserify-istanbul and istanbul's fork of karma'.

[bendrucker]

@lukescott's example is excellent. Only thing I'll add as a maintainer of karma-browserify is that it's a hair easier to use the standard browserify transform options syntax: transforms:[name1, [name2, options]]

You can do this instead and make things a little cleaner:

transform: [
  ['browserify-istanbul', {
    instrumenter: require('isparta')
  }]
]

[douglasduteil]

I'm closing this one for now. Feel free to reopen it if you still have this issue.