i generating coverage using karma-coverage, browserify. tests run fine coverage reports generated not showing correct file contents , shows 100% coverage when in reality there tests few.
my karma.conf.js :
// karma configuration module.exports = function(config) { config.set({ // base path used resolve patterns (eg. files, exclude) basepath: './', // frameworks use // available frameworks: https://npmjs.org/browse/keyword/karma-adapter frameworks: ['browserify', 'mocha', 'chai'], // list of files / patterns load in browser files: [ 'bower_components/jquery/dist/jquery.js', 'bower_components/angular/angular.js', 'bower_components/angular-animate/angular-animate.js', 'bower_components/angular-bootstrap/ui-bootstrap-tpls.js', 'bower_components/angular-cookies/angular-cookies.js', 'bower_components/angular-dragdrop/src/angular-dragdrop.js', 'bower_components/angular-mocks/angular-mocks.js', 'bower_components/angular-route/angular-route.js', 'bower_components/angular-sanitize/angular-sanitize.js', 'bower_components/angular-ui-router/release/angular-ui-router.js', 'bower_components/angular-xeditable/dist/js/xeditable.js', 'bower_components/d3/d3.js', 'bower_components/d3-tip/index.js', 'bower_components/jquery-ui/jquery-ui.js', 'bower_components/moment/moment.js', 'bower_components/ng-file-upload/ng-file-upload.js', 'bower_components/ngstorage/ngstorage.js', 'bower_components/restangular/dist/restangular.js', 'bower_components/toastr/toastr.js', 'bower_components/underscore/underscore.js', 'app/components/**/*.js' ], // list of files exclude exclude: [], // preprocess matching files before serving them browser // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor preprocessors: { 'app/components/**/*.js': ['browserify'], 'app/components/**/!(*.test).js': ['browserify', 'sourcemap', 'coverage'] }, browserify: { debug: true, transform: [ 'babelify' ], extensions: ['.js'] }, babelpreprocessor: { options: { sourcemap: 'inline', blacklist: ['usestrict'] }, sourcefilename: function(file) { return file.originalpath; } }, // optionally, configure reporter coveragereporter: { dir: 'coverage/', reporters: [{ type: 'html', subdir: 'report-html' }, { type: 'cobertura', subdir: '.', file: 'cobertura.txt' }, { type: 'text', subdir: '.', file: 'text.txt' }, { type: 'text-summary', subdir: '.', file: 'text-summary.txt' }, ] }, // test results reporter use // possible values: 'dots', 'progress' // available reporters: https://npmjs.org/browse/keyword/karma-reporter reporters: ['coverage', 'mocha'], // web server port port: 9876, // enable / disable colors in output (reporters , 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 , executing tests whenever file changes autowatch: true, // start these browsers // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher browsers: ['chrome'], // continuous integration mode // if true, karma captures browsers, runs tests , exits singlerun: false }); };
and package.json
{ "name": "touchpoint", "private": true, "version": "0.0.0", "repository": "", "scripts": { "postinstall": "bower install", "prestart": "npm install", "start": "node server.js", "mocha": "istanbul cover _mocha -- ./app/components/**/*test.js --compilers js:babel-core/register", "watch-mocha": "istanbul cover _mocha -- ./app/components/**/*test.js --compilers js:babel-core/register -w", "karma": "karma start", "test": "npm run karma --single-run", "test-suite": "npm run watch-mocha", "pretest": "npm install", "pretest-suite": "npm install" }, "devdependencies": { "angular": "^1.5.0-rc.2", "babel": "^6.5.2", "babel-cli": "6.10.1", "babel-polyfill": "^6.9.1", "babel-preset-es2015": "^6.9.0", "babelify": "^7.3.0", "body-parser": "^1.15.0", "bower": "^1.7.9", "browserify": "^13.0.1", "browserify-istanbul": "^2.0.0", "browserify-ngannotate": "^2.0.0", "bulkify": "^1.4.2", "chai": "^3.5.0", "del": "^2.2.0", "eslint": "^3.4.0", "eslint-config-airbnb": "^9.0.1", "eslint-plugin-import": "^1.8.1", "eslint-plugin-jsx-a11y": "^1.4.2", "eslint-plugin-react": "^5.1.1", "event-stream": "^3.3.2", "express": "^4.13.4", "gulp": "^3.9.1", "gulp-angular-filesort": "^1.1.1", "gulp-babel": "^6.1.2", "gulp-clean-css": "^2.0.10", "gulp-concat": "^2.6.0", "gulp-eslint": "^2.0.0", "gulp-htmlhint": "^0.3.1", "gulp-htmllint": "0.0.8", "gulp-htmlmin": "^1.3.0", "gulp-inject": "^4.1.0", "gulp-inject-reload": "0.0.2", "gulp-install": "^0.6.0", "gulp-jshint": "^2.0.0", "gulp-livereload": "^3.8.1", "gulp-load-plugins": "^1.2.0", "gulp-minify-css": "^1.2.4", "gulp-ng-annotate": "^2.0.0", "gulp-ng-config": "^1.3.1", "gulp-ng-html2js": "^0.2.2", "gulp-nodemon": "^2.0.6", "gulp-notify": "^2.2.0", "gulp-open": "^2.0.0", "gulp-order": "^1.1.1", "gulp-postcss": "^6.1.1", "gulp-print": "^2.0.1", "gulp-rename": "^1.2.2", "gulp-sass": "^2.3.1", "gulp-sourcemaps": "^1.6.0", "gulp-stylelint": "^2.0.2", "gulp-uglify": "^1.5.3", "istanbul": "^0.2.16", "istanbul-coveralls": "^1.0.3", "jquery": "^3.1.0", "jshint-stylish": "^2.1.0", "karma": "^0.13.22", "karma-babel-preprocessor": "^6.0.1", "karma-browserify": "^5.1.0", "karma-chai": "^0.1.0", "karma-chrome-launcher": "^2.0.0", "karma-coverage": "^0.2.6", "karma-coverage-es6": "^0.2.7", "karma-jasmine": "^1.0.2", "karma-jquery": "^0.1.0", "karma-junit-reporter": "^0.3.8", "karma-mocha": "^1.1.1", "karma-mocha-reporter": "^2.1.0", "karma-ng-html2js-preprocessor": "^1.0.0", "karma-requirejs": "^1.0.0", "karma-sinon-chai": "^1.2.3", "karma-sourcemap-loader": "^0.3.7", "main-bower-files": "^2.11.1", "method-override": "^2.3.5", "mocha": "^3.0.2", "postcss-nested": "^1.0.0", "postcss-reporter": "^1.3.3", "postcss-scss": "^0.1.8", "protractor": "^3.1.1", "q": "^1.4.1", "requirejs": "^2.2.0", "shelljs": "^0.6.0", "sinon": "^1.17.5", "stylelint": "^6.7.1", "stylelint-scss": "^1.2.0", "vinyl-source-stream": "^1.1.0", "watchify": "^3.7.0" } }
i use npm run karma run tests.
i using angular1.5 , source files in es6 standard component style. using import/export format.
what in coverage source files in green (100% coverage) , each file in report of form:
typeof require === "function" && require("**************************.js");
i able solve similar problem using browserify-istanbul instrument code browserify transform function, rather using karma-coverage preprocessor.
- add browserify-istanbul dev dependency:
npm install browserify-istanbul --save-dev
add browserify-istanbul browserify transform section of karma.conf.js:
transform: [ 'babelify', ['browserify-istanbul', { instrumenterconfig: { embedsource: true // important html reports } } ] ]
remove
coverage
source preprocessors, it's just:preprocessors: { 'app/components/**/*.js': ['browserify'], 'app/components/**/!(*.test).js': ['browserify', 'sourcemap'] // no more 'coverage' here }
now, when karma runs browserify preprocessor, code instrumented istanbul (because of transform function), , coverage report should correct.
Comments
Post a Comment