Launcher does not work with Firefox 61

[steve-todorov]

It seems like something has changed in Firefox 61 which has resulted in karma-firefox-launcher to be unable to properly start firefox. The following configuration works fine for firefox 60.

karma.conf
....
        browsers: ['FirefoxHeadless'],
        customLaunchers: {
            FirefoxHeadless: {
                base: 'Firefox',
                flags: [
                    '-headless'
                ],
            },
        },
....

> ng test --browsers FirefoxHeadless

 10% building modules 1/1 modules 0 active(node:70) DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
19 07 2018 16:28:03.691:INFO [karma]: Karma v1.7.1 server started at http://0.0.0.0:9876/
19 07 2018 16:28:03.693:INFO [launcher]: Launching browser FirefoxHeadless with unlimited concurrency
19 07 2018 16:28:03.698:INFO [launcher]: Starting browser Firefox
 20% building modules 91/105 modules 14 active …s/form-plugin/fesm5/ngxs-form-plugin.js19 07 2018 16:28:05.106:ERROR [launcher]: Cannot start Firefox	*** You are running in headless mode.

19 07 2018 16:28:05.107:ERROR [launcher]: Firefox stdout: 
19 07 2018 16:28:05.107:ERROR [launcher]: Firefox stderr: *** You are running in headless mode.

 24% building modules 120/147 modules 27 active …modules/core-js/modules/_string-trim.js19 07 2018 16:28:05.483:INFO [launcher]: Trying to start Firefox again (1/2).
 54% building modules 370/398 modules 28 active …nal/observable/ConnectableObservable.js19 07 2018 16:28:06.468:ERROR [launcher]: Cannot start Firefox
	*** You are running in headless mode.

19 07 2018 16:28:06.468:ERROR [launcher]: Firefox stdout: 
19 07 2018 16:28:06.469:ERROR [launcher]: Firefox stderr: *** You are running in headless mode.

 59% building modules 415/435 modules 20 active …modules/core-js/modules/es6.array.of.js19 07 2018 16:28:06.570:INFO [launcher]: Trying to start Firefox again (2/2).
 95% emitting CopyPlugin19 07 2018 16:28:12.559:ERROR [launcher]: Cannot start Firefox    
	*** You are running in headless mode.

19 07 2018 16:28:12.559:ERROR [launcher]: Firefox stdout: 
19 07 2018 16:28:12.559:ERROR [launcher]: Firefox stderr: *** You are running in headless mode.

19 07 2018 16:28:12.681:ERROR [launcher]: Firefox failed 2 times (cannot start). Giving up.

[timbru31]

Have you found a solution @steve-todorov? Having the same issue :(

[steve-todorov]

Unfortunately no - this also started happening with the newest Chrome version as well. Seems like they've changed something under the hood which is breaking Karma somehow. It might not be related to karma-(firefox || chrome)-launcher itself.

Our solution was to create a docker image with fixed Firefox version 60.0.1.

[timbru31]

Chromium v68 is working fine for us. We've pinned Firefox for now, too.

[timbru31]

Update using the Firefox on my macOS works fine, while the alpine version is broken for us (https://pkgs.alpinelinux.org/package/edge/testing/x86_64/firefox)

[timbru31]

I was able to fix the issue in our Dockerfile with Alpine. It seems the ttf-freefont package needs to be installed, otherwise Firefox will exit with a segfault.
You might want to give https://hub.docker.com/r/timbru31/node-alpine-firefox/ a try.

[steve-todorov]

Thanks for posting an update! We were having so much issues with the alpine image and the different browsers, that we gave up on using it for running node/npm related tests with karma/protractor. We now use ubuntu which has been working fine ever since. :/ I will try adding ttf-freefont to our old alpine image at some point to see if it solves it.

[ghost]

I am having a similar issue with Firefox 62. Karma starts, but as soon as it triggers Firefox in headless, it just hangs. I can see Firefox in the OSX Dock, but it doesn't open, and no active application indicator is displayed either.

Here is my karma.conf.js file;

process.env.NODE_ENV = 'development';

const path = require('path');
const fs = require('fs');
const puppeteer = require('puppeteer');
const webpackCommonConfig = require('./webpack.common.js');
const webpackDevConfig = require('./webpack.dev.js');

process.env.CHROME_BIN = require('puppeteer').executablePath();

module.exports = function (config) {
	const karmaConfig = {
		protocol: 'https:',

		// this object would feed https.createServer
		httpsServerOptions: {
			key: fs.readFileSync('server.key'),
			cert: fs.readFileSync('server.crt')
		},

		// base path that will be used to resolve all patterns (eg. files, exclude)
		//basePath: '',

		// Plugins needed for config
		plugins: [
			'karma-chrome-launcher',
			'karma-firefox-launcher',
			'karma-eslint',
			'karma-jasmine',
			'karma-jasmine-ajax',
			'karma-jasmine-html-reporter',
			'karma-webpack',
			'karma-spec-reporter',
		],

		// frameworks to use
		// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
		frameworks: ['jasmine-ajax', 'jasmine'],

		// list of files / patterns to load in the browser
		files: [
			'node_modules/jquery/dist/jquery.js',
			'node_modules/jquery-migrate/dist/jquery-migrate.min.js',
			{
				pattern: 'responsive/common/test/**/*Test.js',
				watched: false,
			},
			{
				pattern: 'responsive/common/test/global/recommendations/p13n_generated.js',
				watched: false,
			},
			{
				pattern: 'responsive/common/test/**/dummy-*.js',
				watched: false,
				included: false,
				served: true,
			},
			{
				pattern: 'responsive/common/js/**/*.js',
				included: false,
				watched: false,
			},
			{
				pattern: 'responsive/common/test/Scratchpad.js',
				included: false,
				watched: false,
			},
		],

		// list of files to exclude
		exclude: [
			'responsive/common/js/global/polyfill/**/*.js',
		],

		// preprocess matching files before serving them to the browser
		// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
		preprocessors: {
			'responsive/common/js/**/*.js': ['webpack'],
			'responsive/common/test/**/*.js': ['webpack'],
		},

		webpack: setupWebpackConfig(),
		webpackMiddleware: {
			stats: 'errors-only',
			logLevel: 'warn',
		},

		beforeMiddleware: [
			'webpackBlocker',
		],

		// test results reporter to use
		// possible values: 'dots', 'progress'
		// available reporters: https://npmjs.org/browse/keyword/karma-reporter
		reporters: ['spec', 'kjhtml'],

		specReporter: {
			maxLogLines: 50, // limit number of lines logged per test
			suppressErrorSummary: false, // do not print error summary
			suppressFailed: false, // do not print information about failed tests
			suppressPassed: false, // do not print information about passed tests
			suppressSkipped: false, // do not print information about skipped tests
			showSpecTiming: true, // print the time elapsed for each spec
			failFast: false, // test would finish with error when a first fail occurs.
		},

		// web server port
		port: 9876,

		// timeout in ms
		captureTimeout: 0,

		// enable / disable colors in the output (reporters and logs)
		colors: true,

		// level of logging
		// possible values: LOG_DISABLE || LOG_ERROR || LOG_WARN || LOG_INFO || LOG_DEBUG
		logLevel: config.LOG_INFO,

		// enable / disable watching file and executing tests whenever any file changes
		autoWatch: false,

		// start these browsers
		// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
		browsers: ['ChromeHeadless', 'Firefox', 'FirefoxDeveloper', 'FirefoxNightly'],

		customLaunchers: {
			ChromeHeadless: {
				base: 'Chrome',
				chromeDataDir: path.resolve(__dirname, './.chromeKarma'),
				flags: ['--disable-web-security', '--allow-insecure-localhost', '--remote-debugging-port=9222'],
			},
			FirefoxHeadless: {
				base: 'Firefox',
				flags: ['-headless'],
				profile: path.resolve(__dirname, './.firefoxKarma'),
			},
		},

		// Continuous Integration mode
		// if true, Karma captures browsers, runs the tests and exits
		singleRun: false,

		// Concurrency level
		// how many browser should be started simultaneous
		concurrency: Infinity,

		// Report tests that are slower than given time limit (ms)
		reportSlowerThan: 0, // e.g. 300

		client: {
			captureConsole: false, // Capture all console output and pipe it to the terminal
			jasmine: {
				random: false,
			},
		},
	};

	if (!config.skipCoverage) {
		addCodeCoverage(karmaConfig);
	}
	config.set(karmaConfig);
};

function setupWebpackConfig() {
	const config = webpackDevConfig;
	config.plugins = webpackCommonConfig.plugins;
	config.module.rules = config.module.rules.filter(rule => rule.loader !== 'eslint-loader');

return config;
}

function addCodeCoverage(karmaConfig) {
	karmaConfig.plugins.push('karma-coverage-istanbul-reporter');
	karmaConfig.reporters.push('coverage-istanbul');
	karmaConfig.coverageIstanbulReporter = {
		reports: ['html', 'lcovonly', 'text-summary'],
		fixWebpackSourcePaths: true,
	};

	karmaConfig.webpack.module.rules = karmaConfig.webpack.module.rules.concat({
		enforce: 'pre',
		test: /\.js$/,
		use: {
			loader: 'istanbul-instrumenter-loader',
			options: { esModules: true },
		},
		include: path.resolve('responsive/common/js/'),
		exclude: ['/node_modules/', /rr_p13n\.js/, /p13n_unoptimized\.js/],
	});
}

[drzraf]

Is there some documentation about running a docker-image of Firefox (like alpine-based or https://hub.docker.com/r/jlesage/firefox) while using the native host (node/npm & toolchain)?
I guess some docker run -d *** would be needed in karma config but I couldn't find some documentation about this so far.