Quick feedback loop

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!

Watch and run the tests

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

Watch and update the browser

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".

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset