Project Description

QNUnit offers a number of tools for running QUnit javascript tests (http://docs.jquery.com/Qunit) as part of a continuous integration (CI) process. The library currently supports logging to console and to the Teamcity script console.

Upcoming Features

- The ability to kick off QUnit tests from an NUnit test


Teamcity Quick Start

0. Drop the contents of the QNUnit.Console "bin" folder into a single directory which can be accessed by Visual Studio. A typical location would be under the "lib" or "dependencies" folder of your project.

1. Edit QNUnit.Console.exe.config to provide:

  • testSuiteName - The name to give to your entire Javascript test suite (ex. qunit.samples.tests)
  • browser - The browser to run your QUnit tests with. Valid values include "ie" and "firefox".
  • logger - The logger to use to output test results. Value can be "console" (standard Console.Writeline statements) or "teamcity" (for Teamcity script console integration). In this case, use "teamcity".

2. Add QNUnit.Console.exe as post-build step to your QUnit tests project. Navigate to: Project Properties -> Build Events. Enter the following in the "Post-build event command line" box:

[Path to QNUnit.Console.exe] $(SolutionDir)[Tests directory]

An example of a command would be:

$(SolutionDir)Dependencies\QNUnit\QNUnit.Console.exe $(SolutionDir)\Project.QUnit\Tests

3. Start Teamcity Build Agent as a standalone console rather than as a service. QNUnit uses the Watin library (http://watin.sourceforge.net/) for opening browsers and Teamcity has trouble doing that in service mode. (see http://stackoverflow.com/questions/488443/running-watin-on-teamcity) Use the following command to start the agent console:

[Teamcity root]\bin\agent.bat start

4. Commit your changes and have Teamcity build the solution. You should start seeing QUnit test results!

 

QUnit Standalone Test Example

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
    <title>Basic Qunit Test</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
    <script type="text/javascript" src="http://github.com/jquery/qunit/raw/master/qunit/qunit.js"></script>
    <link rel="Stylesheet" type="text/css" href="http://github.com/jquery/qunit/raw/master/qunit/qunit.css" />

    <script type="text/javascript">
        $(function () {
            test("a basic test example", function () {
                ok(false, "this test is not fine");
                var value = "hello";
                equals("hello", value, "We expect value to be hello");
            });

            module("Module A");

            test("first failed test", function () {
                equals("not the same", "same", "Expected value to be 'same'");
                equals("ok", "ok", "Expected value to be 'ok'");
                same(1, 3);
            });
        });
    </script>
</head>
<body>
    <div id="test-group-name">Basic QUnit Test</div>
    <h1 id="qunit-header">
        QUnit example</h1>
    <h2 id="qunit-banner">
    </h2>
    <h2 id="qunit-userAgent">
    </h2>
    <ol id="qunit-tests">
    </ol>
</body>
</html>


 

 


Last edited Oct 28, 2010 at 8:57 PM by jookyboi, version 17