Wie man Code-Coverage mit Karma, Typoskript und Browserify macht
Wie richten Sie Karma Test Runner ein, um Berichte zur Codeabdeckung eines Typoskript-Projekts zu generieren?
Gaben Sie die folgende Ordnerstruktur und die Datei karma.conf.js an. Ich verwende Karma bereits, um meine in TypeScript geschriebenen Tests auszuführen.
Ich habe schon mit @ rumgespiekarma-coverage
undremap-istanbul
aber noch ohne glück. Wenn möglich würde ich es gerne ohne zusätzliches @ machnpm scripts
.
.
├── karma.conf.js
├── package.json
├── src
│ └── add.ts
├── test
│ └── addSpec.ts
├── tsconfig.json
├── typings
│ ├── globals
│ └── index.d.ts
└── typings.json
karma.conf.js
var istanbul = require('browserify-istanbul');
module.exports = function(config) {
config.set({
basePath: '',
frameworks: ['mocha', 'chai', 'sinon', 'browserify'],
files: [
'test/**/*Spec.ts'
],
exclude: [
],
preprocessors: {
'test/**/*Spec.ts': ['browserify']
},
browserify: {
debug: true,
plugin: ['tsify'],
transform: [
istanbul({irgnore: ['**/node_modules/**']})
]
},
reporters: ['progress', 'coverage']
})
}
Update 1:Ich habe einige Fortschritte gemacht, indem ich @ hinzugefügt habrowserify-istanbul
zum Setup. Ich denke, die Gesamtmetriken sind in Ordnung, aber die Quelldatei-Ansicht ist ein bisschen seltsam.
addSpec.ts
import { add } from '../src/add'
const expect = chai.expect
describe('test add module', () => {
it('should add 2 numbers', () => {
expect(add(2, 2)).to.be.equal(4)
})
})
Update 2:Bis heute konnte ich keine Möglichkeit finden, ein "integriertes" Karma-Setup mit browserify und typescript zu erstellen. Trotzdem habe ich eine andere Lösung, die für mich funktioniert.
karma.conf.js
module.exports = function(config) {
config.set({
basePath: '',
frameworks: ['source-map-support', 'mocha'],
files: [
'test/**/*Spec.ts'
],
exclude: [],
preprocessors: {
'test/**/*Spec.ts': ['webpack']
},
webpack: {
devtool: 'inline-source-map',
resolve: {
extensions: ['', '.ts', '.js']
},
module: {
loaders: [
{ test: /\.ts$/, exclude: /node_modules/, loader: 'ts-loader', query: { compilerOptions: { inlineSourceMap: true }} }
],
postLoaders: [
{ test: /\.ts$/, include: /src/, loader: 'istanbul-instrumenter' }
]
}
},
webpackMiddleware: {
noInfo: true
},
reporters: ['progress', 'coverage'],
coverageReporter: {
dir: 'coverage',
reporters: [
{ type: 'json', subdir: '.', file: 'coverage.json' }
]
},
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Electron'],
singleRun: false,
concurrency: Infinity
})
}
package.json
{
...
"scripts": {
"test": "rimraf coverage && karma start --single-run && npm run coverage",
"coverage": "npm run coverage:remap && npm run coverage:report",
"coverage:remap": "remap-istanbul -i coverage/coverage.json -o coverage/coverage.json -t json",
"coverage:report": "istanbul report html"
},
...
}