While working with a JavaScript project build may sound odd, it's quite relevant here. Using build , we can perform a bunch of project-related tasks with a single command. It's common practice nowadays to run tasks such as JavaScript linting, code standard validation, CSS preprocessing, and API documentation update with a build script, manually or using continuous integration tools. This recipe shows how the QUnit testing task can be added to the project build script.
For this task, we will use Apache Ant ( http://ant.apache.org/ ) for build automating. On Mac OS X, Ant is available by default. On Unix/Linux, it is available in ports and you can use a package manager to install Ant. As for Windows you can find the installation instructions in the official manual at ant.apache.org/manual/index.html.
Since Ant runs QUnit tests on the command line, we will use PhantomJS as it is discussed in . However, if we are to satisfy third-party software executing the build script such as continuous integration tools, we need to make the QUnit report in a specific format. Most tools accept JUnit XML. We can translate the QUnit output to JUnit format with a plugin called JUnit Logger (https://github.com/jquery/qunit-reporter-junit). So, we add to the test runner HTML the plugin JavaScipt module and the following configuration option:
QUnit.jUnitReport = function(report) {
console.log(report.xml);
};But here pops up another problem. The PhantomJS Runner script now breaks JUnit XML with its own report version. You can simply comment out console.log occurrences in the QUnit.done and QUnit.testDone callback functions at the end of runner.js and save it, say as runner-muted.js.
Set up the build script as
build.xmlin the root of the project working directory:<?xml version="1.0"?> <!DOCTYPE project> <project name="tree" basedir="." default="build"> <target name="build" description="runs QUnit tests using PhantomJS"> <!-- Clean up output directory --> <delete dir="./build/qunit/"/> <mkdir dir="./build/qunit/"/> <!-- QUnit Javascript Unit Tests --> <echo message="Executing QUnit Javascript Unit Tests..."/> </target> </project>
Extend it with the build target to run QUnit tests:
<?xml version="1.0"?> <!DOCTYPE project> <project name="tree" basedir="." default="build"> <target name="build" description="runs QUnit tests using PhantomJS"> <!-- Clean up output directory --> <delete dir="./build/qunit/"/> <mkdir dir="./build/qunit/"/> <!-- QUnit Javascript Unit Tests --> <echo message="Executing QUnit Javascript Unit Tests..."/> <exec executable="/usr/local/bin/phantomjs" output="./build/qunit/qunit-results.xml"> <arg value="./vendors/Runner/runner-muted.js" /> <arg value="http://test.dev/qunit/tests/test11/index.html" /> </exec> </target> </project>Run Ant in the same directory where
build.xmlis located:antExamine the results shown in the following screenshot:
