Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

How to Run Karma Tests in a Docker Container

DZone's Guide to

How to Run Karma Tests in a Docker Container

How do you launch a browser in a Docker container that has no graphic acceleration? PhantomJS can be a viable solution to this problem.

· DevOps Zone ·
Free Resource

DevOps involves integrating development, testing, deployment and release cycles into a collaborative process. Learn more about the 4 steps to an effective DevSecOps infrastructure.

Last week, I started developing a CI platform for my company using Karma and Jasmine as testing frameworks.

Our software solutions are built in different Docker containers and Karma runs tests in a browser. How do you launch a browser in a Docker container that has no graphic acceleration?

Here's the answer.

If your JavaScript code does not contain any ES5 or ES6 features, you can use PhantomJS as a testing browser.

PhantomJS runs as a background task with no graphical interface.

// karma.conf.js
module.exports = function(config) {
  config.set({
    browsers: ['PhantomJS', 'PhantomJS_custom'],

    // you can define custom flags
    customLaunchers: {
      'PhantomJS_custom': {
        base: 'PhantomJS',
        options: {
          windowName: 'my-window',
          settings: {
            webSecurityEnabled: false
          },
        },
        flags: ['--load-images=true'],
        debug: true
      }
    },

    phantomjsLauncher: {
      // Have phantomjs exit if a ResourceError is encountered (useful if karma exits without killing phantom)
      exitOnResourceError: true
    }
  })
}

If you are using ES5 or ES6 (which is very likely), then you should use a real browser like Chrome or Firefox. These browsers need graphical acceleration, which is not available in a Docker container.

The trick is to launch the X virtual frame buffer (Xvfb), which emulates an X11 display so that the browser can execute its GUI code

Here's an example in a Centos Docker container:

yum -y install Xvfb libXfont Xorg chromium #install X* packages and chromium
/usr/bin/Xvfb :99 & #run Xvfb in background
export DISPLAY=:99.0 #export the display environment var

Your Karma config file should look like this:

module.exports = function(config) {
  config.set({
    browsers: ['Chrome'],
    customLaunchers: {
      Chrome_without_sandbox: {
        base: 'Chrome',
        flags: ['--no-sandbox'] // with sandbox it fails under Docker
      }
    },
    ...
  });
};

Read the 4-part DevOps testing eBook to learn how to detect problems earlier in your DevOps testing processes.

Topics:
tutorial ,devops ,docker ,karma ,software testing ,containers

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}