How to Add a Test Coverage Report to an Angular CLI Project

by Jason Swett,

Angular CLI has test coverage reporting somewhat built in.

First install the dependencies.

Then run ng test.

Then run the server that shows you your report.

You should see something like this.

  •  
  •  
  •  
  •  

7 thoughts on “How to Add a Test Coverage Report to an Angular CLI Project

  1. Benjamin Alvarez

    Excellent contribution, thank you very much for taking the time to show us how to use this tool.

    when i try to run the server I can not see the report as samples in the guide.

    I try this
    ng serve -c-1 -o -p 9875 ./coverage

    Reply
  2. Jason

    I am confused. I thought this was a code coverage report, not a test coverage report. The code coverage report generated by istanbul tells us if all functions are called and if all if/else blocks can be executed, for example. but I was not aware that it tells us if we have enough unit tests written for this code. Are you saying that it does?

    Reply
  3. Jim

    Thanks for this Jason! I wasted so much time fiddling with my karma.conf.js file with no success.

    After running your first two commands, I had it working with literally no changes to the karma config file at all.

    Woohoo! 🥳

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *