mocha test runner with integrated webpack precompiler
Switch branches/tags
Clone or download
Permalink
Failed to load latest commit information.
bin Update dependencies; update code to pass new lints Jul 18, 2016
docs Update dependencies to enable Greenkeeper 🌴 (#223) Mar 21, 2018
lib Core refactoring (#78) Dec 7, 2016
src Remove unnecessary prepend of test with current folder (#145) Apr 11, 2018
test Update dependencies to enable Greenkeeper 🌴 (#223) Mar 21, 2018
.babelrc update a bunch of deps (#190) Mar 16, 2018
.bookignore optimize deployment (#224) Mar 21, 2018
.editorconfig initial commit Feb 13, 2016
.eslintignore pretty webpack build errors / warnings (#99) Jan 9, 2017
.eslintrc Update eslint-config-airbnb-base and eslint-plugin-import to their la… Mar 20, 2018
.flowconfig add mocha4 support, use mocha4/webpack3 by default in development, re… ( Oct 27, 2017
.gitattributes limit lf endings to text files (#221) Mar 20, 2018
.gitignore documentation (#105) Jan 12, 2017
.npmrc replace custom release scripts in favour of np (#55) Oct 8, 2016
.travis.yml Update dependencies to enable Greenkeeper 🌴 (#223) Mar 21, 2018
CONTRIBUTING.md Webpack v4 support (#211) Mar 18, 2018
LICENSE.md update copyright year (#101) Jan 11, 2017
README.md Update dependencies to enable Greenkeeper 🌴 (#223) Mar 21, 2018
SUMMARY.md Update dependencies to enable Greenkeeper 🌴 (#223) Mar 21, 2018
appveyor.yml Update dependencies to enable Greenkeeper 🌴 (#223) Mar 21, 2018
book.json Update dependencies to enable Greenkeeper 🌴 (#223) Mar 21, 2018
package.json optimize deployment (#224) Mar 21, 2018

README.md

mocha-webpack npm package Build Status Linux Build Status Windows codecov Greenkeeper badge

mocha test runner with integrated webpack precompiler

mocha-webpack is basically a wrapper around the following command...

$ webpack test.js output.js && mocha output.js

... but in a much more powerful & optimized way.

CLI

mocha-webpack ...

  • precompiles your test files automatically with webpack before executing tests
  • handles source-maps automatically for you
  • does not write any files to disk
  • understands globs & all other stuff as test entries like mocha

Benefits over plain mocha

  • has nearly the same CLI as mocha
  • you don't rely on hacky solutions to mock all benefits from webpack, like path resolution
  • mocha-webpack provides a much better watch mode than mocha

Watch mode (--watch)

Unlike mocha, mocha-webpack analyzes your dependency graph and run only those test files that were affected by this file change.

You'll get continuous feedback whenever you make changes as all tests that are related in any way to this change will be tested again. Isn't that awesome?

If any build errors happens, they will be shown like below

CLI

Which version works with mocha-webpack?

mocha-webpack works with

  • webpack in version 4.x.x
  • mocha in version 4.x.x & 5.x.x

Installation

Install mocha-webpack via npm install

$ npm install webpack mocha mocha-webpack --save-dev

and use it via npm scripts in your package.json

Further installation and configuration instructions can be found in the installation chapter.

Sample commands

run a single test

mocha-webpack simple.test.js

run all tests by glob

mocha-webpack "test/**/*.js"

Note: You may noticed the quotes around the glob pattern. That's unfortunately necessary as most terminals will resolve globs automatically.

run all tests in directory "test" matching the file pattern *.test.js (add --recursive to include subdirectories)

mocha-webpack --glob "*.test.js" test

Watch mode? just add --watch

mocha-webpack --watch test

License

MIT