Hacking JSpecView - Creating an HTML Test Harness

January 28, 2008

The previous article in this series discussed the construction of an Ant build environment for JSpecView. This article will show how to use Ant to build an HTML harness to test the resulting Applet and jarfile.

Availability of Source Code

Robert Lancashire, the lead JSpecView developer, has kindly agreed to host the complete source code for this series of tutorials on the JSpecView SourceForge project page.


Our goal for this session is to create an Ant task that will assemble a directory of HTML pages for testing the JSpecView applet. To do this, we'll add a new demo task and some supporting files.

Editing the build.xml File

The main change we'll make is to add the demo task itself:

<target name="demo" depends="jar">
  <mkdir dir="${demo}" />
  <copy todir="${demo}">
    <fileset dir="${resources-html}" />
  <copy file="${build-lib}/${unix-name}-${version}.jar" tofile="${demo}/lib/${unix-name}.jar" />

This task creates a demo directory and copies into it the contents of a new resources/html directory, along with the jarfile built with the jar task.

Other changes to the build.xml file are necessary. In the interest of brevity, they have been omitted. Those interested should download the source package to be available shortly.

Creating the resources Directory

Think of the resources directory as a place to hold non-Java files that will get used by our Ant tasks. Our first addition to this directory will be a directory called html. Here, we'll create a new directory called demo1. It will contain an HTML document with an embedded JSpecView applet (index.html), along with a JCAMP-DX file (netanilineH.jdx) and the excellent JActivating JavaScript tool.

Using the demo Task

We can run our new demo task just like the others:

$ ant demo
Buildfile: build.xml

    [mkdir] Created dir: /home/rich/devel/proj/jspecview/build
    [mkdir] Created dir: /home/rich/devel/proj/jspecview/build/classes
    [mkdir] Created dir: /home/rich/devel/proj/jspecview/build/lib

    [javac] Compiling 48 source files to /home/rich/devel/proj/jspecview/build/classes

      [jar] Building jar: /home/rich/devel/proj/jspecview/build/lib/jspecview-20080128.jar

    [mkdir] Created dir: /home/rich/devel/proj/jspecview/demo
     [copy] Copying 3 files to /home/rich/devel/proj/jspecview/demo
     [copy] Copying 1 file to /home/rich/devel/proj/jspecview/demo/lib

Total time: 3 seconds

If all went well, you should see a new demo directory with the following structure:

Viewing the Result

You can view the result online here. The applet loads and displays the JCAMP-DX file netanilineH.jdx. Notice that the spectrum is interactive; zoom and display properties can be set by right-clicking in the applet Window.


This tutorial has show how to build a simple HTML test harness for JSpecView. With this important step complete, we can begin to customize JSpecView itself. Future tutorials will show how.