Search code examples
angularjsunit-testingcode-coveragekarma-runnerkarma-jasmine

AngularJS + Karma + Jasmine + Karma-Coverage: Empty coverage report


I'm trying to integrate my current AngularJS project with Karma Coverage. Please find below the package.json and my karma-config.

Package.json

{
  "name": "Project",
  "description": "Description",
  "repository": "https://www.repo.com",
  "devDependencies": {
    "karma": "~0.10.9",
    "karma-junit-reporter": "~0.2.1",
    "karma-jasmine": "~0.1.5",
    "karma-ng-scenario": "~0.1",
    "karma-script-launcher": "~0.1.0",
    "karma-chrome-launcher": "~0.1.3",
    "karma-firefox-launcher": "~0.1.3",
    "karma-phantomjs-launcher": "~0.1.4",
    "karma-ng-html2js-preprocessor": "~0.1",
    "karma-coverage": "~0.1"
  }
}

Karma config

'use strict';

module.exports = function (config) {
  config.set({
    basePath: '../../public/',
    logLevel: config.LOG_DEBUG,
    frameworks: ['jasmine'],
    singleRun: true,
    files: [
        'libs/jquery/jquery-1.9.0.js',
        'libs/angular/1.2.10/angular.js',
        'libs/angular/**/*.js',
        'libs/angular/*.js',
        'libs/vendor/*.js',
        'libs/test/**/*.js',

        // fixtures
        {pattern: 'test/mock-data/helloworld/*.json', watched: true, served: true, included: false},

        'apps/helloworld/**/*.js',
        'apps/helloworld/*.js',
        'test/helloworld/unit/**/*.js',
        'test/helloworld/*.js',
        'views/helloworld/directives/*.html'
    ],

    exclude: [
        'libs/angular/1.2.10/*.min.js',
        'libs/angular/angular-animate.js'
    ],

    browsers: ['PhantomJS'],

    reporters: ['progress', 'junit', 'coverage'],

    preprocessor: {
        'apps/helloworld/**/*.js': ['coverage'],
        '*.html': ['ng-html2js']
    }
  })
};

When I try to run "node_modules/.bin/karma start conf/advisor/karma.conf.js" all the tests run successfully but the karma-coverage report is completely empty. I've tried a couple of options but I cannot make the reports to appear.

enter image description here

The console output never runs the preprocessor for the coverage. I can see that it actually runs for html2js.

DEBUG [plugin]: Loading karma-* from /Users/alansouza/workspace/helloworld/node_modules
DEBUG [plugin]: Loading plugin /Users/alansouza/workspace/helloworld/node_modules/karma-chrome-launcher.
DEBUG [plugin]: Loading plugin /Users/alansouza/workspace/helloworld/node_modules/karma-coffee-preprocessor.
DEBUG [plugin]: Loading plugin /Users/alansouza/workspace/helloworld/node_modules/karma-    coverage.
DEBUG [plugin]: Loading plugin /Users/alansouza/workspace/helloworld/node_modules/karma-firefox-launcher.
DEBUG [plugin]: Loading plugin /Users/alansouza/workspace/helloworld/node_modules/karma-html2js-preprocessor.
DEBUG [plugin]: Loading plugin /Users/alansouza/workspace/helloworld/node_modules/karma-jasmine.
DEBUG [plugin]: Loading plugin /Users/alansouza/workspace/helloworld/node_modules/karma-junit-reporter.
DEBUG [plugin]: Loading plugin /Users/alansouza/workspace/helloworld/node_modules/karma-ng-html2js-preprocessor.
DEBUG [plugin]: Loading plugin /Users/alansouza/workspace/helloworld/node_modules/karma-ng-scenario.
DEBUG [plugin]: Loading plugin /Users/alansouza/workspace/helloworld/node_modules/karma-phantomjs-launcher.
DEBUG [plugin]: Loading plugin /Users/alansouza/workspace/helloworld/node_modules/karma-requirejs.
DEBUG [plugin]: Loading plugin /Users/alansouza/workspace/helloworld/node_modules/karma-script-launcher.
INFO [karma]: Karma v0.10.10 server started at http://localhost:9876/
INFO [launcher]: Starting browser PhantomJS
DEBUG [launcher]: Creating temp dir at /var/folders/8_/vw105h0j3vn66cgzttktdjmm0000gn/T/karma-29140367
DEBUG [launcher]: /Users/alansouza/workspace/helloworld/node_modules/karma-phantomjs-launcher/node_modules/phantomjs/lib/phantom/bin/phantomjs  /var/folders/8_/vw105h0j3vn66cgzttktdjmm0000gn/T/karma-29140367/capture.js
DEBUG [watcher]: Excluded file  "/Users/alansouza/workspace/helloworld/public/libs/angular/1.2.10/angular-animate.min.js"
DEBUG [watcher]: Excluded file "/Users/alansouza/workspace/helloworld/public/libs/angular/1.2.10/angular-resource.min.js"
DEBUG [watcher]: Excluded file "/Users/alansouza/workspace/helloworld/public/libs/angular/1.2.10/angular-route.min.js"
DEBUG [watcher]: Excluded file "/Users/alansouza/workspace/helloworld/public/libs/angular/1.2.10/angular-sanitize.min.js"
DEBUG [watcher]: Excluded file "/Users/alansouza/workspace/helloworld/public/libs/angular/1.2.10/angular.min.js"
DEBUG [preprocessor.html2js]: Processing "/Users/alansouza/workspace/helloworld/public/views/advisor/directives/av-product-total.html".
DEBUG [preprocessor.html2js]: Processing "/Users/alansouza/workspace/helloworld/public/views/advisor/directives/av-product.html".
DEBUG [preprocessor.html2js]: Processing "/Users/alansouza/workspace/helloworld/public/views/advisor/directives/av-select-product.html".
DEBUG [watcher]: Resolved files:

Question: Am I doing something wrong here? How to make karma coverage to load my src js files?


Solution

  • I was able to fix the problem. It was a missing "s". My karma config was initially preprocessor where is supposed to be preprocessors. Please find below the correct karma config:

    'use strict';
    
      module.exports = function (config) {
      config.set({
        basePath: '../../public/',
        logLevel: config.LOG_DEBUG,
        frameworks: ['jasmine'],
        singleRun: true,
        files: [
            'libs/jquery/jquery-1.9.0.js',
            'libs/angular/1.2.10/angular.js',
            'libs/angular/**/*.js',
            'libs/angular/*.js',
            'libs/vendor/*.js',
            'libs/test/**/*.js',
    
            // fixtures
            {pattern: 'test/mock-data/helloworld/*.json', watched: true, served: true, included: false},
    
            'apps/helloworld/**/*.js',
            'apps/helloworld/*.js',
            'test/helloworld/unit/**/*.js',
            'test/helloworld/*.js',
            'views/helloworld/directives/*.html'
        ],
    
        exclude: [
            'libs/angular/1.2.10/*.min.js',
            'libs/angular/angular-animate.js'
        ],
    
        browsers: ['PhantomJS'],
    
        reporters: ['progress', 'junit', 'coverage'],
    
        preprocessors: {
            'apps/helloworld/**/*.js': ['coverage'],
            '*.html': ['ng-html2js']
        }
        })
      };
    

    The most interesting point here is: it was working before with preprocessor for ng-html2js (my directives testing were passing). When I introduced coverage then the problem started to happen.