Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to instrument Angular CLI to report coverage on all source files

When running ng test --code-coverage only coverage for source files that are undergoing tests are reported in the coverage report. How to configure instrumentation to include all source files (e.g. all .ts files in src/app folder)?

I have tried different things:

  • Following https://github.com/angular/angular-cli/issues/1735 I tried replacing the suggested context definition. This does not work at all in my case. Loads of errors are outputted and no tests are executed
  • Remove istanbul as dependency and rely solely on karma-coverage, where it is possible to configure includeAllSources: true - however Angular CLI cannot run without karma-coverage-istanbul-reporter
  • A combination of the above with karma-coverage-istanbul-reporter as a dependency - no difference from the original setup

There has to be some way to instrument Angular CLI to include all source files. Adding empty specs seems tedious and error-prone, since coverage will not show up at all if the class/source file is not undergoing test and you therefore manually have to check whether it's included in the coverage report or not.

Any suggestions appreciated!

Various information:

ng --version

@angular/cli: 1.4.8
node: 6.11.3
os: linux x64
@angular/animations: 4.4.6
@angular/common: 4.4.6
@angular/compiler: 4.4.6
@angular/core: 4.4.6
@angular/forms: 4.4.6
@angular/http: 4.4.6
@angular/platform-browser: 4.4.6
@angular/platform-browser-dynamic: 4.4.6
@angular/router: 4.4.6
@angular/cli: 1.4.8
@angular/compiler-cli: 4.4.6
@angular/language-service: 4.4.6
typescript: 2.3.4

package.json:

"devDependencies": {
    "@angular/cli": "1.4.8",
    "@angular/compiler-cli": "^4.2.4",
    "@angular/language-service": "^4.2.4",
    "@types/jasmine": "~2.5.53",
    "@types/jasminewd2": "~2.0.2",
    "@types/node": "~6.0.60",
    "codelyzer": "~3.2.0",
    "jasmine-core": "~2.6.2",
    "jasmine-jquery": "2.1.1",
    "jasmine-spec-reporter": "~4.1.0",
    "karma": "^1.7.1",
    "karma-chrome-launcher": "~2.1.1",
    "karma-cli": "~1.0.1",
    "karma-coverage": "^1.1.1",
    "karma-coverage-istanbul-reporter": "^1.2.1",
    "karma-htmlfile-reporter": "0.3.5",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "karma-json-reporter": "1.2.1",
    "karma-spec-reporter": "0.0.31",
    "ts-node": "~3.2.0",
    "tslint": "~5.7.0",
    "typescript": "~2.3.3"
}

karma.conf.js:

module.exports = function (config) {
    config.set({
        basePath: '',
        frameworks: ['jasmine', '@angular/cli'],
        plugins: [
            require('karma-jasmine'),
            require('karma-chrome-launcher'),
            require('karma-jasmine-html-reporter'),
            require('karma-coverage'),
            require('karma-spec-reporter'),
            require('karma-htmlfile-reporter'),
            require('karma-json-reporter'),
            //require('karma-coverage-istanbul-reporter'),
            require('@angular/cli/plugins/karma')
        ],
        files: [
        ],
        client:{
            clearContext: false // leave Jasmine Spec Runner output visible in browser
        },
        // coverageIstanbulReporter: {
        //     reports: [ 'html', 'text', 'text-summary', 'json' ],
        //     fixWebpackSourcePaths: true
        // },

        angularCli: {
            environment: 'dev'
        },
        reporters: ['spec', 'kjhtml', 'html', 'json', 'coverage'],
        preprocessors: {
            'src/app/*.ts': ['coverage']
        },
        htmlReporter: {
            outputFile: 'testresults/index.html',
            pageTitle: 'CRS Frontend Unit-tests - test results'
        },
        jsonReporter: {
            stdout: false,
            outputFile: 'testresults/results.json' // defaults to none
        },
        coverageReporter: {
            dir: 'coverage',
            includeAllSources: true,
            reporters: [
                { type: 'html', subdir: 'html' },
                { type: 'json', subdir: 'json' }
            ]
        },
        port: 9876,
        colors: true,
        logLevel: config.LOG_INFO,
        autoWatch: true,
        browsers: ['Chrome'],
        singleRun: true,
        failOnEmptyTestSuite: false
    });
};
like image 712
Hoof Avatar asked Oct 23 '17 10:10

Hoof


2 Answers

Please do the following changes if you using angular CLI 1.7.X

~/src/test.ts

const context = require.context('./', true, /\/app\/.*\.ts$/);

~/src/tsconfig.spec.json

  "include": [
    "**/*.ts",
    "**/*.d.ts"
  ]
like image 64
fernando Avatar answered Jan 02 '23 13:01

fernando


I've had good luck using the karma-sabarivka-reporter to pick up missed source files into coverage.

like image 45
phoenix Avatar answered Jan 02 '23 12:01

phoenix