No code coverage for Angular 1 Typescript

[prbaron]

Hi, I used the v0.5 version of the generator. I just created a new app and ran gulp test. Even though a coverage/ folder has been created with the different files, when I open the index.html, I have no information about my code coverage.

[Swiip]

I don't know any satisfying solution to have coverage for TS. So right now, there is none.

[JimLynchCodes]

How about Chutzpah or remap-instanbull?

http://stackoverflow.com/questions/17026959/code-coverage-for-typescript

[prbaron]

I have been able to make it work, here are my changes : tsconfig.json

"compilerOptions": {
  "inlineSourceMap": true,
}

webpack-test.conf.js

postLoaders : [
  {
    test: /^((?!\.spec\.ts).)*.ts$/,
    exclude: /(node_modules|tests)/,
    loader: 'istanbul-instrumenter' // used to to get the code coverage for TypeScript
  }
];

karma.conf.js

reporters: ['progress', 'coverage'],
coverageReporter: {
  reporters: [
    {
      dir: 'coverage',
      subdir: '.',
      type: 'json'
    }
  ]
},
plugins: [
  require('karma-coverage'),
]

Then in gulp_tasks/karma.js

const remapIstanbul = require('remap-istanbul/lib/gulpRemapIstanbul');
gulp.task('remap-istanbul', function() {
  return gulp.src('coverage/coverage-final.json')
    .pipe(remapIstanbul({
      reports: {
        'json': 'coverage/coverage-final.json',
        'html': 'coverage/html'
      }
    }));
});

gulpfile.js

gulp.task('test', gulp.series('karma:single-run', 'remap-istanbul'));

Then do not forget to install the dependencies.

npm i --save-dev istanbul-instrumenter-loader karma-coverage remap-istanbul

And now you should be able to get the code coverage for you project.

BONUS : since the sourcemap is done in TypeScript, you can remove the one from webpack

webpack-test.conf.js

devtool: false;

[WilliamChelman]

@prbaron Thanks for the hack, I just had an issue with the postLoader, none of my .ts were processed, I had to change the regex used:

postLoaders : [
  {
    test: /\.ts$/,
    exclude: /(node_modules|tests|(.spec\.ts))/,
    loaders: ['istanbul-instrumenter'] // used to to get the code coverage for TypeScript
  }
]

[prbaron]

@Nephidream You are correct. The right regex is test: /^((?!\.spec\.ts).)*.ts$/. I updated my answer according to it.

[Swiip]

Sorry for the delay. This is great, we should include it.