Dans un projet, il est important de prévoir un jeu de tests afin de s’assurer que nos interventions ne produisent pas de régressions. Mais ces tests sont bien souvent concentrés sur le code pur du projet. Et l’interface de ce dernier alors ? Difficile à tester de façon automatique ? Eh bien, c’est là que Selenium WebDriver intervient.
C’est quoi le principe ?
Le principe est assez simple. Si lors de tests unitaires par exemple, vous allez écrire un bout de code afin de vous assurer que telle ou telle partie de votre projet est opérationnelle, avec Selenium WebDrvier, vous allez faire pareil. Seulement le but ne sera pas de tester que l’utilisation d’une classe marche comme vous l’aviez prévue, mais plutôt l’utilisation d’une ou plusieurs interfaces utilisateurs.
Ainsi, via votre code de test, vous allez simuler la navigation d’un internaute sur votre projet web, en indiquant qu’il clique ici ou là, interagi avec tel élément de la page et au final tester si le comportement de la page est bien celui attendu.
Comment ça marche ?
Un projet de test utilisant Selenium WebDriver fonctionne sur les mêmes principes que les autres projets de tests en s’appuyant par exemple sur le pattern AAA (Arrange, Acr, Assert). La différence est l’utilisation d’un WebDriver, un utilitaire qui va servir à piloter le navigateur correspondant.
Selenium est compatible avec les navigateurs Chrome, Firefox, Edge, Safari et Internet Explorer. Pour cela, il suffit d’utiliser le WebDriver correspondant au navigateur souhaité (et dans une version correspondant à celle du navigateur installé sur la machine servant aux tests).
Que peut-on faire avec le WebDriver ?
Tout d’abord, il est possible de localiser des éléments dans la page. Cela peut se faire via les identifiants, le nom des balises, via une classe CSS particulière, une expression XPath ou encore via une sélection CSS (par exemple « #example-div table tr: nth-child(2) td:first-child » va localiser la première cellule de la deuxième ligne d’un tableau se trouvant dans le container « example-div »). Il est aussi possible de localiser un élément par rapport à un autre, par exemple obtenir l’élément juste au-dessus ou juste à gauche d’un autre. Bref, si vous savez localiser un élément en CSS pour le designer, vous saurez le trouver avec votre WebDriver. Il est bien sûr envisageable de se coordonner avec les développeurs afin de placer des identifiants sur les éléments ciblés par les tests.
Une fois un élément localisé, il est ensuite possible de l’utiliser, pour en extraire le texte, ses attributs ou des éléments se trouvant en son sein, mais il est aussi possible d’interagir avec lui en simulant le clic, en sélectionnant une valeur (dans le cas d’une liste déroulante) ou en remplissant l’élément (dans le cas d’un champ).
Cela semble un peu basique non ?
Oui et non. La navigation d’un internaute n’est que rarement constituée d’actions complexes, n’est-ce-pas ? On peut cependant ajouter à vos possibilités les options suivantes.
Tout d’abord, vous pouvez contrôler la navigation elle-même en forçant l’ouverture d’une URL précise. Vous avez accès aussi aux fonctions du navigateur que sont le retour arrière, le retour avant et le rafraîchissement de la page.
Vous avez aussi la possibilité d’interagir avec les éléments de JavaScript que sont les alertes, les popups de confirmation et les popups demandant de renseigner une information.
Selenium vous permet également de jouer avec les différentes fenêtres et onglets de votre navigateur, vous permettant d’ouvrir un lien dans un nouvel onglet, de piloter ce nouvel onglet de la même manière que le précédent et de retourner ensuite sur l’onglet / la fenêtre précédent(e).
Enfin, avec les interfaces modernes, en particulier les applications SPA (Single Page Application), il n’est pas rare au contraire qu’une action ne provoque pas de navigation, mais un chargement asynchrone où vous avez juste un loading qui apparaît. Selenium vous donne quelques options pour gérer cela en fournissant la possibilité de spécifiquement attendre jusqu’à ce que telle ou telle condition soient vraies, par exemple attendre jusqu’à ce qu’un élément devienne disponible (tout en vous permettant de spécifier combien de temps, vous êtes prêt à attendre, il ne s’agirait pas de lui permettre de tourner pendant des jours en attendant pour rien).
Que peut-on tester ?
Cela dépendra évidemment de votre projet, mais de façon basique, vous avez accès aux mêmes assertions que pour un projet de tests unitaires avec Selenium WebDriver. À savoir que vous pouvez par exemple comparer un élément de la page pour vérifier l’égalité, l’infériorité, la supériorité, etc. Vous pouvez par exemple tester si un élément est bien présent sur une page, s’il dispose bien de telle ou telle classe CSS, si son contenu est conforme à vos attentes, etc.
Vous pouvez ainsi tester tout un processus de navigation allant de la page d’accueil à la validation d’un panier par le client en passant par la consultation de ses factures dans son espace privé.
Mais vous pouvez aller plus loin, car Selenium WebDriver permet de contrôler non seulement la navigation, mais aussi l’état du navigateur. Cela inclut notamment la taille de votre navigateur. Vous avez la possibilité de pousser vos tests afin de contrôler l’aspect responsive de votre site en vous assurant que si le navigateur est taille mobile, la navigation est toujours possible sans problème. Est-ce que cet élément se masque bien si la largeur de la fenêtre passe sous telle valeur ? Est-ce que ma navigation est toujours possible depuis l’équivalent d’un navigateur mobile ? Le design responsive d’un site est parfois très délicat et le moindre changement peut avoir plus de conséquence qu’on ne le pense. Mais avec ce type de tests, on peut s’assurer que ces changements à priori minimes ne provoquent pas de bogues ou de régressions.
La mise en place de ces tests est-elle longue ?
Cela va dépendre évidemment de votre application, de la portée de vos tests. Mais les tests d’interface peuvent être relativement longs à mettre en place, plus que des tests unitaires en tout cas.
Comme nous le précisions, il faut définir chaque action de l’utilisateur en identifiant chaque élément avec lequel il va interagir et chaque élément dont nous voulons tester l’état. Cela peut prendre un peu de temps, surtout si l’on se rend compte que les éléments en question ne sont pas assez identifiables et auquel cas, il faudra passer par la modification de l’interface en y ajoutant des identifiants clairs (ce qui est plus prudent, identifier un élément par un simple ID sera moins sujet à conséquences que par une longue sélection CSS).
Autre point d’attention, lors d’une suite de tests, il faudra procéder à un découpage intelligent de vos tests. Chaque assertion ratée provoque la fin du test de la suite de test. Vos tests doivent donc être organisés pour finir sur la ou les assertions afin d’assurer le bon fonctionnement de vos scénarios de tests. En effet, si vous testez qu’un élément est affiché en rouge par exemple et qu’ensuite, vous faites une action nécessaire pour la suite du test (cliquer sur cet élément par exemple) mais que l’élément n’est pas affiché en rouge, l’action n’aura pas lieu.
Enfin, il ne faut pas oublier que ces tests automatiques simulent la navigation de l’internaute en ouvrant un navigateur (en arrière-plan ou directement selon la configuration de vos tests). Et si Selenium va évidemment beaucoup plus vite qu’un internaute, une grosse suite de tests peut prendre un peu de temps, car il y a les temps de chargement à prendre en compte par exemple. Une fois que tous vos tests sont en place, tous les relancer peut demander beaucoup de temps.
Pour conclure
Selenium WebDriver est un outil très intéressant pour apporter davantage de qualité à vos applications web. Relativement long à mettre en place, il apporte toutefois une aide précieuse aux développeurs devant intervenir sur les interfaces de l’application et apporte au final un gain de temps non négligeable puisque leur épargnant toute une série de tests qu’ils pourront enfin déléguer à un outil spécialement conçu pour cela.
Envie d’aller plus loin à propos des tests logiciels ?
