New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add optional support for code-coverage of generated code #23

Closed
wants to merge 2 commits into
base: master
from

Conversation

Projects
None yet
1 participant
@uglow

uglow commented Apr 20, 2017

Fixes #22

Example output from Webpack + Karma + karma-coverage:

--------------------------|----------|----------|----------|----------|----------------|
File                      |  % Stmts | % Branch |  % Funcs |  % Lines |Uncovered Lines |
--------------------------|----------|----------|----------|----------|----------------|
 notifications/           |    70.76 |     28.4 |    77.78 |    72.61 |                |
  notification.html       |    73.12 |       30 |    76.92 |    74.16 |... 155,156,157 |
  notificationsPanel.html |    67.95 |    27.45 |    78.57 |    70.59 |... 159,161,162 |
  statuses.js             |      100 |      100 |      100 |      100 |                |
  types.js                |      100 |      100 |      100 |      100 |                |
--------------------------|----------|----------|----------|----------|----------------|
All files                 |    70.76 |     28.4 |    77.78 |    72.61 |                |
--------------------------|----------|----------|----------|----------|----------------|

karma.config.js:

// Global karma config
'use strict';

const DefinePlugin = require('webpack').DefinePlugin;   // Needed to pass the testFilesRegEx to test.files.js
let testFilesRegEx = /unitTest\/.*spec\.(js|jsx)$/;

// Customise the testFilesRegEx to filter which files to test, if desired.
// Remember to also update .babelrc

// We want to re-use the loaders from the dev.webpack.config
let webpackConfig = require('./../webpack/dev.webpack.config.js');
let preprocessorList = ['webpack', 'sourcemap'];

let karmaConfig = {
  autoWatch: true,

  // base path, that will be used to resolve files and exclude
  basePath: '../../',

  // testing framework to use (jasmine/mocha/qunit/...)
  frameworks: ['jasmine'],

  // list of files / patterns to exclude
  exclude: [],

  // web server default port
  port: 8081,

  // Start these browsers, currently available:
  // - Chrome, ChromeCanary, Firefox, Opera, Safari (only Mac), PhantomJS, IE (only Windows)
  browsers: [
    'PhantomJS'
  ],

  plugins: [
    'karma-phantomjs-launcher',
    'karma-jasmine',
    'karma-junit-reporter',
    'karma-coverage',
    'karma-chrome-launcher',
    require('karma-webpack'),
    'karma-sourcemap-loader',
    'karma-threshold-reporter'
  ],

  files: [
    'node_modules/phantomjs-polyfill/bind-polyfill.js',
    'node_modules/phantomjs-polyfill-object-assign/object-assign-polyfill.js',
    'config/testUnit/test.files.js'
  ],

  preprocessors: {
    'config/testUnit/test.files.js': preprocessorList
  },

  reporters: ['progress', 'junit', 'coverage', 'threshold'],

  coverageReporter: {
    dir: 'reports/coverage/',
    reporters: [
      { type: 'cobertura', subdir: 'cobertura' },
      { type: 'lcovonly', subdir: 'lcov' },
      { type: 'html', subdir: 'html' },
      { type: 'json', subdir: 'json' },
      { type: 'text' }
    ],
    // --------------------- Extra config required (start) -------------------------
    // A custom report collector for Svelte HTML components, so that source maps display for generated code
    _onWriteReport: function(collector) {
      // Iterate over the keys of the collector.
      // If the collector key is a HTML file, do this: coverage.code = coverage.inputSourceMap.code
      var store = collector.store;
      var keys = store.keys().filter(function(key) {
        return /\.html$/.test(key);
      });

      keys.forEach(function(key) {
        let coverage = store.getObject(key);

        if (coverage.inputSourceMap) {
          // Replace the existing key with one that has the code property
          coverage.code = coverage.inputSourceMap.sourcesContent[0].split(/(?:\r?\n)|\r/);
          store.set(key, JSON.stringify(coverage))
        }
      });

      return collector;
    }
    // --------------------- Extra config required (end) -------------------------
  },

  junitReporter: {
    outputDir: 'reports/unit/'
  },

  thresholdReporter: require('./thresholds.json'),

  // Webpack please don't spam the console when running in karma!
  webpackMiddleware: { stats: 'errors-only'},

  singleRun: false,
  colors: true
};

webpackConfig.plugins.push(new DefinePlugin({
  __karmaTestSpec: testFilesRegEx
}));

// Change devtool to allow the sourcemap loader to work: https://github.com/webpack/karma-webpack
webpackConfig.devtool = 'inline-source-map';

// Turn off performance hints
webpackConfig.performance.hints = false;

karmaConfig.webpack = webpackConfig;

module.exports = karmaConfig;
@uglow

This comment has been minimized.

Show comment
Hide comment
@uglow

uglow May 9, 2017

@Rich-Harris What do we do with this? I need code-coverage reports to work with Svelte & non-Svelte code.

uglow commented May 9, 2017

@Rich-Harris What do we do with this? I need code-coverage reports to work with Svelte & non-Svelte code.

@uglow

This comment has been minimized.

Show comment
Hide comment
@uglow

uglow commented Jun 13, 2017

Bump

@uglow uglow closed this Jun 3, 2018

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment