Adding webpack blocker to stop karma from running tests until build is finished

[ibash]

When you make a code change and then refresh karma, sometimes karma will serve the old test files (because webpack is recompiling). This behavior can become annoying and waste time.

This change adds an optional middleware that will block karma from serving the test files until the build is complete.

Note that the middleware needs to be injected before karma's middleware, which is in this PR: karma-runner/karma#2143

We should hold off on merging until the karma PR above is merged.

[joshwiens]

@ibash - Perhaps a note in the readme ( preferably webpack.io ) so people don't have to go searching for the option

[ibash]

@d3viant0ne What do you mean by preferably webpack.io?

[joshwiens]

@ibash - The readme is fine for now. I retract my previous statement, loaders are at the moment outside the scope of the documentation project underway in webpack/webpack.io

[ibash]

@d3viant0ne Added documentation - is it clear enough? Any suggestions on how to better explain what it does?

[joshwiens]

No, that's perfect. Explanation of the feature and how to enable it was all I was looking for.

[joshwiens]

@ibash - Actually, it would probably be a good idea to note the minimum karma version needed to use webpackBlocker. If i'm reading their releases correctly, the karma version needs to be >1.0 as it doesn't look like to was back ported to the 0.13.x tags.

@MikaAK - Optionally we could add the minimum Karma version as a peerDep.

  "peerDependencies": {
    "webpack": "^1.4.0 || ^2 || ^2.1.0-beta",
    "karma": "< 1"
  },

and tighten the devDeps.

  "devDependencies": {
    "beautify-lint": "^1.0.4",
    "coffee-loader": "~0.7.2",
    "eslint": "^3.1.1",
    "jsbeautify": "^0.3.6",
    "karma": "< 1",
    "karma-chrome-launcher": "~0.1.5",
    "karma-mocha": "~0.1.9",
    "karma-spec-reporter": "~0.0.16"
  },

[ibash]

@d3viant0ne / @MikaAK do you guys have a preference as to which we do? I lean more towards enforcing it in the package.json, but open to just noting it in the readme to (so that it doesn't force users to upgrade if they don't want to).

[joshwiens]

@ibash - @MikaAK is usually online a bit later in the evening and as the loaders lead, this choice is entirely up to him. I'm assuming you want to wrap this up and get it landed, go with the note in the docs you already added. If Mika wants to add a peerDep we can do it later in another PR.

[ibash]

done

[joshwiens]

@MikaAK - LGTM

Thanks @ibash :)

[MikaAK]

It feels like this should be a part of default behavior, maybe we can look into that @d3viant0ne. For now, it's great to have this under a flag. I think if this was default behavior I would add the peer dep but since this is a flag you have to enable, I would leave it as a note in the README so that users can still use versions under 1 without errors

[ibash]

thanks!

[codingleo]

Do you guys have any example of how to use webpackBlocker ? I still didn't understand how it works.

Thanks in advance!

[ibash]

Sure -- in our karma.config.js we have:

    beforeMiddleware: [
      'webpackBlocker'
    ],

Which makes it such that while developing, if I have karma in debug mode, make a code change, and then refresh, the karma tests won't run until the build is finished compiling. Does that make sense?

For really fast builds this won't make that big of a difference, but for builds that take ~30s this can mean less confusing results when running the tests while developing.

[codingleo]

I've put my karma.conf file in autoWatch mode. I've expected that it could rebuild with webpack before running the tests when the file changes. But apparently it's not working yet.

Does the purpose of webBlocker is to build before testing, right? Does it should work with autoWatch ?

By the way, thanks for the fast answer!

[ibash]

I don't see any reason it shouldn't work with autoWatch, but I haven't tried it