Java mind: Javascript, tests unitaires et premier exemple pour comprendre la mécanique

Dans le dernier article j'ai expliqué pourquoi il fallait faire des tests dans une application Javascript. Aujourd'hui nous allons parlé de tests unitaires et comment en créer un, tout simple, sans aucun framework. Le but étant de comprendre le principe.

Les tests unitaires

Un test unitaire permet de vérifier le comportement d'une unité de votre code (un controller, un service, un filter…). Le principe est de vérifier le comportement de chacune des méthodes d'une unité et de vérifier son état à la fin s'il y en a un. Pour reprendre le vocabulaire utilisé dans les tests on parlera de système à tester (SUT système under test).

Ce système que vous êtes en train de tester utilise des dépendances externes que l'on appelle des collaborateurs. Par exemple dans une application Angular, un controller peut utiliser des service comme $http, $location... Pour isoler le système de ses collaborateurs, et ne s’intéresser qu'à lui, nous allons simuler le comportement de chaque collaborateur.

Pour cela, nous pouvons passer par des implémentations postiches ou plus généralement par des mocks qui nous permettent d'indiquer le comportement d'un collaborateur attendu dans un test.

Spécifier le comportement permet de ne pas se soucier de l'implémentation réelle. On peut ainsi anticiper les tests, faciliter les tests aux limites et surtout couper l'arbre de dépendances permettant de tester le système isolément du reste.

Les tests unitaires ont l'avantage d'être très rapides.

Un premier test

Considérons une fonction dans un fichier helloService.js

function helloService(name){
    if(!name){
        return "Who are you ?"
    }
    return "Hello " + name;
}

Pour tester cette méthode je dois écrire une portion de code qui va appeler cette méthode et vérifier le résultat. Le résultat doit ensuite écrit quelque part pour avoir un rendu. Par exemple je peux écrire un fichier helloService.spec.js

function helloServiceShouldAskWhoAreYou(){
    var label = " HelloService ask 'who are you?' when no name is sent to the function\n";
    var result = "KO";
    if(helloService()==='Who are you ?'){
        result = "OK";
    }
    document.writeln(result + label);
}

function helloServiceShouldSayHelloGuillaume(){
    var label = " HelloService ask 'Hello Guillaume' when i call function with Guillaume\n";
    var result = "KO";
    if(helloService('Guillaume')==='Hello Guillaume'){
        result = "OK";
    }
    document.writeln(result + label);
}

helloServiceShouldAskWhoAreYou();
helloServiceShouldSayHelloGuillaume();

Exécuter ce test via un Runner low cost

Un fichier Javascript peut s'exécuter dans une console NodeJs mais le cas le plus courant est tout de même un navigateur Internet. Nous pouvons donc écrire un Runner qui au final sera une simple page HTML.

<html>
<head>
   <title>Test Runner Example</title>
</head>
<body>
    <h1>mon premier Runner de tests</h1>
    <script src="../app/js/helloService.js"></script>
    <script src="spec/helloService.own.spec.js"></script>
</body>
</html>

Le résultat sera le suivant

Conclusion

En quelques lignes j'ai mis en place un test unitaire d'une fonction Javascript. Bien évidemment toute cette mécanique est un peu fastidieuse et si chacun utilisait sa propre manière de faire ou sa propre syntaxe, il serait difficile de comprendre le code des autres développeurs.

Sur un vrai cas, nous allons utiliser des librairies et des outils Javascript existants qui vont nous permettre de simplifier toute cette mécanique (Jasmine, Mocha, NUnit, Karma....)

Ce que je voulais montrer c'est la structuration d'un test

je prépare le contexte du test en simulant éventuellement les collaborateurs du système à tester
j'appelle le système à tester
je vérifie que le système ou la réponse du système sont en accord avec ce que j'attendais

Pour pouvoir utiliser ces tests vous allez avoir besoin d'une mécanique pour les lancer, on parlera de Runners. Et vous devez voir le résultat de ces tests on parlera de Reporters

Dans le prochain article nous verrons comment utiliser Jasmine..

Java mind

Pages

vendredi 9 janvier 2015

Javascript, tests unitaires et premier exemple pour comprendre la mécanique

Aucun commentaire:

Enregistrer un commentaire