WallabyJs, le runner intelligent de tests unitaires

Wallaby.js est un lanceur de tests JavaScript intelligent et super rapide, qui réalise vos tests en continu. Il rend compte des résultats directement dans votre éditeur et immédiatement quand vous modifiez votre code.

Nous prendrons ici pour notre exemple Visual Studio et le framework Jasmine 2.1.

Étape 1 : installation de WallabyJs

Dans notre cas, nous allons utiliser Visual Studio 2013 et télécharger l’addon WallabyJs pour Visual Studio ici : http://wallabyjs.com/#download

Attention, il faut disposer d’au moins l’Update 4 de Visual Studio 2013 pour être compatible.

Étape 2 : configuration de WallabyJs

Pour configurer l’environnement d’exécution de WallabyJs, il faut configurer trois choses :

• Le chemin d’accès aux fichiers JavaScript des fonctions que vous voulez tester.
• Le chemin d’accès aux fichiers de tests JavaScript.
• Le framework JavaScript que vous souhaitez utiliser (WallabyJs supporte Jasmine, Mocha, qUnit).

Pour se faire, il faut créer un fichier Json à la racine de votre projet web, je recommande comme nommage ceci : wallaby-jasmine.json, cela permettra d’identifier visuellement facilement le fichier de configuration.

{
    "files": [
    "Scripts/*.js"
    ],
    "tests": [
    "Scripts/tests/*.spec.js"
    ],
  "testFramework": "jasmine@2.1.3"
}

Les propriétés files et tests sont des tableaux, vous pouvez donc y mettre autant de fichiers que vous souhaitez à tester, files pour les fichiers contenant les fonctions à tester, tests pour les fichiers de tests unitaires à exécuter.

Vous pouvez également sélectionner avec * tous les fichiers d’un répertoire souhaité.

Enfin le framework utilisé dans la dernière version de WallabyJs pour Jasmine est la version 2.1.3 ; vous pouvez consulter ici la syntaxe de Jasmine.js 2.1 : http://jasmine.github.io/2.1/introduction.html.

Note : avec le framework Jasmine, le nom des fichiers de tests doivent se terminer par .spec.js.

Aperçu du projet web

Conversion.js (librairie à tester) :

var Conversion = {
    livreVersKilo: function (livres) {
        if (isNaN(livres)) {
            throw "ValeurLivreIncorrecte";
        }
        return livres / 2.2;
    }
};

conversion.spec.js (fichier de tests) :

/// 
// Specs
describe("La librairie de conversion", function () {
    describe("Conversion de livre à kilo", function () {

        it("Devrait multiplier le nombre de livre par 2.2", function () {
            expect(Conversion.livreVersKilo(22)).toBe(10);
        });

        it("Ne devrait multiplier le nombre de livre par 2.2", function () {
            expect(Conversion.livreVersKilo(22)).not.toBe(9);
        });

        it("Devrait lancer une exception si l’entrée n’est pas numérique", function () {
            var foo = function () {
                Conversion.livreVersKilo("abc");
            };
            expect(foo).toThrow("ValeurLivreIncorrecte");
        });

        it("Devrait lancer une exception si l’entrée n’est pas numérique", function () {
            var foo = function () {
                Conversion.livreVersKilo("1");
            };
            expect(foo).toThrow("ValeurLivreIncorrecte");
        });

    });
});

Étape 3 : démarrer WallabyJs

Pour se faire, se placer sur le fichier wallaby-jasmine.json, cliquer-droit et sélectionner “Start Wallaby.js” :

Si le démarrage échoue, vous serez notifié. Dans ce cas, vérifiez les informations de votre fichier de configuration. En cas de succès, le message suivant s’affichera :

Dès le démarrage, WallabyJs va exécuter les tests unitaires. Les fichiers de tests afficheront alors des carrés verts ou rouges (et un message en rouge en cas d’échec) en fonction du résultat des tests :

Étape 4 : ajouter, modifier des tests

Dès lors que vous modifierez vos fichiers de tests unitaires, WallabyJs relancera le/les tests modifié(s) sans aucune action de votre part.

Pour une démo de WalabyJs en action, regardez cette vidéo :

Bonus pour ceux qui possèdent ReSharper

Les heureux possesseurs de ReSharper peuvent se passer des étapes 2 et 3.

En effet, d’autres icônes vont apparaitre dans vos fichiers de tests, un peu comme NCrunch. Il est possible de lancer des tests unitaires en mode fenêtré :

Alors qu’en pensez-vous ? :)

WallabyJs a cependant une particularité : il n’est malheureusement pas gratuit !

(Pour consulter les prix, c’est ici.)