Javascript Loves CI

May 5, 2011

Jenkins + Jasmine + PhantomJS + JSHint

We write a great deal of Javascript here at Zendesk, and we use a few great tools to help us make sure we’re committing solid code. First, we run it through JSHint, a slightly-more-friendly port of JSLint. Second, we use Jasmine to test the code. These tools work great in our development environment, but I really wanted to get Jenkins to start doing some of our code-quality checking for us.

Here’s a quick review of how I got these tools working together in one harmonic symphony of Javascript cleanliness and overextended metaphors. (This article assumes that you already have Jenkins running on a machine on which you have administrator permissions.)

  1. Install Node.JS. On OS X,it’s as easy as brew install node.

  2. Install npm:

    curl | sh
  3. Install JSHint:

    npm install jshint
  4. Add a jshint.rake file:

  5. [gist id=952579 file=04_jshint.rake]

  6. Install Qt. On OS X, everyone recommends
    against using brew install qt; instead, download and install the

  7. Install PhantomJS

  8. Add a js_tests.rake file:

    [gist id=952579 file=07_js_tests.rake]

  9. Did you see that config.jasmine_server_port in there? Jasmine::Config
    saves the port on which it starts the server, but it doesn’t make that
    information available. Thus, add it in the config_overrides:

    [gist id=952579 file=08_jasmine_config.rb]

  10. Add a PhantomJS runner for Jasmine. I got mine from

    [gist id=952579 file=09_phantom_js_runner.js]

  11. Create a Rake task just for Jenkins:

    [gist id=952579 file=10_ci.rake]

It’s not exactly a fast process, but it works great once you get it going.

We know. It's a lot to take in.

Sign up for our newsletter and read at your own pace

Please enter a valid email address
Please also send me occasional emails about Zendesk products and services. (You can unsubscribe at any time.)
Please select an option

Welcome to the club!

Oops! Sorry something went wrong, try again later?