Istanbul plugin for webpack

Instrument JS files with Istanbul for subsequent code coverage reporting.

This is a full plugin which will also act as a instrument loader, and also make sure that all files will be included in the report.

Install

$ npm i -D webpack-istanbul-plugin

Setup

References

• Using loaders
• karma-webpack
• karma-coverage
• istanbul-instrumenter-loader

Project structure

Let's say you have the following:

├── src/
│   └── components/
│       ├── bar/
│       │   └── index.js
│       └── foo/
│           └── index.js
└── test/
    └── src/
        └── components/
            └── foo/
                └── index.js

To create a code coverage report for all components (even for those for which you have no tests yet) you have to process all files. then, run the tests.

this is very similar to "Project structure", but we don't actually require everything, just load it and then require just the tests.

test/index.js

const codeContext = require.context("./src/components", true, /.+\.js$/);
codeContext.keys().forEach((file) => {
    // And require all spec files to run them.
    if ( file.indexOf(".spec.js") !== -1 ) {
        codeContext(file);
    }
});

This file will be the only entry point for Webpack:

webpack.config.test.js

    …
    module.exports = {
        …
        module: {
            preLoaders: [
                // instrument only testing sources with Istanbul
                {
                    test: /\.js$/,
                    include: path.resolve('src/components/'),
                    loader: 'istanbul-instrumenter'
                }
            ],
			plugins: [
				new IstanbulPlugin({
					test: /\.js$/,
					include: [
						path.resolve('src/components'),
					],
					exclude: [
						path.resolve('node_modules'),
						path.resolve('test/index.js'),
						/\.spec\.js$/,
					],
				}),
			],
        }
        …
    },

Example Usage

I'm using this with both mocha-webpack and mocha-istanbul-spec here is an example repository

License

WTFPL