Develop Reference

Karma Tesing on Virtual Machine

I am trying to run karma tests as part of an automated TFS build. The build opens a browser window and fails to run headless on the build server. What is the best browser configuration for this scenario?
Thanks!
the package.json script is
"headlessTest":"karma start --browsers ChromeHeadless karma.conf.js"
// Karma configuration file, see link for more information
// https://karma-runner.github.io/0.13/config/configuration-file.html
module.exports = function (config) {
config.set({
basePath: '',
frameworks: ['jasmine', '#angular/cli'],
plugins: [
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-jasmine-html-reporter'),
require('karma-coverage-istanbul-reporter'),
require('#angular/cli/plugins/karma'),
require('karma-phantomjs-launcher')
],
client:{
clearContext: false // leave Jasmine Spec Runner output visible in browser
},
coverageIstanbulReporter: {
reports: [ 'html', 'lcovonly' ],
fixWebpackSourcePaths: true
},
angularCli: {
environment: 'dev'
},
reporters: ['progress', 'kjhtml'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: false
});
};
output in console window in TFS build
[33m01 08 2017 10:03:00.043:WARN [launcher]: [39mChromeHeadless have not captured in 60000 ms, killing.
[33m01 08 2017 10:03:02.087:WARN [launcher]: [39mChromeHeadless was not killed in 2000 ms, sending SIGKILL.
[33m01 08 2017 10:03:04.208:WARN [launcher]: [39mChromeHeadless was not``killed by SIGKILL in 2000 ms, continuing.

You can try lunching the chrome with "nosandbox".
Use following configuration in your karma project.conf.js:
browsers: ['ChromeNoSandbox'],
customLaunchers: {
ChromeNoSandbox: {
base: 'Chrome',
flags: ['--no-sandbox']
}
}
Reference this Github issue: https://github.com/karma-runner/karma-chrome-launcher/issues/73#issuecomment-236597429
UPDATE:
There is an issue for Karma : github.com/karma-runner/karma/issues/2652 , whatever you can try different versions combination for Karma and Chrome, someone mentioned that downgrading to karma 1.5 worked.
You can also try to increase the Timeout value, eg 600000, then try it again.

Karma returns error and executes 0 out of 0, even though I have one test using Jasime

This is my karma/karma.conf.js:
// Karma configuration
// Generated on Mon Jan 04 2016 16:17:18 GMT-0500 (EST)
module.exports = function(config) {
config.set({
// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: '',
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
frameworks: ['jasmine'],
// list of files / patterns to load in the browser
files: [
],
// list of files to exclude
exclude: [
],
// preprocess matching files before serving them to the browser
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
preprocessors: {
},
// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ['progress'],
// web server port
port: 9876,
// enable / disable colors in the output (reporters and 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 and executing tests whenever any 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 the tests and exits
singleRun: true,
// Concurrency level
// how many browser should be started simultaneous
concurrency: Infinity
})
}
and this is my karma/tests/test_post.js:
describe('Controller: MainCtrl', function() {
beforeEach(module('PostPageApp'));
var ctrl;
beforeEach(inject(function($controller) {
ctrl = $controller('MainCtrl');
}));
it('Show have an add and logout function', function() {
expect(ctrl.add).toBeDefined();
});
});
and this is ../post.js:
angular.module("PostPageApp", ["BaseApp"])
.controller("MainCtrl", ["$http", "$window", "BaseService", function($http, $window, BaseService) {
var self = this;
self.add = function() {
BaseService.add.post(self.post, function() {
self.cerrorMessages = BaseService.cerrorMessages;
});
};
self.logoutUser = function() {
BaseService.logout();
};
}]);
Now, when I do karma start, it returns this:
04 01 2016 16:48:10.137:INFO [karma]: Karma v0.13.17 server started at http://localhost:9876/
04 01 2016 16:48:10.144:INFO [launcher]: Starting browser Chrome
04 01 2016 16:48:13.138:INFO [Chromium 47.0.2526 (Ubuntu 0.0.0)]: Connected on socket ayhU7qR23sshUzi3AAAA with id 50222765
Chromium 47.0.2526 (Ubuntu 0.0.0): Executed 0 of 0 ERROR (0.013 secs / 0 secs)
Any idea why it is executing 0 out of 0 and returning an error? I thought it would run
it('Show have an add and logout function', function() {
expect(ctrl.add).toBeDefined();
});
Please note that I am new to using Karma and Jasmine so I am still trying to get the hang of all of this.
Thanks in advance.

It's not running any tests because you aren't telling it to load any files into the browser. I think a lot of people use RequireJS for this, but unfortunately I am not familiar with it.
In karma.conf.js under the files: section:
List your JS dependencies (like JQuery or Angular).
List the files that you are testing next.
List the test specs themselves last.
For instance:
files: [
'angular.js',
'app.js',
'app.spec.js'
]
If you don't want certain files to be included then put them in the exclude section. Make sure the file paths are relative to where karma.conf.js is located.

I would suggest specifying a default path and a pattern at ./karma.conf.js:
// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: 'test/',
// list of files / patterns to load in the browser
files: [
{pattern: '**/*.js*', included: true}
],
It worked for me.

Karma not pausing in debugger mode

I am trying to run my application in Chrome using Karma. I configured karma.conf.js in such a way where I would expect the browser to run through all tests and then not exit: I have set this up with other projects and that is what occurs. However, on this project the browser always exits as soon as tests are finished and this prevents me from debugging.
Karma.config.js
module.exports = function(config) {
config.set({
// base path, that will be used to resolve files and exclude
basePath: '.',
// frameworks to use
frameworks: ['jasmine'],
// list of files / patterns to load in the browser
files: [ 'dist/appTest.js', 'dist/app.css' ],
// list of files to exclude
exclude: [
],
// test results reporter to use
// possible values: 'dots', 'progress', 'junit', 'growl', 'coverage'
reporters: ['mocha', 'junit'],
junitReporter: {
outputDir: '', // results will be saved as $outputDir/$browserName.xml
outputFile: undefined, // if included, results will be saved as $outputDir/$browserName/$outputFile
suite: '' // suite will become the package name attribute in xml testsuite element
},
// web server port
port: 9876,
// enable / disable colors in the output (reporters and 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 and executing tests whenever any file changes
autoWatch: false,
// Start these browsers, currently available:
// - Chrome
// - ChromeCanary
// - Firefox
// - Opera (has to be installed with `npm install karma-opera-launcher`)
// - Safari (only Mac; has to be installed with `npm install karma-safari-launcher`)
// - PhantomJS
// - IE (only Windows; has to be installed with `npm install karma-ie-launcher`)
browsers: ['Chrome'],
// If browser does not capture in given timeout [ms], kill it
captureTimeout: 60000,
// Continuous Integration mode
// if true, it capture browsers, run tests and exit
singleRun: false
});
};

Karma fails when using PhantomJS but not Chrome

I have a series of tests that are pass when I use the Karma Chrome Launcher but fail when I use the Karma PhantomJS launcher.
Here is my what's inside my karma.config.js file
```
frameworks: ['browserify','mocha','chai', 'sinon'],
files: require('./include.conf.js').concat([
'test/helper/*.js',
'test/example/*.spec.js',
'test/unit/*.spec.js',
'test/integration/*.spec.js'
]),
// list of files to exclude
exclude: [
'gulpfile.js',
'index.js',
'karma.conf.js'
],
browserify: {
debug: true,
transform: ['reactify'],
bundleDelay: 1000
},
preprocessors: {
'test/helper/*.js': ['browserify'],
'test/example/*.spec.js': ['browserify'],
'test/unit/*.spec.js': ['browserify'],
'test/integration/*.spec.js': ['browserify'],
'dev/js/**/*.js': ['browserify']
},
// web server port
port: 9876,
autoWatch: true,
browsers: ['PhantomJS'],
// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: true,
plugins: [
'karma-coverage',
'karma-mocha',
'karma-browserify',
'karma-chai',
'karma-sinon',
'karma-phantomjs-launcher'
]```
All of the files are being preprocessed and running properly with the Karma Chrome Launcher, but when I try to run them with PhantomJS, I get a bunch of errors like this :
PhantomJS 1.9.8 (Mac OS X 0.0.0) ERROR
ReferenceError: Can't find variable: require
at /Users/edwinlin/Documents/repos/Picarus/dev/js/utils/database-utils.js:1
Thanks for anyone's help!

How to get better test reports in the console?

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.

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']

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"]

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' ],

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'),
...
]

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.