Automatisez des tests fonctionnels pour le web avec Cypress

Comprenez ce que sont les tests fonctionnels

L'objectif des tests fonctionnels est de s’assurer que les différentes fonctionnalités d'un système répondent correctement aux exigences définies.

En voici les principales caractéristiques :

Faites la différence entre les tests automatisés et les tests manuels

Les tests fonctionnels peuvent être exécutés de manière manuelle ou automatisée. Chaque approche présente ses avantages et inconvénients, et le choix entre les deux dépend des exigences spécifiques du projet, de la complexité des scénarios de test et des ressources disponibles.

Pour vous aider à faire la comparaison, voici un tableau qui résume les avantages et inconvénients des deux méthodes selon des critères précis :

Voilà, vous en savez un peu plus sur les tests fonctionnels, ainsi que sur les avantages et inconvénients des tests automatisés et manuels. Explorons à présent les scénarios, les cas de test et les suites de tests, trois composantes cruciales du processus de test logiciel.

Comprenez la différence entre les scénarios, cas de test et suites de tests

Il est essentiel de maîtriser les concepts fondamentaux de scénario, cas de test et suite de tests pour construire des tests robustes et complets.

Les scénarios 

Les scénarios de test offrent une perspective utilisateur de l'application en simulant des flux d'interaction spécifiques. Ces scénarios décrivent des séquences d'actions  d’utilisateurs réels. Ils jouent un rôle central car ils mettent en lumière le comportement global de l'application du point de vue des utilisateurs finaux.

Par exemple :

Scénario : Connexion à un compte utilisateur existant

Quand je suis sur la page d'accueil

Que je clique sur le bouton Se connecter

Et que j'entre mon nom d'utilisateur et mon mot de passe

Alors je devrais être redirigé vers mon tableau de bord utilisateur

Les cas de test 

Les cas de test plongent dans les détails techniques pour évaluer des aspects spécifiques de l'application. Ils se concentrent sur des fonctionnalités ou des composants individuels, et fournissent une validation granulaire des fonctionnalités et des performances. Les cas de test s'appuient sur des assertions pour vérifier les résultats attendus et détecter les éventuelles erreurs.

Par exemple :

Cas de test : Vérification de l'affichage des produits dans la liste

Étant donné que je suis sur la page de la boutique en ligne

Quand je clique sur la catégorie Électronique

Alors je m'attends à voir une liste de produits affichés

Et le nombre de produits affichés doit correspondre à mes attentes

Les suites de tests 

Les suites de tests organisent et hiérarchisent les scénarios et les cas de test en fonction de leur pertinence, de leur priorité ou de leur domaine fonctionnel. Cela facilite la gestion et l'exécution de groupes de tests spécifiques, permettant aux équipes de cibler des aspects particuliers de l'application à des moments donnés.

Par exemple :

Suite de tests : Tests de fonctionnalités de paiement

- Scénario : Effectuer un paiement avec succès

- Scénario : Vérifier la validation des champs de paiement

- Cas de test : Vérifier le calcul correct du total à payer

- Cas de test : Vérifier l'affichage des messages d'erreur pour les paiements échoués

Maintenant que vous y voyez plus clair, penchons-nous plus en détail sur les tests fonctionnels.

Comprenez les enjeux des tests fonctionnels

Imaginez que vous soyez développeur et que vous travailliez sur un formulaire pour un nouveau site internet. Avant de vous lancer dans le développement, vous allez sans doute vous poser plusieurs questions pour vous assurer que vous partez dans la bonne direction. Par exemple, comment savoir si la fonctionnalité développée est fiable ? Comment faciliter la maintenance de votre produit ? Ou encore, comment réduire les coûts du développement ?

Toutes ces questions sont la raison d’être des tests fonctionnels. Comme nous l’avons dit précédemment, ils se concentrent sur la vérification du bon fonctionnement des différentes fonctionnalités du logiciel, en se basant sur les spécifications et les exigences du système. Ils permettent donc de répondre à un certain nombre d’enjeux du développement d’un produit :

• Fiabilité : Les tests fonctionnels permettent de vérifier que le code fonctionne correctement. Ils permettent aussi de détecter les erreurs avant qu'elles ne causent des problèmes en production. Cela améliore la fiabilité et la qualité du produit.

• Détection des anomalies : Les tests fonctionnels identifient les défauts, les bugs et les erreurs qui pourraient se produire dans l’application. En détectant ces anomalies tôt dans le processus de développement, elles peuvent être corrigées avant que l’application ne soit déployée en production. 

• Réduction des coûts : En détectant les erreurs dès le début du développement, les tests fonctionnels permettent d'économiser du temps et de l'argent en évitant des corrections coûteuses à effectuer une fois le logiciel en production. Cette approche constitue d’ailleurs l’un des sept principes du test définis dans le Syllabus ISTQB. 

D’après les 7 principes généraux des tests de l’ISTQB :

Pour trouver des défauts tôt, les activités de tests devraient commencer aussi tôt que possible dans le cycle de développement du logiciel ou du système, et devraient être focalisées vers des objectifs définis.

Prenons un exemple concret pour illustrer cette situation :

Supposons que nous voulions développer une application permettant de visualiser une base de données d'utilisateurs. Malheureusement, lors de l'expression des besoins du projet, les champs exacts qui doivent être présents pour chaque utilisateur n'ont pas été précisément et exhaustivement définis.

Si cette lacune dans la spécification est identifiée dès le début du projet, il est relativement facile et rapide de corriger et de compléter la spécification en ajoutant les champs manquants. Cette correction peut être effectuée avant que l'implémentation ne commence, évitant ainsi des erreurs coûteuses dans le code et les fonctionnalités.

Cependant, si cette anomalie n'est découverte qu'à l'approche de la mise en production, après que l'application a déjà été développée, les conséquences peuvent être beaucoup plus coûteuses. Il faudra alors du temps pour identifier l'erreur, comprendre son impact sur l'ensemble du système, corriger le code et retester l'ensemble de l'application. Ce processus peut entraîner des retards dans le projet, des dépenses supplémentaires pour les corrections et aussi des insatisfactions chez les utilisateurs.

En somme, la détection précoce des anomalies lors de la spécification permet de limiter les risques d'erreurs coûteuses et de garantir une meilleure qualité du logiciel final.

Voici une explication graphique :

Voyons ce graphique en détail :

Une spécification est, au sens large, une explication des fonctionnalités, des comportements attendus et de leur objectif. Cela peut se représenter sous forme de maquette.

La production est la phase finale. C’est le processus par lequel un site web est rendu disponible au public (ou à un groupe restreint d’utilisateurs). Cela signifie que le site est prêt à être utilisé dans un environnement réel et qu’il est accessible via son adresse URL. La mise en production marque la fin du développement et des tests du site.

Voici d'autres enjeux de développement auxquels répondent les tests fonctionnels :

• Facilitation de la maintenance : Les tests fonctionnels permettent de s'assurer que les modifications apportées au code n'ont pas d'impact négatif sur les fonctionnalités existantes, ce qui facilite la maintenance et la mise à jour du code. Ce type de test s’appelle test de non-régression. Le test de non-régression sert aussi à vérifier que le logiciel continue de fonctionner correctement après chaque modification ou mise à jour, en prenant en compte les différentes variables qui pourraient influencer son comportement. Cela permet de s'assurer que les nouvelles fonctionnalités ajoutées et les corrections apportées n'ont pas introduit de nouveaux problèmes ou affecté négativement les fonctionnalités existantes. : Les tests fonctionnels permettent de s'assurer que les modifications apportées au code n'ont pas d'impact négatif sur les fonctionnalités existantes, ce qui facilite la maintenance et la mise à jour du code. Ce type de test s’appelle test de non-régression. Le test de non-régression sert aussi à vérifier que le logiciel continue de fonctionner correctement après chaque modification ou mise à jour, en prenant en compte les différentes variables qui pourraient influencer son comportement. Cela permet de s'assurer que les nouvelles fonctionnalités ajoutées et les corrections apportées n'ont pas introduit de nouveaux problèmes ou affecté négativement les fonctionnalités existantes.

• Documentation : Les tests fonctionnels servent également de documentation pour le code, en expliquant comment le code est censé fonctionner et en décrivant les différentes situations qui ont été testées.

• Confiance : Les tests fonctionnels offrent une certaine confiance dans le code, car ils permettent de s'assurer que celui-ci fonctionne comme prévu. En les automatisant, cela permet également de garantir que les erreurs détectées ne seront pas réintroduites dans le code par accident.

Comparez Selenium et Cypress

En décidant d’automatiser vos tests fonctionnels, vous allez rencontrer plusieurs solutions d’automatisation de test web, dont Selenium et Cypress. Comparons ces deux solutions :

Les deux outils offrent des capacités similaires en termes de fonctionnalités telles que la simulation de clics de souris, la saisie de texte, la navigation dans les pages et la vérification des résultats. Cependant, Cypress dispose de fonctionnalités supplémentaires telles que :

• Visualisation en temps réel des tests : Cypress propose une interface graphique en temps réel qui affiche les résultats des tests pendant leur exécution. Cela facilite le processus de débogage en permettant aux développeurs de voir les actions effectuées par les tests et les résultats en direct. La visualisation en temps réel permet également de mettre en pause un test afin de consulter l'état du DOM et de procéder au débogage. De plus, vous pouvez saisir des commandes directement dans la console pour tester des interactions supplémentaires.

• Exécution dans le navigateur : Contrairement à Selenium, qui utilise une architecture client-serveur avec les webdrivers, Cypress exécute les tests directement dans le navigateur. Cette approche permet à Cypress d'interagir plus efficacement avec l'application web, d'accéder aux ressources DOM, d'effectuer des actions plus rapidement et de réduire de manière native le nombre de tests instables (ou flaky).

• Synchronisation automatique : Cypress gère automatiquement la synchronisation entre les actions et les assertions dans les tests. Il attend que les actions soient terminées et que les éléments attendus soient disponibles avant de procéder aux assertions. Cela élimine le besoin d'ajouter des attentes explicites dans les tests (comme le "wait" dans Selenium), simplifiant ainsi le processus de création des tests et renforçant leur fiabilité.

En résumé

• Les tests fonctionnels testent les différentes fonctionnalités et permettent de maîtriser des enjeux variés, tels que la fiabilité et la facilitation de la maintenance.

• Les tests fonctionnels peuvent être exécutés manuellement ou de manière automatisée.

• Le test de non-régression a pour objectif de détecter les régressions entre différentes versions du logiciel afin de garantir la stabilité et la fiabilité du logiciel.

• Cypress est une solution d’automatisation de tests web puissante et conviviale. 

• Cypress ne supporte que TypeScript et JavaScript, contrairement à Selenium.

• Une fonctionnalité Cypress Cloud peut également être utilisée pour exécuter des tests sur des machines distantes.     

Nous avons vu les avantages de Cypress pour les tests automatisés. La prochaine étape est d’installer Cypress pour commencer à améliorer la confiance en notre produit.