NOTE: this post was written for Karma 0.8 which required a manual installation of PhantomJS.
However this blog post is still relevant for installing the NodeJS and NPM pre-requisites.
As of 0.10 both PhantomJS and Chrome will be automatically installed by the launcher plugins. Installation instructions for Karma 0.10 can be found here (a "Local installation" is preferred).
Furthermore instructions on how to install plugins (introduced as of 0.10) can be found here.

Recently I decided to switch from the “Jasmine Maven Plugin” (using the Mozilla Rhino JavaScript “emulator”) to the Karma (previously called Testacular) test runner. The big advantage of Karma opposed to the “Jasmine Maven Plugin” is that it uses actual browsers (like Chrome, Firefox, Safari and even IE) to execute the tests. This blogpost describes the installation and configuration of Karma on Windows. To install Karma you first need to install NodeJS and its NPM (NodeJS Package Manager). Additionally you could install PhantomJS, a “headless” web-kit browser, to run your JavaScript tests from the command-line without spawning unwanted browser windows. Instead of using PhantomJS as a replacement for testing against real browsers you could use it to run tests on your local development machine while your continuous integration server could then run your tests on “all” relevant browsers.

Installation of the Chocolatey package manager’s

To ensure easy installation of NodeJS, NPM and PhantomJS on Windows we will be using the Chocolatey package manager. Chocolatey is a package manager similar to “apt-get” on Ubuntu and “brew” on OSX. Before installation make sure that PowerShell 2.0 is installed. If you are using Windows 7 with SP1 or Windows 8 it’s already installed on your PC. Install Chocolatey by typing the following ‘magic’ stuff on the command-line prompt:

@powershell -NoProfile -ExecutionPolicy unrestricted -Command "iex ((new-object net.webclient).DownloadString('https://chocolatey.org/install.ps1'))" && SET PATH=%PATH%;%systemdrive%\\chocolatey\\bin

After the Chocolatey installation is finished close the command-prompt window and open a “new” one. Then confirm that the installation had been successful by triggering and update of all (currently none) installed Chocolatey packages: cup Likely you will receive errors that the .NET 4.0 Framework isn’t installed. If this is the case then install it from this location, restart your computer and re-try the “cup” command.

Installation of NodeJS, NPM and PhantomJS (using Chocolatey)

After installation of Chocolatey:

  • First close (just to be sure) the existing command-prompt and open a “new” one

  • Then install NodeJs + NPM using the following commands:

    cinst nodejs.install

  • Finally (optionally) install PhantomJS using the following command:

    cinst phantomjs

Installing “Karma” using NPM

After installation of NodeJS (including NPM):

  • First close (needed since “cinst nodejs.install” changed the PATH) the existing command-prompt and open a “new” one

  • Then install “karma” using the following command:

    npm install -g karma@~0.8.x

    NOTE: in case Windows doesn’t recognize the “npm” command, make sure that your PATH (by executing “SET PATH“) contains C:\Users\_..._\AppData\Roaming\npm.

  • Finally ensure “Karma” is properly installed:

    karma --version

Setting environment variables for the browsers

Each browser to be used by Karma must have an environment variable named “…_BIN” (i.e. CHROME_BIN and PHANTOMJS_BIN) with the absolute path of the “.exe” of the browser. For Karma it is advised to set both the PHANTOMJS_BIN (for headless test executing) and CHROME_BIN (for debugging tests in the browser) environment variables. More information about setting the environment variables for Karma can be found here.

Upcoming blog post… integration in Maven and integration in Sonar(Cube) Now that “Karma” is installed and configured… its ready to be used. In an upcoming blogpost I will go into more detail of the Karma test runner, how to integrate it in Maven and in Sonar(Cube).

shadow-left