Javascript Unit Testing21.09.11

From simple websites to full scale Web Applications, JavaScript is the go-to scripting language for building interactivity into web sites and applications. As projects become more and more complex, with lines of JavaScript increasing dramatically, testing your code for bugs, glitches & performance is an essential part of development.

Unit testing is a way to test small sections of your code at a time to find any bugs and also evaluate the performance of your script. As the developer, we have an expectation of the results and unit testing allows us to test for this within the browser. Unfortunately, many developers are not aware there are a range of free tools and frameworks to assist in this process.

Firebug

Firebug is a free plugin for the Mozilla Firefox browser, allowing for inline browser checking of JavaScript as well as HTML and CSS markup, network usage and performance.  One of the greatest features of this is the ability to set breakpoints in your code. This enables us to “stop” the JavaScript in it’s step, and check various properties such as the value of variables mid-execution of functions.

JsUnit

JsUnit is a unit testing framework for client-side JavaScript within the browser. A test page must be setup, including the JsUnit.js engine which allows for custom test functions on your web page to be written. Instead of manually inspecting your code as you would in Firebug, JsUnit allows for specific tests to be written and executed all at the same time, returning a list of results. Green for OK, red for any errors.