Code coverage for html templates for AngularJS

We use istanbul to cover the code in our karma tests. This is great for tracking the coverage of our unit test code in JavaScript. However, this does not track code coverage in our HTML templates.

We have very little logic in our templates, but there is still complexity that we want to track and ensure that we have reviewed our tests correctly. What are the best methods to ensure that all of your HTML templates are properly covered. In our particular case, we use ng-if and ng-switch. We would like all branches to be properly covered.

+8
html angularjs code-coverage istanbul
source share
2 answers

While you can get coverage reports from Istanbul through third-party plugins ( https://www.npmjs.com/package/protractor-istanbul-plugin ), the problem is that unlike React or another library that convert templates (JSX ) in javascript DOM manipulation, Angular does not expose the generated DOM in such a way that it is possible for the tools needed to generate coverage reports.

+1
source share

Unfortunately, istanbul and karma are designed to test JavaScript, not HTML templates. Since your ng-if and ng-switch statements are more likely to influence what is displayed / not displayed on the page, you might consider using the Angular end-to-end package, Protractor . As far as I know, there is no coverage tool for end-to-end testing.

0
source share

All Articles