M'λ' M'λ' - 1 year ago 110
TypeScript Question

TypeScript compilation failure and Karma test execution?

I'm currently using Karma + Jasmine to run the tests on my TypeScript-based project, and I want to 'break the tests' when TypeScript compilation fail in karma watch mode.

I'm using standard Karma configuration and compiling TS using webpack preprocessor (which compiles TS files). Everything works perfectly fine, except that seeing all tests pass when a compilation error occurs is highly misleading (karma rerun previous tests even if webpack compilation fails).

It seems rather trivial, but after an hour or two of looking at documentation and searching Google I'm desperately looking for a solution, which I didn't find.

Is there a solution involving karma, jasmine, webpack and TypeScript that can break the tests when a compilation error occurs without breaking the watch mode?

edit : Precision on the watch mode added.

Answer Source

personally I am not using karma along with webpack in a single workflow. But remember from doing some research on using them together including typescript and there are issues https://github.com/webpack/karma-webpack/issues/49 and https://github.com/webpack/webpack/issues/708 wihich you might be facing. So as mentioned bail option is not working as expected you can try using a plugin mentioned which will fail on TS error (quoting suggestion from this comment to issue #708).

UPDATE: As for the watch case I would consider a change that prevents webpack from failing but at the same time raising the error and prevent karma from executing tests as well (based on this suggestion).

module.exports = function (config) {


    browsers: [ 'Chrome' ],
    frameworks: [ 'mocha' ],
    reporters: [ 'mocha' ],

    files: [
      // ...

    // ...
    webpack: {
      plugins: [
              this.plugin("done", function(stats)
                  // Log each of the errors
                  stats.compilation.errors.forEach(function (error) {
                      console.log(error.message || error);

                  // Pretend no assets were generated. This prevents the tests
                  // from running making it clear that there were errors.
                  stats.stats = [{
                      toJson: function () {
                          return this;
                      assets: []


I've just checked adding above plugin to fairly simple project https://github.com/itajaja/tslib-webpack-starter and tests are failing for any TS compilation errors.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download