Automated testing is all about the quick feedback loop, so imagine being able to have the tests running in the console and the application refreshing on the browser after any file change. Would that be possible? The answer is yes!
Via a simple parameter while starting Karma, we can achieve testing nirvana, as follows:
./node_modules/karma/bin/karma start karma.conf.js --auto-watch --no-single-run
Try it by yourself; run this command, change a file, and see the tests running automatically—like magic.
Once again, we don't want to remember these complicated commands, so let's add another script to the package.json
file:
"scripts": {
"test": "./node_modules/karma/bin/karma start karma.conf.js",
"watch-test": "./node_modules/karma/bin/karma start karma.conf.js --auto-watch --no-single-run",
"dev": "webpack-dev-server"
},
We can run it through the following command:
npm run watch-test
To achieve development nirvana, we are also just a parameter away.
While starting the development server, add the following to the package.json
file:
./node_modules/.bin/webpack-dev-server --inline –hot
Once again, try it on your browser; change a file in the text editor and the browser should refresh.
You are also encouraged to update the package.json
file with these new parameters so that running npm run dev
gets you the goodness of "live reload".