Browsers

Capturing browsers on your own can be a tedious and time-consuming task. However, Karma can automate this for you. Simply add the browsers you would like to capture into the configuration file.

browsers: ['Chrome']

Then, Karma will take care of auto-capturing these browsers, as well as killing them after the job is over.

Available browser launchers #

• Chrome and Chrome Canary
• Firefox
• Safari
• PhantomJS
• JSDOM
• Opera
• Internet Explorer
• SauceLabs
• BrowserStack
• many more

Here's an example of how to add Firefox to your testing suite:

# Install the launcher first with NPM:
$ npm install karma-firefox-launcher --save-dev

And then, inside your configuration file, add the browser name in browsers array.

module.exports = function(config) {
  config.set({
    browsers : ['Chrome', 'Firefox']
  });
};

Also, keep in mind that the browsers configuration setting is empty by default.

Of course, you can write custom plugins too!

Capturing any browser manually #

You can also capture browsers by simply opening http://<hostname>:<port>/, where <hostname> is the IP address or hostname of the machine where the Karma server is running and <port> is the port where the Karma server is listening (by default it's 9876). With the default settings in place, just point your browser to http://localhost:9876/.

This allows you to capture a browser on any device, such as a tablet or a phone, that is on the same network as the machine running Karma (or using a local tunnel).

Configured launchers #

Some of the launchers can also be configured:

sauceLabs: {
  username: 'michael_jackson'
}

Or defined as a configured launcher:

customLaunchers: {
  chrome_without_security: {
    base: 'Chrome',
    flags: ['--disable-web-security']
  },
  sauce_chrome_win: {
    base: 'SauceLabs',
    browserName: 'chrome',
    platform: 'windows'
  }
}

A display name can be set for any custom launcher. If set, this name will be used for reporting instead of the user agent. Here is a code snippet example explaining how to set a display name for a custom launcher.

customLaunchers: {
  chrome_without_security: {
    base: 'Chrome',
    flags: ['--disable-web-security'],
    displayName: 'Chrome w/o security'
  }
}

If the definition is as above, the browser will be displayed as Chrome w/o security in logs and reports.

Correct path to browser binary #

Each plugin has some default paths where to find the browser binary on particular OS. You can override these settings by <BROWSER>_BIN ENV variable, or alternatively by creating a symlink.

POSIX shells #

# Changing the path to the Chrome binary
$ export CHROME_BIN=/usr/local/bin/my-chrome-build

# Changing the path to the Chrome Canary binary
$ export CHROME_CANARY_BIN=/usr/local/bin/my-chrome-build

# Changing the path to the PhantomJs binary
$ export PHANTOMJS_BIN=$HOME/local/bin/phantomjs

Windows cmd.exe #

C:> SET IE_BIN=C:\Program Files\Internet Explorer\iexplore.exe

Windows Powershell #

$Env:FIREFOX_BIN = 'c:\Program Files (x86)\Mozilla Firefox 4.0 Beta 6\firefox.exe'

Custom browsers #

// in the karma.conf.js
browsers: ['/usr/local/bin/custom-browser.sh'],

// from cli
karma start --browsers /usr/local/bin/custom-browser.sh

The browser scripts need to take one argument, which is the URL with the ID-parameter to be used to connect to the server. The supplied ID is used by the server to keep track of which specific browser is captured.