I am working on getting an app set up using Angular 2 w/ typescript and I'm having issues getting my karma coverage to find the files I want it to inspect. I've set this up successfully on an angular 1.x application but there seems to be another layer I'm missing with typescript.
Everything runs just fine, I see all of my unit tests being checked by karma as expected and coverage says everything was okay and that my code has 100% coverage, which threw up a red flag. After checking the html output for coverage I saw that I have 100% coverage because no files are being checked.
Looking at the output in my terminal I see that all of the files I have selected with pattern: './src/**/*.js' are being excluded, which means it is only finding the .ts files and not compiling them into js.
I also see a message in the terminal above the coverage output that says "Not all files specified in sources could be found, continue with partial remapping."
I had added the typescriptPreprocesser thinking that it would convert the ts files into js files during testing so that the coverage tool could parse them, but nothing I've done so far is working.
Here's my karam.conf.js file in it's entirety:
var path = require('path');
var webpackConfig = require('./webpack.config');
module.exports = function (config) {
var _config = {
// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: '',
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
frameworks: ['jasmine'],
// list of files / patterns to load in the browser
files: [
{
pattern: './karma-shim.js',
watched: false
},
{
pattern: './src/**/*.js',
included: true
}
],
// list of files to exclude
exclude: [
'./src/e2e/*'
],
// preprocess matching files before serving them to the browser
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
preprocessors: {
'./karma-shim.js': ['webpack', 'sourcemap'],
'./src/**/*.ts': ['typescript'],
'./src/**/*.js': ['coverage']
},
typescriptPreprocessor: {
// options passed to the typescript compiler
options: {
sourceMap: false, // (optional) Generates corresponding .map file.
target: 'ES5', // (optional) Specify ECMAScript target version: 'ES3' (default), or 'ES5'
module: 'amd', // (optional) Specify module code generation: 'commonjs' or 'amd'
noImplicitAny: true, // (optional) Warn on expressions and declarations with an implied 'any' type.
noResolve: true, // (optional) Skip resolution and preprocessing.
removeComments: true, // (optional) Do not emit comments to output.
concatenateOutput: false // (optional) Concatenate and emit output to single file. By default true if module option is omited, otherwise false.
},
// transforming the filenames
transformPath: function(path) {
return path.replace(/\.ts$/, '.js');
}
},
webpack: webpackConfig,
webpackMiddleware: {
// webpack-dev-middleware configuration
// i. e.
stats: 'errors-only'
},
coverageReporter: {
dir: 'coverage/',
reporters: [{
type: 'html',
dir: 'coverage'
}]
},
remapIstanbulReporter: {
src: 'coverage/json/coverage-final.json',
reports: {
lcovonly: 'coverage/json/lcov.info',
html: 'coverage/html',
'text': null
},
timeoutNotCreated: 1000, // default value
timeoutNoMoreFiles: 1000 // default value
},
webpackServer: {
noInfo: true // please don't spam the console when running in karma!
},
// test results reporter to use
// possible values: 'dots', 'progress', 'mocha'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ["mocha", "coverage", "karma-remap-istanbul"],
// web server port
port: 9876,
// enable / disable colors in the output (reporters and logs)
colors: true,
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
logLevel: config.LOG_INFO,
// enable / disable watching file and executing tests whenever any file changes
autoWatch: false,
// start these browsers
// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
browsers: ['Chrome'], // you can also use Chrome
// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: true
};
config.set(_config);
};
My terminal output incase it helps:
> karma start
START:
10 06 2016 16:32:20.696:WARN [watcher]: All files matched by "/Users/efarl1/Desktop/repos/cmg-prod/src/**/*.js" were excluded.
webpack: wait until bundle finished:
ts-loader: Using [email protected] and /Users/efarl1/Desktop/repos/cmg-prod/tsconfig.json
webpack: bundle is now VALID.
10 06 2016 16:32:35.364:INFO [karma]: Karma v0.13.22 server started at http://localhost:9876/
10 06 2016 16:32:35.367:INFO [launcher]: Starting browser Chrome
10 06 2016 16:32:36.132:INFO [Chrome 51.0.2704 (Mac OS X 10.11.5)]: Connected on socket /#asaknUl4K3m9G7wLAAAA with id 96149396
AppComponent
✔ should log ngOnInit
LOG: 'THREE.WebGLRenderer', '73'
LOG: 'THREE.WebGLRenderer', '73'
ProductViewportComponent
✔ ProductViewportComponent should have an H1 with `ProductViewport Component` in it
ProductCameraService
✔ should log ngOnInit
ProductClickedObjectService
✔ should log ngOnInit
ProductControlsService
✔ should log ngOnInit
ProductEventsService
✔ should log ngOnInit
ProductRendererService
✔ should log ngOnInit
ProductService
✔ should log ngOnInit
WindowService
✔ should log ngOnInit
Finished in 0.295 secs / 0.241 secs
SUMMARY:
✔ 9 tests completed
Not all files specified in sources could be found, continue with partial remapping.
----------|----------|----------|----------|----------|----------------|
File | % Stmts | % Branch | % Funcs | % Lines |Uncovered Lines |
----------|----------|----------|----------|----------|----------------|
----------|----------|----------|----------|----------|----------------|
All files | 100 | 100 | 100 | 100 | |
----------|----------|----------|----------|----------|----------------|
Any thoughts on what I'm doing wrong here?
