Karma-stacktrace NPM

karma-stacktrace

npm GitHub

What

Karma framework to provide human-readable mapped stacktraces for failed tests to make debugging easier in your browser.

Motivation

Test frameworks like QUnit and Jasmine use non-standard stack property of Error object to output a stacktrace for failed unit tests. Modern browsers do not apply sourcemaps to Error.prototype.stack and unmapped stacktrace looks useless.

An example of an unmapped stacktrace:

Original stacktrace

The framework catches failed tests and reports mapped stacktrace by using stacktrace-js library:

Mapped stacktrace

Install

Install with yarn:

yarn add karma-stacktrace

With npm:

npm install karma-stacktrace

Karma configuration

Add stacktrace to the list of frameworks in your karma configuration:

// karma.conf.js
module.exports = function (config) {
  config.set({
    //...
    frameworks: ['stacktrace']
    //...
  });
};

To avoid blocking the main execution thread web worker is used by default for parsing/mapping stacktrace, however you can disable it by setting useWorker option to false:

// karma.conf.js
module.exports = function (config) {
  config.set({
    //...
    client: {
      stacktrace: {
        useWorker: false
      }
    }
    //...
  });
};

If you use inline sourcemaps (devtool: 'inline-source-map') you need to disable the web worker.

Limitations/Gotchas

The framework supports Jasmine and QUnit testing frameworks.
The framework does not affect stacktrace in original messages, it attaches isolated reporters to trace mapped stacktrace.
Set useWorker option to false value for inline sourcemaps to get mapped stacktrace.