• karma-webpack
    • Installation
    • Usage
    • Alternative usage
    • Source Maps
    • Options
      • webpack
      • webpackMiddleware
    • License

    https://github.com/webpack/karma-webpack

    karma-webpack

    Installation

    1. npm install --save-dev karma-webpack

    Usage

    1. // Karma configuration
    3. module.exports = function(config) {
    4.     config.set({
    5.         // ... normal karma configuration
    7.         files: [
    8.             // all files ending in "_test"
    9.             'test/*_test.js',
    10.             'test/**/*_test.js'
    11.             // each file acts as entry point for the webpack configuration
    12.         ],
    14.         preprocessors: {
    15.             // add webpack as preprocessor
    16.             'test/*_test.js': ['webpack'],
    17.             'test/**/*_test.js': ['webpack']
    18.         },
    20.         webpack: {
    21.             // karma watches the test entry points
    22.             // (you don't need to specify the entry option)
    23.             // webpack watches dependencies
    25.             // webpack configuration
    26.         },
    28.         webpackMiddleware: {
    29.             // webpack-dev-middleware configuration
    30.             // i. e.
    31.             noInfo: true
    32.         },
    34.         plugins: [
    35.             require("karma-webpack")
    36.         ]
    38.     });
    39. };

    Alternative usage

    This configuration is more performant, but you cannot run single test anymore (only the complete suite).

    The above configuration generates a webpack bundle for each test. For many testcases this can result in many big files. The alterative configuration creates a single bundle with all testcases.

    1.         files: [
    2.             // only specify one entry point
    3.             // and require all tests in there
    4.             'test/test_index.js'
    5.         ],
    7.         preprocessors: {
    8.             // add webpack as preprocessor
    9.             'test/test_index.js': ['webpack']
    10.         },
    1. // test/test_index.js
    3. // require all modules ending in "_test" from the
    4. // current directory and all subdirectories
    5. var testsContext = require.context(".", true, /_test$/);
    6. testsContext.keys().forEach(testsContext);

    Every test file is required using the require.context and compiled with webpack into one test bundle.

    Source Maps

    You can use the karma-sourcemap-loader to get the source maps generated for your test bundle.

    1. npm install --save-dev karma-sourcemap-loader

    And then add it to your preprocessors

    1. preprocessors: {
    2.     'test/test_index.js': ['webpack', 'sourcemap']
    3. }

    And tell webpack to generate sourcemaps

    1. webpack: {
    2.   // ...
    3.     devtool: 'inline-source-map'
    4. }

    Options

    This is the full list of options you can specify in your Karma config.

    webpack

    Webpack configuration.

    webpackMiddleware

    Configuration for webpack-dev-middleware.

    License

    Copyright 2014-2015 Tobias Koppers

    MIT