Outils de Chrome pour des tests automatisés fluides

Les tests sont importants. Il s'agit d'une étape clé avant de livrer ce que vous avez créé aux utilisateurs (qu'il s'agisse d'un site ou d'une application entiers, ou d'une nouvelle fonctionnalité) pour vérifier qu'il fonctionne comme prévu. Toutefois, de nombreux tests sont encore effectués manuellement, et des collègues ou des ingénieurs de test sont invités à tester la nouvelle fonctionnalité et à signaler les problèmes.

Bien que ces tests manuels puissent mettre en évidence certaines classes de problèmes, ils peuvent en manquer beaucoup d'autres. Les personnes qui effectuent les tests peuvent manquer des cas particuliers ou ne pas réussir à tester un parcours particulier dans l'application. De plus, elles ne disposent pas de toutes les informations dont vous disposiez lorsque vous avez écrit le code. Elles ne connaissent pas les problèmes spécifiques que vous avez inclus pour éviter. Et, au fil du temps, et à mesure que de nouvelles fonctionnalités seront ajoutées, vont-ils revenir en arrière et tester à nouveau toutes ces choses qui fonctionnaient auparavant pour s'assurer que les modifications ne les ont pas endommagées ?

C'est pourquoi l'équipe Chrome accorde une grande importance aux tests automatisés. En utilisant une suite de tests qui vérifie de manière fiable et répétée que votre fonctionnalité ne présente pas de défaillance, vous pouvez être sûr que chaque détail est testé, maintenant et après le développement futur. Vos connaissances en tant que développeur d'une fonctionnalité sont encapsulées dans un test.

Cependant, nous savons que les tests automatisés peuvent être difficiles. C'est pourquoi l'équipe Chrome met à votre disposition les outils et conseils suivants pour vous faciliter la tâche.

Marionnettiste

Puppeteer est une bibliothèque Node.js. Elle vous permet d'automatiser Chrome, Chromium et Firefox à l'aide d'une API de haut niveau facile à utiliser.

Bien que cette API ait été basée à l'origine sur le protocole Chrome DevTools, l'objectif est de faire du nouveau protocole WebDriver BiDi avancé la base de Puppeteer d'ici la fin de l'année. WebDriver BiDi, co-créé par tous les principaux fournisseurs de navigateurs, simplifie de nombreux cas d'utilisation de l'automatisation et en permet de nombreux autres, et est compatible avec tous les navigateurs.

.

Mais vous n'avez pas besoin d'attendre. L'API Puppeteer permet déjà de nombreux cas d'utilisation d'automatisation, qui ne feront qu'améliorer avec WebDriver BiDi. Des tests à l'exploration visuelle et à l'automatisation des processus, vous pouvez faire beaucoup de choses avec des fonctionnalités telles que les interactions sur les pages, l'interception des requêtes et les captures d'écran. Vous pouvez même l'utiliser pour tester vos modèles d'IA Web dans le cloud à l'aide de WebGPU et de WebGL.

Puppeteer est également utilisé par des outils tels que WebdriverIO, un framework de test de navigateur complet, et Privacy Sandbox Analysis Tool, qui vous permet de mieux comprendre l'utilisation des cookies et des données utilisateur sur votre site.

Chrome Headless

Si vous avez déjà automatisé Chrome à l'aide de Puppeteer, vous avez peut-être remarqué qu'aucune fenêtre de navigateur ne s'affiche pendant l'exécution des tests. Par défaut, Puppeteer démarre Chrome en mode headless. Cela signifie qu'aucune fenêtre de navigateur n'est ouverte pendant l'exécution de votre automatisation.

Mais saviez-vous que le mode sans tête de Chrome n'était pas simplement Chrome sans fenêtre, mais en réalité une version de Chrome gérée complètement séparément ? Pendant longtemps, cela a entraîné de la confusion et des bugs et problèmes difficiles à suivre.

À partir de Chrome 112, nous avons introduit un nouveau mode headless, désormais basé sur le même code base que Chrome standard. Cela permet non seulement de réduire la confusion précédente, mais aussi d'offrir des fonctionnalités qui n'étaient pas possibles auparavant, comme l'utilisation d'extensions lors de l'automatisation.

Puppeteer utilise ce nouveau mode headless par défaut depuis la version 22. Si vous utilisez Chrome Headless via d'autres solutions d'automatisation, vous pouvez forcer le nouveau mode headless à l'aide de l'option de ligne de commande --headless=new.

Bien que le nouveau mode headless de Chrome soit plus puissant, il n'est pas aussi léger que l'ancien mode headless. Si vous êtes très limité en ressources ou si vous n'avez pas besoin de toutes les fonctionnalités de Chrome, vous pouvez utiliser l'ancien mode headless en tant que chrome-headless-shell.

Chrome for Testing

Lorsque vous effectuez des tests, vous avez besoin d'un contrôle précis de votre environnement de test: le système d'exploitation, le navigateur et la version du navigateur. Avec la mise à jour automatique de Chrome, cela peut être difficile.

C'est pourquoi nous avons créé Chrome pour les tests, une version de Chrome sans mise à jour automatique, publiée avec chaque version de Chrome, pour tous les principaux systèmes d'exploitation, accessible à partir d'une archive versionnée. Vous pouvez ainsi exécuter vos workflows d'automatisation sur une version spécifique de Chrome sans trop de manipulations.

Vous pouvez accéder aux binaires Chrome for Testing depuis le tableau de bord de disponibilité de Chrome for Testing, l'API JSON ou l'utilitaire de ligne de commande Puppeteer.


Puppeteer, le mode headless mis à jour de Chrome et Chrome for Testing ne sont qu'une partie du travail que notre équipe effectue actuellement pour vous permettre d'automatiser le navigateur et d'exécuter des tests aussi facilement que possible. Les outils associés, comme l'enregistreur DevTools, vous aident à créer des tests: enregistrez un parcours utilisateur dans Chrome et le repassez dans Puppeteer.

En savoir plus sur les tests sur web.dev

Les outils présentés dans cet article vous aideront à améliorer vos tests automatisés. Toutefois, si vous débutez, il peut sembler que vous avez beaucoup à comprendre et à apprendre. Nous avons donc créé un nouveau cours en 10 modules intitulé Apprendre à tester sur web.dev. Ce cours approfondi couvre les concepts de base des tests, où et comment ils sont exécutés, les types de tests et ce qu'il faut tester. C'est un excellent point de départ pour votre parcours de test. Une fois que vous avez acquis les bases, n'hésitez pas à passer à notre collection sur l'automatisation des tests, qui propose des analyses approfondies et des conseils pratiques sur des questions de test plus spécifiques.