Conditionally run QUnit tests based on browser.

(This is a legacy post from the old website.)

I’m working on a project that I’ve built a very comprehensive Javascript test suite for with QUnit. I run tests a few times in a few different ways before subjecting the world to my code.

First I load the QUnit test page in multiple browsers to ensure I’m not going to be bitten by a cross-browser compatibility bug (IE).

[image lost]

Afterward, when I run my Grunt build script to check, concatenate, and minify my JS, it re-runs those tests before concatenating, after concatenating, and finally on the minified version as well.

Occasionally I run into some false positives (failed tests) that are
tied to some browser quirk like Chrome not allowing file cookies (unable
to set cookies when the URL is local: file:///…) or the fact that
PhantomJS isn’t a true browser so it isn’t able to handle cookies
gracefully. Don’t skip writing tests for troublesome bits, instead just
conditionally skip those tests based on user agents.

For example, I have two test helpers in a file test_helpers.js:

var helpers = {
	// Determine if tests are running in Chrome
	is_chrome: navigator.userAgent.toLowerCase().indexOf('chrome') > -1,

	// Determine if tests are running in PhantomJS.
	is_phantom: navigator.userAgent.toLowerCase().indexOf('phantom') > -1,

I include test_helpers.js file into my QUnit test page(s). Then I wrap
any tests that succumb to environment issues in an if statement:

test('Session creates a session & cookie upon instantiation (TEST SKIPPED IN CHROME! WILL NOT PASS).', function(){
	if(!helpers.is_chrome && !helpers.is_phantom){
		// Test that runs only outside of Chrome and Phantom.js

My troublesome QUnit tests will run in all clients except those I’ve
explicitly avoided. My tests run green in both Chrome and my Grunt build

Leave a Reply

Your email address will not be published. Required fields are marked *