How to use Jest unit tests with Angular

The Jest unit test framework is a relatively new unit testing tool built by Facebook, it is widely used for testing ReactJS projects. Studies shows that Jest is much faster than other unit test frameworks for JavaScript, since it’s using a custom built JavaScript engine instead of running the tests in a full blown browser.

The question is can it also be used for unit tests in an Angular project?
The answer is yes!

Setup the Angular project

So let’s get started, first you need an Angular project that you want to create and run the unit tests for. In this guide we will create the Jest unit tests for the Angular’s Tutorial: Tour of Heroes.

If you want to follow along this guide interactively, you can download the starting point from here: https://angular.io/generated/zips/toh-pt6/toh-pt6.zip

Unzip it in some folder and run npm install in the folder to get all npm dependencies that you need.

Running the tests with Karma

The project is already shipped with unit tests using Karma. Let’s see if they are working before we convert the project to Jest.
So I started up the tests with command npm run testand noticed that 7 of 8 tests failed. So I had to fix them first before…