45

I have a fairly simple karma.config.js file

basePath = '../';


files = [
  JASMINE,
  JASMINE_ADAPTER,
  'js/lib/angular*.js',
  'test/lib/angular/angular-mocks.js',
  'js/**/*.js',
  'test/unit/**/*.js'
];

autoWatch = true;
browsers = ['PhantomJS'];


When I run karma start config/karma.conf.js --single-run I'm getting the following output

$ karma start config/karma.conf.js --single-run
[2013-06-24 23:47:08.750] [DEBUG] config - autoWatch set to false, because of singleRun
INFO [karma]: Karma server started at http://localhost:9876/
INFO [launcher]: Starting browser PhantomJS
INFO [PhantomJS 1.9 (Mac)]: Connected on socket id LwMoWxzIbSUuBsvIqB_m
PhantomJS 1.9 (Mac): Executed 6 of 6 SUCCESS (0.073 secs / 0.02 secs)

I've been searching for something to tell me how to get the output of the tests that get logged (e.g. SUCCESS Unit: services myService should behave)

The only way I can see the output of the tests is to open Chrome and click 'Debug', then show the developer tools console. I want the messages to be logged out to the terminal, but I cannot figure out how to get this working.

Flip
  • 6,233
  • 7
  • 46
  • 75
blockloop
  • 5,565
  • 5
  • 30
  • 31
  • 2
    Terrible tittle for this question – ErichBSchulz May 28 '14 at 09:14
  • 3
    Yeah. If I remember correctly I rage-typed that title after trying to figure it out for way too long. It's a good thing Google searches more than titles. – blockloop May 28 '14 at 15:23
  • @brettof86 Someone has mangled the title of this question. It obviously has nothing to do with HTML when reading the question itself. I was going to try to replace the title, but after thinking a bit, I don't think I understand the question enough to do that. (What's unclear to me is if you're looking for a simple report mechanism or if you want to capture some form of output from within the test itself.) Could you revise it? – jpmc26 Mar 24 '15 at 18:42
  • You're right, it had nothing to do with HTML. I was looking for a console reporter and for karma-spec-reporter specifically. I edited the title again and removed "HTML." – blockloop Mar 25 '15 at 02:36

5 Answers5

85

Fixed by installing the karma-spec-reporter

npm install karma-spec-reporter --save-dev

and adding this my karma.config.js

reporters: ['spec'],

According to karma documentation

By default, Karma loads all NPM modules that are siblings to it and their name matches karma-*.

but some users have had to add the following to their config

plugins: ['karma-spec-reporter']

blockloop
  • 5,565
  • 5
  • 30
  • 31
  • 7
    It didn't work for me until I specified in the karma.conf.js file karma-spec-reporter as a plugin; this is how my plugins array looks plugins: [ 'karma-chrome-launcher', 'karma-coverage', 'karma-firefox-launcher', 'karma-jasmine', 'karma-junit-reporter', 'karma-spec-reporter' ], note karma-spec-reporter at the end – danivicario Oct 19 '14 at 12:04
  • Yes you have to tell the config that you're using this plugin. – blockloop Oct 20 '14 at 15:17
  • 1
    If all of your plugins start with `karma-` then you don't have to reference any of them. The default behaviour is to load all `karma-*` plugins. http://karma-runner.github.io/0.12/config/plugins.html – blues_driven Feb 18 '15 at 09:46
  • Works as @blues_driven and brettof86 described it. – Stephan Kristyn Apr 07 '15 at 14:33
  • Same here.. had to add the plugin.. I went ahead and proposed an edit to this answer. – RavenHursT Aug 06 '15 at 04:12
12

Just another detail - if you keep the default reporter 'progress' in the karma.config.js, like below:

reporters: ["progress", "spec"]

or another console reporter, the "spec" reporter output won't work.

You should keep only the "spec" one, or the "spec" with other browser reporters. For example:

reporters: ["spec", "coverage"]
Fernando Ghisi
  • 419
  • 4
  • 8
3

I wrote a reporter to make the output more readable: karma-helpful-reporter

Has some nice customization options: https://github.com/whyboris/karma-helpful-reporter

Instal instructions inside, basically npm install --save-dev karma-helpful-reporter and then add to the Karma configuration plugins section:

plugins: [ 
  require('karma-helpful-reporter')
],
reporters: [ 'helpful' ],
Boris Yakubchik
  • 3,861
  • 3
  • 34
  • 41
2

You can also use the Karma-mocha-reporter as reporter and you should have a clean report in your console. 

npm i karma-mocha-reporter --save-dev

// karma.conf.js
module.exports = function(config) {
  config.set({
    frameworks: ['jasmine'],

    // reporters configuration
    reporters: ['mocha']
  });
};

Sometimes, e.g in @angular/cli environment you should require this like: 

plugins: [
   ...
   require('karma-mocha-reporter'),
   ...
]
billyjov
  • 2,778
  • 19
  • 35
1

Here is my working (draft) configuration without the section 'plugins' (actually I don't fully understand why I should need to specify them ...):

package.json 

  "devDependencies": {
    [...]
    "grunt-karma": "~0.9.0",
    "karma": "~0.12.24",
    "karma-jasmine": "~0.2.3",
    "karma-chrome-launcher": "~0.1.5",
    "karma-phantomjs-launcher": "~0.1.4",
    "karma-spec-reporter": "0.0.13"
  }

karma.conf.js

module.exports = function (config) {
    config.set({
        frameworks: ['jasmine'],
        reporters: ['spec'],
        browsers: ['PhantomJS']
    });
};

Gruntfile.js

    karma: {
        options: {
            configFile: 'karma.conf.js',
            files: [
                'app/libs/angular.js',
                'app/libs/angular-resource.js',
                'app/libs/angular-route.js',
                [...] 
                'app/modules/**/*-spec.js'
            ]
        },
        unit: {
            singleRun: true
        }
    }

Now when I run grunt karma messages from the *-spec.js files (describe('message', function() ...)) are displayed nicely in the console.

gvlax
  • 740
  • 4
  • 17