In this post I'll present how to integrate QUnit test runner with Team City, popular Continous Integration platform. Although, the example project is written in C#, the description is not language spacific. What is more, QUnit test runner is only one step in CI process, which can be used as separate.
Creating base project (optional)Let's start with creating simple ASP.NET MVC 4 project. This step is optional, but I'd like this example to be more comrehensive and to the build would consist of 3 steps:
- Build project
- Run C# tests
I've created 2 projects: QUnitTestableApp (ASP.NET MVC) and QUnitTestableApp.Tests (Test Project). The first project contains one controller:
The second contains simple unit test:
Let's run the test and check that it works.
Greeter class (Greeter.ts):
And test runner (Tests\TestRunner.html):
Let's open TestRunner.html file in browser and check that test passes.
Create build steps in TeamCity
Now we finally start to configure TeamCity build. Let's create new project and build configuration. For the purpose of this example we won't need VCS, so in "VCS checkout mode" select "Do not checkout files automatically".
Let's create build step. We have to specify two settings to make it work:
- Runner type: Visual Studio (sln)
- Solution file path: this should be set to point to our solution file
Then let's create test step:
- Runner type: MSTest
- Path to MSTest.exe: MSTest 2012
- List assembly files / Edit assemblies include list: Select path to QUnitTestableApp.Tests assembly.
Now we can test our configuration by running the build. We should see one test run successfully:
Add QUnit test step
For this we will need:
- run-qunit.js file (it is contained in PhantomJS's zip file in examples folder)
- qunit.teamcity.js file (more about it below)
First of all we will need to make our TestRunner.html file being able to be parsed by TeamCity. There is nice short article explaining this. You can copy the code from there and create qunit.teamcity.js file (the file can be found in the repo for this post - link at the end). What just need to inculde this file in our TestRunner.html:
When we open our TestRunner.html in the browser we can see additional messages printed out to the console:
This text will be used by TeamCity to indicate that our run was successful.
Then let's add last build step:
- Runner type: Command Line
- Working directory: Directory with TestRunner.html file
- Run: Executable with parameters
- Command executable: Path to phantomjs.exe
- Command parameters: run-qunit.js TestRunner.html. Make sure that the path to run-qunit.js is correct or the file is inside Working directory specified above.
And the result is as expected:
Source code of the example: https://github.com/lukasz-lysik/qunit-testable-app.git.