Tests fonctionnels avec Behat et Selenium sous Docker

Automatiser des tests fonctionnels avec Behat est une chose courante et plutôt facile à mettre en place. Par contre, dès qu’il sagit de tester les fonctionnalités impliquant du javascript, la tâche est moins aisée. Voyons comment faire avec Selenium et Docker.

Pour les impatients ou les connaisseurs, si vous savez déjà tout (du moins pour notre sujet du jour), vous pouvez d’ores et déjà passer à la partie qui va vous intéresser : la configuration.

Pour des tests “classiques” et très simple à mettre en place, j’utilise Symfony2Extension, qui permet de faire des requêtes, tester des codes HTTP (200, 404, 403 …), naviguer entre des pages … mais pas d’interpréter du javascript. Donc pas d’ajax, pas d’animation, pas de script, rien.

La documentation de Behat est plutôt explicite sur ce point, il suffit de choisir un driver différent pour les tests JS. En théorie. Oui parce qu’en pratique cela implique pour les tests JS d’avoir un navigateur (headless ou non, c’est à dire possibilité de voir le comportement en live) qui se lance avec la suite de tests Behat, et alors là c’est la débandade entre les connexions, le debug, le temps d’exécution (lancer un navigateur et émuler une réponse HTTP sont deux choses bien différentes) …

Si vous avez lu d’autres articles de ce blog, vous aurez compris qu’en plus de cette configuration, il faut prendre en compte que nous travaillons avec Docker !

Venons en au cœur du sujet : j’ai trouvé TRES PEU de documentation sur comment utiliser Docker, Behat et Selenium ensemble. Il m’a fallu parfois deviner, expérimenter, essayer, avancer à tâtons pour en arriver au résultat final tant attendu. C’est pourquoi aujourd’hui je vous livre le fruit de mon travail, en espérant que je ferais gagner du temps de recherche à certains d’entre vous !

Pour ce “tuto” et ces tuyaux, je m’appuie sur un projet de test appelé FFT — Selenium (vous verrez peut être des noms s’y reportant dans le code). Ce projet contient une page web avec un formulaire géré en javascript pour des besoins d’exemple.

Pour la suite, je pars du principe où vous avez des notions sur Docker (docker compose notamment) Behat et bien sûr Selenium.

Imaginons votre projet configuré de cette façon (certaines informations ont été volontairement retirées, n’ayant aucun intérêt pour l’exemple) : Vous avez déjà une infrastructure docker, vous avez quelques tests behat “normaux” et vous voulez implémenter des tests javascripts avec selenium.

behat.yml :

composer.json :

docker-compose.yml (le build docker/web utilise l’image docker ubuntu:14.04.3 plus PHP et nginx, ceci peut changer suivant votre contexte) :

Et pour le plaisir une feature pour behat :

On va donc lancer ce reverse proxy, qu’on va appeler le plus subtilement du monde : reverseproxy. (Notez que vous pouvez aussi le définir en tant que service dans le fichier docker-compose)

La première chose à faire, ce sont les containers Selenium. Comme promis, nous allons faire tourner tout ça sous Docker, or il existe sur le docker hub une multitude d’images couvrant de nombreux cas d’usage.

Selenium fonctionne sur un principe de hub/nœud. Un hub est un “point central” auquel vont se connecter les nœuds, chacun représentant un browser spécifique, un device … Le but est de lancer les tests sur différents navigateurs, soit différents nœuds, pour s’assurer du bon fonctionnement de l’application pour un panel de terminaux. On utilise pour le hub comme pour le nœud un même fichier .jar lancé sur une machine avec des options lui indiquant son rôle. Dans le cas du nœud, on passe des paramètres supplémentaires concernant les informations requises pour se connecter au hub.

Pour ma part et pour l’exemple, j’utiliserai 3 images :

Je préfère la version “découplée” pour une simple raison : si demain nous avons besoin d’ajouter le navigateur Opera par exemple, il suffit de monter une image docker avec le fameux .jar pour Selenium et le driver Opera qui correspond. Restera plus qu’à se connecter au hub :). Une image standalone ne contient qu’un seul navigateur bien sûr.

Les images chrome et firefox debug ont la particularité d’embarquer un serveur VNC prêt à l’emploi, et c’est de cette façon que nous pourrons voir en live les tests s’exécuter.

Les versions des images sont fixées aux plus récentes à la date de rédaction de cet article.

Il va falloir modifier notre composer.json pour ajouter le driver selenium :

Ensuite on va modifier la configuration de Behat pour ajouter notre extension Selenium :

Pour pallier à ce problème on va utiliser le paramètre “link” de docker-compose :

Enfin pour la session on précise le navigateur à utiliser (par défaut c’est firefox il me semble).

Il ne restera plus qu’à créer deux suites qui utiliseront leur session respective, afin de lancer les tests sur les deux navigateurs. La configuration des suites est assez similaire à celle de web, avec la particularité qu’on indique quelle session utiliser en cas de scenario nécessitant du javascript.

Pour rappel, il suffit d’utiliser le tag @javascript sur un scenario pour indiquer à Mink d’utiliser le bon driver.

Discernons d’abord le rôle de chaque container :

Cependant, comme il y a déjà un lien de web vers chrometesting et firefoxtesting, si vous rajoutez l’inverse il va se produire une erreur soulevée par docker : ERROR: Circular import between web and chrometesting. Vous ne pouvez pas linker “vice et versa” deux containers.

Mais rassurez vous ! Il y a une solution !

Nous allons modifier un tant soit peu notre configuration des services chrometesting et firefoxtesting :

A partir de maintenant, vous devriez pouvoir lancer vos images. Mais comment savoir si cette configuration farfelue fonctionne ?

Le test ultime : si vous avez d’un côté votre page sur /wd/hub de votre nœud, et de l’autre la fenêtre VNC, cliquez sur “Create session”. Un navigateur devrait s’ouvrir tout seul par magie :)

Ouf, on arrive à la fin, il nous manque plus qu’un test JS à exécuter !

FeatureContext.php :

Et voilà ! Gardez votre fenêtre VNC dans un coin, ouvrez même en une deuxième sur le deuxième nœud, puis lancez les tests behats. Vous devriez avoir dans un premier temps le test web sans navigateur (aucune réaction dans les fenêtres), puis tour à tour les tests se jouer sur leur navigateur respectif !

Bon tests !

Related posts:

This post will take a look at Windows internals and see how attackers are able to use rootkits and bootkits to attack systems. Rootkits are malicious software that actively conceals its existence and…

Ayurveda is an ancient Indian medicine system, which believes in the preservation of life and curing ailments through food and herbs .It is derived from two sanskrit words- Ayur and Veda. Where…

Suleika Jaouad is an award-winning journalist and author of the New York Times column and video series “Life, Interrupted.” The series is about Jaouad’s self-described ‘encanceration’ as a Leukemia…