Reputation: 42069
This project with an accompanyingblog post demonstrates how to use Karma with React.js but when you run npm run test
Karma opens the browser very quickly and shuts it down almost as quickly, not allowing you to debug the application (which its supposed to do). I changed the config to singleRun: false
, thinking it might be singleRun
that's shutting the application down.
I also added autoWatch: true
hoping it would keep the test results visible but that didn't work either.
Question: how to get karma to keep the browser open long enough to view the test results and debug the application?
This is the karma.config.js file
var webpack = require('webpack');
module.exports = function (config) {
config.set({
// browsers: [ process.env.CONTINUOUS_INTEGRATION ? 'Firefox' : 'Chrome' ],
browsers: [ 'Chrome' ],
singleRun: true,
// autoWatch: true,
frameworks: [ 'mocha' ],
files: [
'tests.webpack.js'
],
preprocessors: {
'tests.webpack.js': [ 'webpack', 'sourcemap' ]
},
reporters: [ 'dots' ],
webpack: {
devtool: 'inline-source-map',
module: {
loaders: [
{ test: /\.js$/, loader: 'babel-loader' }
]
}
},
webpackServer: {
noInfo: true
}
});
};
Upvotes: 10
Views: 9461
Reputation: 12390
The singleRun:false
option auto-recovers closed browser windows. You will need to execute karma stop
or kill the process. That was very annoying for me.
The watch mode of Karma was also annoying for me since I have > 2500 tests that take a long time to execute. I don't want to trigger that on every file change.
Using Gulp in combination with the Karma API provides more flexibility.
Following example can be used for testing a single file and keeping the browser open until it is manually closed. It applies the browsers_change event of Karma to stop the server.
Related infos:
var gulp = require('gulp');
var karma = require('karma');
var KarmaServerConstructor = karma.Server;
var karmaStopper = karma.stopper;
var commandLineArguments = require('yargs').argv;
//Executes only one test which has to be passed as command line argument --filePath
//The option --browser also has to be passed as command line argument.
//Example usage: gulp single --browser="Chrome_With_Saved_DevTools_Settings" --filePath="C:\myTest.spec.js"
gulp.task('single', function (done) {
var filePath = commandLineArguments.filePath.replace(/\\/g, "/");
var karmaOptions = {
configFile: __dirname + '/karma.conf.js',
action: 'start',
browsers: [commandLineArguments.browser],
files: [
'./Leen.Managementsystem/bower_components/jquery/dist/jquery.js',
'./Leen.Managementsystem/bower_components/globalize/lib/globalize.js',
{ pattern: './Leen.Managementsystem/bower_components/**/*.js', included: false },
{ pattern: './Leen.Managementsystem.Tests/App/test/mockFactory.js', included: false },
{ pattern: './Leen.Managementsystem/App/**/*.js', included: false },
{ pattern: './Leen.Managementsystem.Tests/App/test/*.js', included: false },
{ pattern: filePath, included: false },
'./Leen.Managementsystem.Tests/App/test-main.js',
'./switchKarmaToDebugTab.js' //also see https://stackoverflow.com/questions/33023535/open-karma-debug-html-page-on-startup
]
};
var karmaServer = new KarmaServerConstructor(karmaOptions, done);
karmaServer.on('browsers_change', stopServerIfAllBrowsersAreClosed);
karmaServer.start();
});
function stopServerIfAllBrowsersAreClosed(browsers) {
if (browsers.length === 0) {
//double check since browser might only be closed temporarily due to connection issues
setTimeout(function () {
if (browsers.length === 0) {
karmaStopper.stop();
}
}, 2000);
}
}
Upvotes: 4
Reputation: 6094
Referencing to the official docs the default name of the Karma configuration file is karma.conf.js
, make sure that yours is named correctly.
Regarding to the leaving the browser window opened, I've encountered with a similar issue and my solution was running the Karma directly with --auto-watch
flag. Try $ karma start --auto-watch
instead of $ npm run test
(make sure that you've installed karma-cli
globally via $ npm install -g karma-cli
).
You also should checkout the scripts:
configuration section in your package.json
file. Some forcing options might be specified there.
Upvotes: 8