istanbul-hdca-report v0.0.2

istanbul-hdca-report

About

Custom plugin for istanbul-api that generates interactive code coverage statistics. The data can be filtered by project directory and can be sorted.

Installation

To get started, install this plugin and the lastest istanbul-api package:

npm install istanbul-hdca-report istanbul-api@2.0.0 --save-dev

A newer version of istanbul-api is needed to support custom reporters such as this one. However, the plugin that Angular uses to run the reporters, karma-coverage-istanbul-reporter, is using an older version of istanbul-api without support for custom reporters. Simply installing the newer version should fix this issue. If you are still having trouble getting karma-coverage-istanbul-reporter to use the latest istanbul-api, try deleting node_modules and package-lock.json and reinstalling.

Configuration

// inside karma.conf.js
coverageIstanbulReporter: {
  // other configuration...
  reports: ['istanbul-hdca-report'],
  summarizer: 'flat', // required for custom reporter to work
  'report-config': {
    'istanbul-hdca-report': {
      projectPath: 'app/modules'
    }
  }
}

projectPath tells the plugin where to look for top-level projects. All immediate folders inside the projectPath will be considered projects by the plugin, and files inside will be grouped under that project.

Usage

The plugin will generate the dashboard when running ng test --code-coverage. By default it will be in the coverage directory.

The dashboard also supports URL query parameters for setting the default project filter. The dashboard can be accessed at http://{dashboard-url}?project={project-name}, where dashboard-url is the endpoint that hosts the coverage directory files, and project-name is the project-specific files to show. For example, suppose the dashboard is hosted at coverage.homedepot.ca, then http://coverage.homedepot.ca?project=cart will show the files in the cart project if it exists. by default the dashboard will show the top-level projects only.

Individual files' coverage statistics can also be accesed by navigating to http://{dashboard-url}/{path/to/individual/file}.html. For example, http://coverage.homedepot.ca/app/modules/cart/components/index.ts.html will show the file coverage statistics for app/modules/cart/components/index.ts.

##publish

Bump vesion in package.json npm publish