Test helper

Sinon.JS

The Sinon.JS is not a test framework, but a library to create Spies, Stubs, Mocks and other test helpers.

This framework is used by the map.apps developers for evaluation purpose and not heavily used.

Installation

To integrate Sinon.JS into a map.apps maven project following maven dependency can be used:

maven
<dependency>
    <groupId>de.conterra.jsrt</groupId>
    <artifactId>ct-jsrt-test-sinon</artifactId>
</dependency>

Check the Installation

Which version of sinon is available can be tested by:

Use it in a test

This is a sample of a intern test using sinon.js to spy a method call. Sinon.JS can be used with any test framework.

tests/hello.js
define([
    "intern!object",
    "intern/chai!assert",
    "module",
    "sinon", // sinon api
    "../hello"
], function (registerSuite, assert, md, sinon, hello) {
    registerSuite({
        name: md.id,

        "test that sayHello is called with message 'sinon'": function () {

            // create a spy watching the method "sayHello"
            var spy = sinon.spy(hello, "sayHello");

            // trigger a "hello"
            hello.sayHello("sinon");

            // check if the spy was called (obviously it is)
            assert(spy.calledWith("sinon"), "expected that the spy tracks the parameter");
        }
    });
});

uitest.js

uitest.js is not a test framework, but a small library helping to load a page into an iframe and checking the state of the page in a tests.

This framework is used by the map.apps developers for evaluation purpose and not heavily used.

Installation

To integrate uitest.js into a map.apps maven project following maven dependency can be used:

maven
<dependency>
    <groupId>de.conterra.jsrt</groupId>
    <artifactId>ct-jsrt-test-uitest</artifactId>
</dependency>

Check the Installation

Which version of uitest.js is available can be tested by:

Use it in a test

This is a sample of a intern test using uitest to load a page into an iframe. uitest.js can be used with any test framework.

This is the page under test:

tests/app.html
<!DOCTYPE html>
<html>
    <head>
        <!--Needed for uitest to inspect the page -->
        <script type="text/javascript">parent.uitest && parent.uitest.instrument(window);</script>
        <title>Simple Dummy Site</title>
        <script type="text/javascript">
            window.sayHello = function () {
                var message = document.getElementById("message");
                message.innerHTML = "Hello World!";
            };
        </script>
    </head>
    <body>
        <div id="message"></div>
        <button id="triggerHello" onclick="sayHello()">Learn More</button>
    </body>
</html>

This is the intern test loading the page and testing its behavior:

tests/hello.js
define([
    "intern!object",
    "intern/chai!assert",
    "module",
    "require",
    "uitest"
], function (registerSuite, assert, md, require, uitest) {
    var uit;
    registerSuite({
        name: md.id,
        "test that after app.html is loaded is the message empty": function () {
            // create ui test instance
            uit = uitest.create();
            // configure it to load an url
            uit.url(require.toUrl("./app.html"));
            // create a async callback function to inform the test framework about success or failure
            var assertMessageIsEmpty = this.async().callback(function (message) {
                assert.equal(message, "");
            });
            // wait for load of the page
            uit.ready(function (document) {
                // fetch a dom element from the page
                var currentMessage = document.getElementById("message").innerHTML;
                // check the state
                assertMessageIsEmpty(currentMessage);
            });
        },
        "test that after clicking the button 'triggerHello' is the message 'Hello World!'": function () {
            // create a async callback function to inform the test framework about success or failure
            var assertMessageIsHelloWorld = this.async().callback(function (message) {
                assert.equal(message, "Hello World!");
            });
            // reuse the uitest instance, don't reload the page
            uit.ready(function (document) {
                // click a button
                document.getElementById("triggerHello").click();
                // check if the page has changed
                var currentMessage = document.getElementById("message").innerHTML;
                assertMessageIsHelloWorld(currentMessage);
            });
        }
    });
});