Silicon Forks Home
Blog
JSCoverage
NRuler
Documentation
Forum

Silicon Forks

Archive for the ‘script.aculo.us’ Category

Using JSCoverage with the script.aculo.us test suite

Monday, April 26th, 2010

This is the first in a series of articles about using the JSCoverage tool with various JavaScript testing frameworks. Today, we will look at using JSCoverage with the script.aculo.us test suite.

We will start by downloading the latest version of script.aculo.us (currently version 1.8.3) and unpacking the distribution in the F:\ directory (so that the code unpacks to the directory F:\scriptaculous-js-1.8.3). Running the test suite is simple: all we have to do is open the file test/run_unit_tests.html in a web browser. Because we unpacked the script.aculo.us distribution in the F:\ directory, the URL would be

file:///F:/scriptaculous-js-1.8.3/test/run_unit_tests.html

The user interface displays two frames; clicking one of the links in the left frame runs a test in the right frame.

The script.aculo.us test suite

To get code coverage for this test suite, we need to instrument the code using jscoverage.

jscoverage F:\scriptaculous-js-1.8.3 F:\instrumented-scriptaculous

This creates a new directory, instrumented-scriptaculous, which is a copy of the original directory with two differences:

  1. All of the .js files in the directory have been instrumented to collect code coverage data when executed.
  2. The directory contains a file jscoverage.html (and a few other support files) for displaying code coverage data.

We need to open the jscoverage.html file in our web browser, and pass the path to the test suite in the query string:

file:///F:/instrumented-scriptaculous/jscoverage.html?test/run_unit_tests.html

The run_unit_tests.html is displayed in an iframe; in that frame we can execute the tests as we did before.

The script.aculo.us test suite, instrumented using JSCoverage

After running some tests, we can click on the “Summary” tab to display code coverage statistics:

The JSCoverage "Summary" tab

We can click one of the links to get a detailed view of a source file:

The JSCoverage "Source" tab

Tomorrow, we will look at using JSCoverage with the MochiKit test suite.