JavaScript Unit Testing API Revamped

Posted by Jonah Stiennon in JavaScriptSoftware Development & TestingUncategorized

Sauce provides a shortcut API for running Javascript unit tests (like Jasmine, Qunit, Mocha, and YUI Test) on all browsers using our cloud.

The old way of doing things:

Before the unit test API was added, running frontend javascript tests using Selenium was pretty messy. One had to point the Selenium browser at the page which ran/reported the tests then inspect DOM elements on the page looking for the test results.

DOM unit testing

This was pretty dependent on the styling of the page, and can be an intensive amount of logic to put into a Selenium test, especially if you want to parse all the individual assertions.

The new way of doing things:

Now you can let Sauce Labs take care of all the tedium! Instead of setting up a Webdriver and sending Selenium commands to our servers, just fire off a single HTTP request:

curl -X POST https://saucelabs.com/rest/v1/$SAUCE_USERNAME/js-tests         
     -u $SAUCE_USERNAME:$SAUCE_ACCESS_KEY -H 'Content-Type: application/json'
     --data '{
        "platforms": [["Windows 7", "firefox", "20"],
                      ["Linux", "googlechrome", ""]],        
        "url": "https://saucelabs.com/test_helpers/front_tests/index.html",
        "framework": "jasmine"}'

The Sauce servers point a browser at the test page and get the results. We parse the results depending on the framework you're using and display them in a friendly manner on the Job Details page.

Failing Mocha and Qunit test reports on Sauce Labs

We now report the specific tests which fail, no more hunting through screenshots/videos.

The bad news:

Sauce doesn't inspect DOM elements to get your test results, it's much more robust. Buuuuuuut, it relies on you making the test results available in the global scope of the Javascript on the page. Once you add the code appropriate for your framework, our servers gather the data, parse it, and display it.

An extra feature we get from this is support for an arbitrary "custom" unit test report. If you set `window.global_test_restults` to an object that looks like this:

{
  "passed": 4,
  "failed": 0,
  "total": 4,
  "duration": 4321,
  "tests": [
    {
      "name": "foo test",
      "result": true,
      "message": "so foo",
      "duration": 4000
    },
    {
      "name": "bar test",
      "result": true,
      "message": "passed the bar exam",
      "duration": 300
    },
    {
      "name": "baz test",
      "result": true,
      "message": "passed",
      "duration": 20
    },
    {
      "name": "qux test",
      "result": true,
      "message": "past",
      "duration": 1
    }
  ]
}

We'll display the results and report the test status automatically.

customUnitTest

Enjoy the new reporting, if this gets enough use we can expand support to more frameworks and see if we can inject the reporting code into test pages when we test them, lessening the work for the developer.

Discuss: JavaScript Unit Testing API Revamped
0 Comments

Free Trial

Get access to a free 14-day trial version, or contact Sales for more information.