En 2024, la qualité des applications web revêt une importance croissante, car elle permet aux entreprises de se différencier de leurs concurrents. Une application de qualité est un atout majeur pour fidéliser les utilisateurs, renforcer l’image de marque, et garantir une expérience utilisateur optimale.
Cependant, la notion de qualité peut être perçue différemment selon les acteurs impliqués. Un développeur associera probablement la qualité à un code propre, modulaire et réutilisable, tandis qu’un manager s’intéressera davantage à l’impact commercial de l’application : son potentiel à attirer des clients et à générer des revenus. Ces deux visions sont complémentaires pour créer une application performante à tous les niveaux.
Par Fanny Velsin, ingénieure QA freelance, enseignante dans le domaine de la qualité et autrice aux Editions ENI du livre « Testez votre application web avec Cypress ».
La qualité d’une application web se réfère à plusieurs critères techniques et fonctionnels, tels que :
- Fiabilité : l’application doit fonctionner sans erreur, quelles que soient les conditions d’utilisation.
- Performance : des temps de réponse rapides pour offrir une bonne expérience utilisateur.
- Sécurité : l’application doit protéger les données des utilisateurs et résister aux cyberattaques.
- Expérience utilisateur (UX) : une interface intuitive et agréable pour fidéliser les utilisateurs.
- Compatibilité : l’application doit fonctionner sur un maximum de navigateurs et de dispositifs.
- Maintenabilité : il est important que le code soit facile à mettre à jour et à améliorer dans le temps.
- Fonctionnalités : l’application doit répondre aux besoins de ses utilisateurs et évoluer en fonction des attentes du marché.
Dans un environnement numérique en constante évolution, il est indispensable de rester à jour concernant les attentes des utilisateurs, les nouvelles tendances technologiques et les vulnérabilités émergentes. L’une des principales préoccupations actuelles est la sécurité, notamment face aux menaces croissantes comme le vol de données et les attaques ciblées.
J’ai rédigé le livre “Testez votre application web avec Cypress”, dans lequel j’explore la question des vulnérabilités des applications et la manière dont Cypress peut vous aider à les identifier et à les corriger. Cypress est un outil populaire pour tester les applications web, en particulier pour assurer leur qualité à travers des tests automatisés.
C’est un challenge que je me suis imposé : sortir des sentiers déjà explorés par d’autres personnes en incluant une nouvelle notion, à savoir la sécurité, et pousser l’outil à ces limites tout en conservant (?) l’utilisation classique.
Les vulnérabilités communes que vous pouvez rencontrer dans une application web incluent :
- CSRF (Cross-Site Request Forgery) : attaque qui force un utilisateur à effectuer des actions indésirables sur une application.
- XSS (Cross-Site Scripting) : faille qui permet à un attaquant d’injecter du contenu malveillant dans une page web.
- Injection SQL : technique qui consiste à insérer du code SQL malveillant dans une requête pour accéder à des données sensibles.
Ces vulnérabilités peuvent non seulement nuire à la réputation de votre entreprise mais aussi entraîner des pertes financières importantes si elles ne sont pas détectées et corrigées à temps. Il est donc nécessaire de tester régulièrement vos applications pour vous assurer qu’elles sont sécurisées.
Outre les questions de sécurité, le livre aborde également des aspects fonctionnels, tels que la conformité au RGPD (Règlement Général sur la Protection des Données) et le bon fonctionnement des formulaires, en veillant à ce qu’ils répondent aux spécifications définies. Ces points sont souvent négligés, mais ils sont une base solide pour garantir une bonne expérience utilisateur et éviter des amendes en cas de non-respect des réglementations.
CI/CD et tests dans le cloud
Un autre aspect important de la qualité des applications web est la mise en place d’une infrastructure de tests continue, appelée CI (Continuous Integration) et CD (Continuous Deployment). Cypress s’intègre facilement avec des outils comme Jenkins ou GitLab, vous permettant d’automatiser les tests de votre application à chaque modification du code.
De plus, avec Cypress Cloud, vous pouvez exécuter vos tests directement dans le cloud, ce qui facilite la gestion de grandes batteries de tests et améliore l’efficacité de votre processus de développement. Les tests dans le cloud permettent également de répartir les ressources de manière plus efficace, en s’assurant que les tests soient réalisés rapidement, même sur des projets de grande envergure.
Outils complémentaires pour améliorer vos tests
Pour maximiser la couverture des tests et vous assurer que chaque aspect de votre application est bien testé, il est recommandé d’utiliser des outils complémentaires à Cypress, tels que Gherkin et Cucumber. Ces outils vous permettent de créer des scénarios de test sous une forme simple et lisible, en utilisant une syntaxe Given/When/Then. Cela facilite la collaboration entre les équipes techniques et non techniques, en permettant à tout le monde de comprendre les cas de test et les spécifications du produit.
En outre, l’intégration d’outils d’analyse de sécurité, tels que OWASP ou SQLMap, vous permet de détecter les vulnérabilités potentielles avant qu’elles ne soient exploitées par des attaquants.
Les limites de Cypress et ses alternatives
Bien que Cypress soit un outil puissant et polyvalent, il n’est pas exempt de limitations. Par exemple, il peut être moins efficace pour tester des applications complexes utilisant certaines technologies spécifiques, ou pour simuler des scénarios d’utilisateurs avancés impliquant plusieurs interactions à la fois. Dans ces cas, il peut être nécessaire de compléter vos tests avec d’autres solutions plus spécialisées.
Le livre explore ces limites en détail et vous donne des conseils sur la manière de les contourner, ainsi que sur les outils supplémentaires que vous pouvez utiliser pour pallier ces restrictions.
Vous y verrez également des recommandations dont voici un extrait :
Cypress recommande l’utilisation d’attributs data-* pour vos sélecteurs, et cette approche est considérée comme une meilleure pratique dans le développement et le test de logiciels modernes.
Les attributs sont des spécifications qui définissent les propriétés des éléments HTML. Ils sont insérés dans les balises de début d’un élément et servent à fournir des informations supplémentaires sur cet élément. Par exemple, dans
<input type=”text”>
type est un attribut qui indique le type de l’élément input.
Les attributs data-* sont conçus pour être utilisés spécifiquement pour les sélecteurs dans les tests, plutôt que pour le style ou le comportement du document. L’avantage principal de cette approche est que ces attributs ne changent pas avec les modifications du style ou de la structure HTML et restent stables, rendant les tests plus fiables.
Préférez les attributs data-* aux sélecteurs CSS traditionnels :
- Isolation des changements de style et de comportement :
- Les attributs data-* sont indépendants de la présentation visuelle et du comportement de l’application. Ils ne sont pas affectés par les modifications de style (CSS) ou les changements de logique (JavaScript), contrairement aux classes CSS ou aux identifiants qui peuvent souvent être utilisés à des fins de stylisation ou de scripting.
- Cela signifie qu’un élément peut être reformaté visuellement ou avoir des modifications comportementales sans affecter la capacité du test à interroger cet élément, car l’attribut data-* reste constant.
- Amélioration de la lisibilité et de la maintenabilité des tests :
- Les attributs data-* peuvent être utilisés pour ajouter du contexte aux éléments, facilitant la compréhension de ce que fait un élément ou de sa place dans le flux de l’application. Cela rend les tests plus lisibles, car les sélecteurs reflètent plus clairement le rôle des éléments dans l’application.
- Ils contribuent à une base de code plus propre et plus maintenable. Comme ils sont destinés à des fins de test, les attributs data-* ne se mélangent pas avec les sélecteurs utilisés pour le styling, évitant ainsi toute confusion ou conflit potentiel.
- Facilité de collaboration entre les équipes de développement et de QA :
- Utiliser des attributs data-* nécessite une collaboration entre les développeurs (qui ajoutent ces attributs au code) et les QA (qui écrivent des tests en utilisant ces attributs). Cette collaboration rapprochée peut améliorer la compréhension commune des fonctionnalités et de la structure de l’application, réduisant le risque d’incohérences et d’erreurs.
- Cela permet également une stratégie de test plus proactive, les attributs étant ajoutés en tenant compte des nécessités de test dès le début du processus de développement.
Par exemple, considérez un bouton de soumission dans un formulaire. Au lieu de s’appuyer sur la classe ou l’ID, qui peuvent changer en fonction du style ou de la structure, nous pourrions utiliser un attribut data-* comme suit :
<button data-test=”submit-button”>Submit</button>
Et dans votre test Cypress, vous sélectionneriez cet élément en utilisant :
cy.get(‘[data-test=”submit-button”]’).click();
Cette méthode garantit que tant que le bouton conserve son rôle fonctionnel (c’est-à-dire la soumission d’un formulaire), le test restera valide indépendamment des modifications apportées au style ou à la logique de script de l’élément. C’est une stratégie particulièrement puissante pour les applications évolutives ou celles qui subissent des changements fréquents, car elle minimise le besoin de réviser les tests après des révisions de design ou des refontes fonctionnelles.
Cet extrait vous invitera, je l’espère à lire l’ouvrage pour apprendre ce que vous pouvez ajouter à vos tests. Peut-être vous donnera-t-il envie de tester (!) voire d’adopter Cypress.
Fanny VELSIN est ingénieur QA freelance et enseignante dans le domaine de la qualité, spécialisée dans le test logiciel et web, avec plus de dix ans d’expérience. Elle est experte dans l’amélioration des programmes web et logiciels grâce à ses compétences certifiées et à sa capacité à analyser et résoudre des problèmes complexes. Au quotidien, elle aide diverses entreprises à optimiser la qualité de leurs produits numériques, notamment en utilisant Cypress.