Pages

jeudi 15 janvier 2015

Comment écrire vos tests javascript avec Jasmine (1/2)

Il existe plusieurs librairies pour vous aider à écrire des tests en Javascript, Mocha, NUnit, ... mais aussi Jasmine que je vais essayer de présenter aujourd'hui.



Comme le rappelais dans un article précédent, il est important de tester une application Javascript. Vous pouvez utiliser votre propre syntaxe mais il est préférable d'utiliser des librairies existantes pour lesquelles vous aurez une bonne intégration dans des outils tel que Gulp, Grunt, Karma....

Principe général

Jasmine est un framework Javascript pour faciliter l'écriture des tests de votre application. Nous allons reprendre l'exemple vu dans le dernier article où nous cherchions à tester la méthode suivante

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

Avec Jasmine les tests peuvent s'écrire de cette manière

describe("HelloService ", function() {
    it("ask 'who are you?' when no name is sent to the function", function() {
        expect(helloService()).toBe('Who are you ?');
    });

    it("ask 'Hello Guillaume' when i call function with Guillaume", function() {
        expect(helloService('Guillaume')).toBe('Hello Guillaume');
    });
});

Le mot clé describe permet de définir une suite de tests identifiée par un nom et une fonction qui contiendra les tests à exécutés.

Chaque test, est un appel de la méthode it() qui comprend deux arguments
  • une chaîne de caractères pour identifier notre test. Ce nom apparaît dans les rapports de tests donc soyez le plus explicite possible. 
  • une fonction qui sera le code de notre test. Nous allons vérifier que notre méthode testée renvoie une valeur ou laisse le système à tester dans l'état attendu. Pour cela on une utilise la méthode expect qui encapsule le résultat et fournit un ensemble de méthode pour comparer ce résultat (on parle de Matchers). Chaque méthode renverra vrai ou faux et influera sur le résultat du test.

Lancer un test

Si nous voulons exécuter ce test, nous devons utiliser un Runner particulier. Avant de voir dans un prochain article Karma, nous allons voir comment lancer les tests que nous venons d'écrire via le Runner Jasmine.


Vous pouvez télécharger un squelette de projet sur la page Github du projet et vous en inspirer pour utiliser Jasmine dans vos tests.

Personnellement je préfère utiliser Bower (module de Yeoman) à la racine de mon projet via la commande

bower install jasmine

Ensuite vous devez avoir un fichier HTML dans vos tests avec par exemple le contenu suivant

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Jasmine Spec Runner v2.1.3</title>

    <link rel="stylesheet" href="../app/bower_components/jasmine/lib/jasmine-core/jasmine.css">

    <script src="../app/bower_components/jasmine/lib/jasmine-core/jasmine.js"></script>
    <script src="../app/bower_components/jasmine/lib/jasmine-core/jasmine-html.js"></script>
    <script src="../app/bower_components/jasmine/lib/jasmine-core/boot.js"></script>

    <!-- include source files here... -->
    <script src="../app/js/helloService.js"></script>
    <script src="../app/js/blogService.js"></script>

    <!-- include spec files here... -->
    <script src="spec/helloService.spec.js"></script>
    <script src="spec/beforeAfterEach.spec.js"></script>
    <script src="spec/blogService.spec.js"></script>

</head>

<body>
</body>
</html>

Ce qui donnera


Si jamais nous avions une erreur nous aurions eu la sortie suivante





Les différents matchers

Dans notre premier Matcher nous avons utiliser le plus simple toBe qui équivaut au ===.

expect(true).toBe(true);
expect(false).not.toBe(true);

Pour des objets vous pouvez utilisez le matcher toEqual

expect(obj1).toEqual(obj2);

Il est possible de vérifier qu'une variable est définie ou nulle

expect(a.foo).toBeDefined();
expect(a).toBeNull();


Vous pouvez également utiliser des expressions régulières

expect(message).toMatch(/bar/);

Pour avoir la liste détaillée je vous laisse consulter la documentation officielle et les annexes

Et après...

La prochaine fois je vous parlerai de la structure d'un test et comment mocker les collaborateurs (les dépendances) utilisés par le système à tester (voir l'article)

Aucun commentaire:

Enregistrer un commentaire

Remarque : Seul un membre de ce blog est autorisé à enregistrer un commentaire.