Jenkins + Qunit

Running QUnit tests with Jenkins and Apache Ant?

So, I have finally managed to figure this out.

Here's my end-to-end implementation:

1. Install PhantomJS (http://phantomjs.org/) - I installed this in my build/tools folder

2. Install the PhantomJS QUnit Runner script (https://gist.github.com/1588423) - also installed this in my build/tools folder

3. Added the following target to my build.xml file:

    <target name="qunit" description="runs QUnit tests using PhantomJS">
      <!-- QUnit Javascript Unit Tests -->
      <echo message="Executing QUnit Javascript Unit Tests..."/>
      <apply executable="path-to-your-phantomjs-bin-folder/phantomjs" >
        <arg value="-path-to-your-build-tools/qunit-runner.js" />
        <arg line="--qunit path-to-your-qunit-folder/qunit.js --tests path-to-your-test-folder --juni path-where-you-want-to-write-the-JUnit-style-output/qunit-results.xml" />
        <fileset dir="${basedir}/${dir.test}" includes="tests.js" />
        <srcfile/>
      </apply>
    </target>

4. Under my Jenkins project config, I now invoke Ant with "minify qunit"

5. I point Jenkins to the JUnit-style output XML file

And, here is the workflow:

1. Check changes into my repo
2. Jenkins will poll GitHub for changes
3. If there are any changes, Jenkins will pull down
4. Ant will be invoked, doing the build, then running my unit tests
5. The test results will be published in a JUnit-like XML format
6. Jenkins will analyse this output file. If no tests failed, the build will be marked as "Success". If any tests failed, the build will be marked as "Unstable"
7. Jenkins will deploy the web changes
8. Jenkins will cleanup the work-area

PS: At the moment, you have to manually delete the JUnit-type XML output file. I will fix this later.

PS: Download the customized qunit.js (https://gist.github.com/2488794)

Jenkins + qUnit

Saying Jenkins and QUnit is only part of the puzzle. You still need a web browser and a way to get a JUnit style XML file from the QUnit results on to disk. While there is Selenium and Webdriver for controlling numerous browsers, the easiest way to get started is to use PhantomJS (http://phantomjs.org/). PhantomJS is a headless webkit based browser meant just for tasks like this.

If you browse the "Test Frameworks" sections of this page ( http://code.google.com/p/phantomjs/wiki/WhoUsesPhantomJS ) you will see several scripts for running QUnit (some with JSCoverage support). The phantomjs-jscoverage-qunit script looks like it will hit all the major points you want to hit, as does United. Both look like they will require some fiddling to get them going though.

Alas, I haven't discovered any method for running QUnit tests and getting JUnit output for either Selenium, WebDriver, or PhantomJS that will just work without modification.

EDIT: Now several months later, it have become clear to me that webdriver is the future of Selenium (it probably should have been clear to me back then, but it wasn't). Also, PhantomJS now works with WebDriver via GhostDriver, so supporting only WebDriver and choosing PhantomJS as a target is probably the best advice going forward.

How to get jenkins to run my qunit test using phantomjs

In Jenkins, configure your job, add a post build action, select publish JUnit test result report then add the path to your xml file in the requested field.

Having issues creating a report.xml file for QUnit + PhantomJS + Jenkins

I have found a solution to my answer by taking the following steps:

1) added <script src="js/qunit-reporter-junit.js"></script> as it is required to generate the report. Ensure you also have the qunit.js library included also. I used qunit-1.17.1.js

2) I placed the following code in the html file that tests my js code:

<script>
QUnit.jUnitReport = function(report) {
   console.log(report.xml)
      };
</script>

3) I added the Ant code in my build.xml file:

    <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/CI/phantomjs/bin/phantomjs" output="./build/qunit/qunit-results.xml">
            <arg value="/usr/local/CI/phantomjs-runner/runner-muted.js"/>
            <arg value="./web/index.html"/>
        </exec>
    </target>

You will observe that i changed the name of runner.js to runner-muted.js This is so, because i have made changes to runner.js to not include its output to the xml file, as this makes it unreadable by jenkins. To do so:

1. cp /usr/local/CI/phantomjs-runner/runner.js /usr/local/CI/phantomjs-runner/runner-muted.js
2. Find and comment out console.log occurrences found under QUnit.done and QUnit.testDone to mute the runner from displaying its own test run results.
3. Ensure that in Jenkins you have selected the correct path to the generated xml file.

I hope this helps any of you trying to get it to work

Qunit + JSCoverage + Jenkins

QUnit: use QUnit API to generate junit XML files. Here's a sample.

In Post-build Actions for your job you then check Publish JUnit test result report and specify your junit XML files (or their file pattern). Jenkins will then mark builds that have failed tests as unstable and produce a nice trend graph of successful/failing tests.

Better looking QUnit test report with Karma JS

Not sure what I was thinking when I asked the question but Karma creates browser windows at runtime and loads tests including necessary html container inside of the browsers. Using these settings in karma.conf.js I can see the QUnit tests as they are printed when run separately.

// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: false,

// Concurrency level
// how many browser should be started simultaneous
concurrency: Infinity,

// client configuration
client: {
  clearContext: false,
  qunit: {
    showUI: true,
    testTimeout: 5000,
    filter: 'getColor(colorType, hashColor)'// name of the QUnit module to show logs on only.
  }
}

I suppose this will be enough to do my tests locally.
The bad thing is, I have to close Karma in order to load different configuration, for example filter tests for a specific function.

Does qunit-reporter-junit generate junit compatible xml?

Take a look at this discussion at GitHub please. The issue is already closed - maybe it depends on the product version.

---

Related Topics