Tests de bout en bout avec Cypress

Il est important pour nous de prendre en compte la satisfaction de nos utilisateurs. C'est pourquoi nous avons décidé de vous faire découvrir les coulisses de l'outil Cypress, afin de tester notre plateforme afin d'améliorer au maximum l'expérience utilisateur.

‍

I. Pourquoi Cypress ?

‍

En plus des tests unitaires et de composants réalisés avec Jest Framework, nous recherchions un outil E2E (de bout en bout) pour simuler et tester l'intégralité du parcours utilisateur sur la plateforme Eden AI.

‍

Nous avions beaucoup entendu parler d'un outil appelé Selenium mais il semblait assez compliqué à intégrer pour les ingénieurs en automatisation non expérimentés.

‍

Nos recherches nous ont menés à un outil plus récent : Cyprès.

‍

Comparé à d'autres frameworks d'automatisation, Cypress est plus universel car il est écrit en JavaScript et basé sur Mocha et Chai. Il utilise également Node.js lors de son exécution dans les navigateurs. Javascript est le langage principal de notre équipe de développeurs front-end, ce choix semblait donc évident.

‍

Cypress se compose d'une application gratuite, open source, installée localement et d'un service de tableau de bord pour l'enregistrement des tests.

‍

Cypress propose également des fonctionnalités qui rendront nos tests plus efficaces :

‍

• Comme il attend automatiquement le chargement du DOM, nous n'avons pas besoin d'implémenter des attentes supplémentaires, qu'elles soient implicites ou explicites.
• Nous pouvons également tester la façon dont notre API interagit avec notre interface en exécutant des requêtes http avec Cypress.
• Le framework capture également l'exécution des tests en temps réel. Cela permet aux testeurs ou aux développeurs de passer la souris sur une commande spécifique dans le journal des commandes pour voir exactement ce qui s'est passé à cette étape particulière.
• Nous pouvons également effectuer des tests multi-navigateurs en exécutant des tests avec Cypress sur Firefox et les navigateurs de la famille Chrome, tels que Edge et Electron.
• Cypress peut également fournir des captures d'écran des échecs des tests, ce qui permet de détecter les défauts et de déboguer les applications rapidement et simplement.

‍

II. Comment intégrer Cypress à notre CI-CD ?

‍

En plus des tests ponctuels avec l'interface Cypress, nous voulions ajouter le processus de test E2E à notre CI/CD.

‍

Lorsqu'une nouvelle fonctionnalité est poussée vers une certaine branche de notre référentiel, Circle CI lancera des tests Cypress headless en adaptant l'environnement Cypress à la branche git actuelle. Par exemple : lorsqu'une fonctionnalité est ajoutée à notre environnement de staging, Cypress testera le parcours utilisateur sur l'application de staging.

‍

Nous devions également programmer des tests E2e automatiques chaque jour.

L'intégration de Cypress à Circle CI a été assez simple. Cypress fournit un orbe pour installer, mettre en cache et exécuter correctement Cypress avec très peu d'effort.

Circle CI exécute des tests Cypress

‍

En conclusion, nous avons utilisé un outil de test E2E appelé Cypress, qui nous a permis de tester notre plateforme afin d'offrir les meilleures performances à nos utilisateurs. Nous l'avons également ajouté à notre CI-CD, ce qui était un processus relativement simple. Si vous avez des questions, vous pouvez m'envoyer un e-mail : françois.humbert@edenai.co.

‍

‍