03-browsers.md 4.8 KB

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.

Note: Most of the browser launchers need to be loaded as plugins.

Available browser launchers

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.