Skip to main content
BuyLog In
CodeRush
Search in…
Docs > CodeRush > Unit Testing Assistance > JavaScript Test Runner
A newer version of this page is available.
All docs
V19.2
CodeRush
System Requirements
Improve Performance
Features by Language
Getting Started
How To
Coding Assistance
Navigation and Search Tools
Static Code Analysis
Visualization Tools
Code Style Assistance
Building Assistance
Debugging Assistance
Refactoring Assistance
Unit Testing Assistance
Running and Debugging Tests
Analyzing Test Execution Result and Output
Working with Test Sessions
Code Coverage Calculation
JavaScript Test Runner
Unit Test Builder
Testing Framework Configuration
Decompiling Tools
Configuration Options
Extensibility
Download CHM

JavaScript Test Runner

  • 5 minutes to read

CodeRush for Roslyn provides the Test Runner for client-side JavaScript code. It allows you to run and debug particular unit tests using the CodeRush Test Runner GUI.

NOTE

To enable this feature, use the Unit Testing | JavaScript Test Runner options page.

IMPORTANT

Server-side JavaScript (Node.js) tests are not currently supported. Client-side tests support is limited to tests that can be run using Karma Test Runner.

The following testing frameworks are supported:

Your unit tests should be able to access the tested code. There are several ways to reference the tested modules, and CodeRush for Roslyn supports the most common ones:

NOTE

JavaScript TestRuner executes tests using Karma Test Runner with the browsers specified in karma.conf.js. It uses the PhantomJS headless browser if your project does not use Karma.

This document consists of the following sections:

Requirements

JavaScript Test Runner requires Node.js to be installed on your PC - CodeRush for Roslyn uses it internally.

When installing Node.js, choose LTS or Current build and select the npm package manager.

TestRunnerJS_npm

Running Tests without Karma

This section describes how to run Jasmine Unit Tests linked to the tested code using reference directives.

  1. Create an app.js file and add the following code to it (you can use your own file with tested functions):

    function agree() {
    return true;
}

  2. Create a tests.js file and add the following test suite to it (you can use your own file with unit tests):

    describe("Demo suite", function() {
    var answer = agree();
    it("Positive demo spec", function() {
        expect(answer).toBe(true);
    });
    it("Negative demo spec", function() {
        expect(answer).toBe(false);
    });
});

  3. Add the following line at the beginning of the tests.js file:

    /// <reference path="app.js" />

  4. Open your project's folder in Visual Studio:

    TestRunnerJS_OpenFolder

    NOTE

    If your JavaScript code is in a Visual Studio Solution, you can open the Solution instead.

  5. Open the Test Runner window using the CodeRush | Windows | Test Runner menu item and the tests.js file. Wait until the tests are discovered.

    TestRunnerJS_Window

  6. Once the unit tests are discovered, you can run them and analyze the results. Learn more about running tests with CodeRush Test Runner in the Running and Debugging Tests topic. If you need to debug tests, refer to the Debugging Tests section.

Running Tests with Karma

This section describes how to run Jasmine Unit Tests linked to the tested code using Karma Test Runner configuration file.

  1. Create an app.js file and add the following code to it (you can use your own file with tested functions):

    function agree() {
    return true;
}

  2. Create a tests.js file and add the following test suite to it (you can use your own file with unit tests):

    describe("Demo suite", function() {
    var answer = agree();
    it("Positive demo spec", function() {
        expect(answer).toBe(true);
    });
    it("Negative demo spec", function() {
        expect(answer).toBe(false);
    });
});

  3. Install the required packages using npm package manager by executing the following command in your project's root:

    npm install karma phantomjs karma-phantomjs-launcher --save-dev

  4. Install the framework-specific packages. For Jasmine, use the following command:

    npm install jasmine karma-jasmine --save-dev
    TIP

    You can specify the packages your project requires using the package.json file. Refer to the npm documentation for more inofrmation.

  5. Create a Karma configuration file (karma.conf.js) if you do not have one. You can generate karma.conf.js automatically using the following command:

    node .\node_modules\karma\bin\karma init

    If your existing Karma configuration file was not found, create the cr.jstest.config.json file in the project's root and add the Karma configuration file's path to this file as shown below:

    { "KarmaConfig": "./test/unit/karma.unit.conf.js" }

  6. Open your project's folder in Visual Studio:

    TestRunnerJS_OpenFolder

    NOTE

    If your JavaScript code is in a Visual Studio Solution, you can open the Solution instead.

  7. Open the Test Runner window using the CodeRush | Windows | Test Runner menu item and the tests.js file. Wait until the tests are discovered.

    TestRunnerJS_Window

  8. Once the unit tests are discovered, you can run them and analyze the results. Learn more about running tests with CodeRush Test Runner in the Running and Debugging Tests topic. If you need to debug tests, refer to the Debugging Tests section.

Debugging Tests

To debug tests, you need to use a full-featured web browser like Google Chrome or Mozilla Firefox (only Karma-enabled projects support debugging). Follow the steps below to prepare your project for debugging:

  1. Install a Karma launcher for your browser. For example, to install the Google Chrome launcher, you should execute the following command in your project's root:

    npm install karma-chrome-launcher --save-dev
  2. Add the chosen browser to your Karma configuration file's browsers section. Refer to the corresponding Karma launcher package description on the npm website for more details.
  3. Use the Debug Test button in the Test Runner window or code editor icon's menu.

The further debugging process is similar to the Karma workflow. Go to the captured browser, click the "DEBUG" button (or open http://localhost:9876/debug.html), and use the browser's web inspector to debug your test. (You may need to refresh the debug.html page).

Gulp Support

If you need to execute a Gulp task before running tests, specify the task name in the cr.jstest.config.json file in the project's root as shown below:

{ "GulpTask": "beforeTesting" }
NOTE

If your cr.jstest.config.json file already contains settings, refer to the JSON format documentation to learn how to expand the JSON object with one more key/value pair.