Running Angular 6 and up tests (unit and e2e) on CI

Angular is always updating and bringing new features. Angular CLI has also been updated (currently at version 6.x). With latest version it also updated few parameters when running tests.

Running tests

To run tests, we can execute ng test or npm test. This opens the browser and watches for changes. If we change the file, it reruns the tests. This is great for development, but it won’t work on our CI. We have to add few commands:

–watch=false
This will run tests only once and exit. This is replacement for –single-run which was used in older versions.

–no-progress
This is useful to add when running on CI just to limit among of logs.

–browsers=Chrome
We can specify the browser we want to run. This is replacement for –browser which again was working with older versions.

Browsers

By default, tests will be run with Chrome. To be able to better run on CI, we must enable sandbox. We can also run headless chrome. To enable this, we add

in file karma.conf.js below browsers value.

Now we can run tests as

or to run headless Chrome

You can also update package.json and add additional script

and then run the test as

CI

I’m using Circle CI for building. Now we can update the configuration to run tests

This will run our headless Chrome. If we want to run normal Chrome, then we must update run command.

xvfb-run is used to run npm run command using a virtual screen, which is needed by Chrome.

Hi, I'm Erol
Senior Fullstack Developer

I'm available for hire. So if you need help, send me an email.