jasmine : tests unitaires en javascript - human talks grenoble 14.05.2013

Tests unitaires JavaScript

Xavier NOPRE – 14/05/2013

GRENOBLE

Xavier NOPRE

@xnopre xnopre.blogspot.com

Indépendant

Développeur

Agiliste

Jasmine : C'est quoi ?

Un framework de tests unitaires pour JavaScript

fournit un cadre pour écrire les tests unitaires

Indépendant d'autres librairies

Ne nécessitant pas de DOM

Mise en route ?

Le site et la doc : http://pivotal.github.io/jasmine/

Télécharger le ZIP et dézipper :

https://github.com/downloads/pivotal/jasmine/jasmine-

standalone-1.3.1.zip

Afficher SpecRunner.html dans le navigateur

Editer :

Les tests dans le répertoire spec

Le code dans le répertoire src

Et pour mes tests ?

Jouer mes tests ?

Editer SpecRunner.html :

Et ça ressemble à quoi ? 1/2

Suite de tests :

describe("Ma suite de tests : ", function() {

...

});

Suite dans des suites :

describe("Ma suite de tests : ", function() {

...

describe("Suite dans la suite: ", function() {

...

});

});

Et ça ressemble à quoi ? 2/2

Code avant chaque test "before" :

beforeEach(function() {

...

});

Test :

it("should display initial message", function() {

expect(xxx).toEqual(yyy);

});

Etc …

Je veux voir !

Et tester le DOM ?

Extension jasmine-jquery :

https://github.com/velesin/jasmine-jquery

Ajoute des assertions spécifiques :

toBe(selector), toBeHidden, toHaveCss, toHaveAttr,

toBeFocused, …

Ajoute une API de chargement de fixtures HTML, CSS,

JSON

Usage :

Ajouter jasmine-jquery.js au test runner

Et tester mes requêtes Ajax ?

Extension jasmine-ajax :

https://github.com/pivotal/jasmine-ajax

Compatible avec jQuery

Permet de "mocker" les requêtes jQuery.ajax pour :

Vérifier ces requêtes et leurs paramètres

Simuler leurs succès, échecs, et données renvoyées

Usage :

Ajouter jasmine-ajax.js au test runner

Et actuellement, t'en es où ? (REX)

Jasmine (ou autre) : super !

Traitement de données, formatages, … : OK !

Tests sur le DOM : ….

Investissement important

Très proche du rendu (trop ? …)

Mais bien pratique !

Exemples

Xavier NOPRE :

Développeur logiciel passionné (Java & Web)

Pratique et partage l’agilité depuis 2007

Indépendant. Missions :

Développements sur mesure et accompagnement de projet

En mode agile

Coaching en agilité, Scrum, et ingénierie agile

MERCI

@xnopre xnopre.blogspot.com

Annexes

Retrouvez ici quelques captures des écrans

présentés lors de la session

Page de test Jasmine après unzip

Fichier : MesTests.js describe("Ma suite de tests : ", function() {

var message;

beforeEach(function() {

message = "Hello HumanTalks";

});

it("should display initial message", function() {

expect(message).toEqual("Hello HumanTalks");

});

describe("Une 'sous' suite de tests : ", function() {

it("should add Grenoble", function() {

message = htgre.expandForHTGrenoble(message);

expect(message).toEqual("Hello HumanTalks Grenoble");

});

});

});

Fichier : MonCode.js (function(){

window.htgre = {

expandForHTGrenoble: function(message) {

return message + " Grenoble";

}

};

})();

Page de test Jasmine avec mes tests démo