我有一个混合的Angular App(在1.7.5和8.2.10之间混合使用),它在TypeScript和JavaScript之间混合使用。
要运行单元测试,我有两个单独的npm脚本,一个用于ngX测试,一个用于ng1测试。
我的问题是,当我运行ng1测试进行调试时,打字稿代码始终启用代码覆盖率,这意味着它已缩小,并具有多余的代码行来计数我要击中的行/分支/语句/功能。显然,这使调试变得很烦人。这是我运行测试的npm脚本
"test:ng1": "karma start ./src/karma.ng1.conf.js",
下面是我运行的配置示例,其中删除了所有coverage插件,以防止将coverage代码应用于我的打字稿:
module.exports = function(config) {
var reporters = ['mocha', 'kjhtml'];
// Only implement coverage if the coverage argument was set
if(config.coverage){
reporters.push('coverage-istanbul');
console.log('Coverage enabled');
}
else{
console.log('Coverage not enabled');
}
config.set({
// base path, that will be used to resolve files and exclude
basePath: '../',
// testing framework to use (jasmine/mocha/qunit/...)
frameworks: ['jasmine', 'karma-typescript'],
preprocessors: {
'src/app/**/*.ts': ['karma-typescript'],
'src/test/spec/**/*.ts': ['karma-typescript'],
// 'src/app/modules/ng1/**/*.js': ['karma-coverage-istanbul-instrumenter'],
// 'src/app/modules/ng1/**/*.ts': ['karma-typescript', 'karma-coverage-istanbul-instrumenter'],
'**/*.html': ['ng-html2js']
},
mime: {
'text/x-typescript': ['ts','tsx']
},
// list of files / patterns to load in the browser
files: [
'node_modules/babel-polyfill/browser.js',
'node_modules/jquery/dist/jquery.js',
'node_modules/angular/angular.js',
'node_modules/angular-mocks/angular-mocks.js',
'node_modules/angular-animate/angular-animate.js',
'node_modules/angular-cookies/angular-cookies.js',
'node_modules/angular-resource/angular-resource.js',
'node_modules/angular-sanitize/angular-sanitize.js',
'node_modules/@uirouter/angularjs/release/angular-ui-router.js',
'node_modules/ui-bootstrap4/dist/ui-bootstrap-tpls.js',
'node_modules/lodash/lodash.js',
'node_modules/angular-growl-v2/build/angular-growl.js',
'node_modules/angular-jquery-timepicker/src/timepickerdirective.js',
'node_modules/timepicker/jquery.timepicker.js',
'node_modules/angularjs-scroll-glue/src/scrollglue.js',
'node_modules/angular-translate/dist/angular-translate.js',
'node_modules/moment/moment.js',
'node_modules/ngstorage/ngStorage.js',
'node_modules/jasmine-promise-matchers/dist/jasmine-promise- matchers.js',
'node_modules/angular-ui-grid/ui-grid.js',
'src/app/*.ts',
'src/app/modules/**/*.js',
'src/app/modules/**/*.ts',
'src/app/partials/**/*.html',
'src/test/spec/ipsmicaTestFixtures.js',
'src/test/spec/**/*.spec.js',
'src/test/spec/**/*.spec.ts'
],
// list of files / patterns to exclude
exclude: [
'src/app/modules/ngX/**/*.spec.ts'
],
ngHtml2JsPreprocessor: {
cacheIdFromPath: function(filepath) {
return filepath.replace('src/app/partials/', '');
},
moduleName: 'ipsmica.templates'
},
// web server port defaults to 9876
browsers: [
'ChromeHeadless'
],
browserNoActivityTimeout: 60000,
// Code coverage report
reporters: reporters,
mochaReporter: {
ignoreSkipped: true
},
// coverageIstanbulReporter: {
// reports: ['text-summary', 'html'],
// fixWebpackSourcePaths: true,
// dir: 'target/coverage/ng1',
// subdir: '.'
// },
// Which plugins to enable
plugins: [
'karma-chrome-launcher',
'karma-jasmine',
// 'karma-coverage-istanbul-reporter',
'karma-jasmine-html-reporter',
// 'karma-coverage-istanbul-instrumenter',
'karma-mocha-reporter',
'karma-ng-html2js-preprocessor',
'karma-typescript'
],
tsconfig: 'tsconfig.spec.json',
colors: true,
// level of logging
// possible values: LOG_DISABLE || LOG_ERROR || LOG_WARN || LOG_INFO || LOG_DEBUG
logLevel: config.LOG_INFO
});
};
使用此配置,在调试时,打字稿代码仍嵌入了覆盖率代码。如何禁用此功能?
对于遇到此问题的任何人,问题在于业力打字稿自动启用代码覆盖,因此我只需要添加一项设置以禁用它并启用源地图即可
在我的业力配置中
karmaTypescriptConfig = {
bundleOptions:{
sourceMap: true
},
coverageOptions:{
instrumentation : false
}
};