Démarrage rapide : exécuter des tests de bout en bout à grande échelle à l’aide de Microsoft Playwright Testing en préversion
Dans ce guide de démarrage rapide, vous allez découvrir comment exécuter vos tests Playwright avec des navigateurs cloud hautement parallèles et résoudre facilement les problèmes liés aux tests ayant échoué à l’aide de Microsoft Playwright Testing en préversion. Utilisez l’infrastructure cloud pour valider votre application sur différents navigateurs, appareils et systèmes d’exploitation. Publiez les résultats et les artefacts générés par Playwright sur le service et affichez-les dans le portail de service.
Une fois ce guide de démarrage rapide terminé, vous disposez d’un espace de travail Microsoft Playwright Testing pour exécuter vos tests Playwright à grande échelle et afficher les résultats et artefacts des tests dans le portail de service.
Important
Microsoft Playwright Testing est actuellement en préversion. Pour connaître les conditions juridiques qui s’appliquent aux fonctionnalités Azure en version bêta, en préversion ou plus généralement non encore en disponibilité générale, consultez l’Avenant aux conditions d’utilisation des préversions de Microsoft Azure.
Prérequis
- Compte Azure avec un abonnement actif. Si vous n’avez pas d’abonnement Azure, créez un compte gratuit avant de commencer.
- Votre compte Azure a besoin des rôles Propriétaire, Contributeur ou de l’un des rôles d’administrateur classique.
- Un projet Playwright. Si vous n’avez pas de projet, créez-en un en vous reportant à la documentation Bien démarrer avec Playwright ou utilisez notre exemple de projet Microsoft Playwright Testing.
- Azure CLI. Si vous ne disposez pas d’Azure CLI, consultez Installer Azure CLI.
Créer un espace de travail
Pour démarrer l’exécution de vos tests Playwright à grande échelle sur les navigateurs cloud, vous commencez par créer un espace de travail Microsoft Playwright Testing dans le portail Playwright.
Connectez-vous au portail Playwright avec votre compte Azure.
Si vous disposez déjà d’un espace de travail, sélectionnez un espace de travail existant et passez à l’étape suivante.
Conseil
Si vous avez plusieurs espaces de travail, vous pouvez basculer vers un autre espace de travail en sélectionnant son nom en haut de la page, puis en sélectionnant Gérer tous les espaces de travail.
Si vous n’avez pas encore d’espace de travail, sélectionnez + Nouvel espace de travail, puis fournissez les informations suivantes :
Champ Description Nom de l’espace de travail Entrez un nom unique pour identifier votre espace de travail.
Le nom doit contenir uniquement des caractères alphanumériques et sa longueur doit être comprise entre 3 et 64 caractères.Abonnement Azure Sélectionnez l’abonnement Azure que vous souhaitez utiliser pour cet espace de travail Microsoft Playwright Testing. Région Sélectionnez un emplacement géographique pour héberger votre espace de travail.
Il s’agit de l’emplacement où les données de la série de tests sont stockées pour l’espace de travail.
Sélectionnez Créer un espace de travail pour créer l’espace de travail dans votre abonnement.
Quand vous créez l’espace de travail, un nouveau groupe de ressources et une ressource Microsoft Playwright Testing Azure sont créés dans votre abonnement Azure.
Une fois l’espace de travail créé, vous êtes redirigé vers le guide d’installation.
Installer le package Microsoft Playwright Testing
Pour utiliser le service, installez le package Microsoft Playwright Testing.
npm init @azure/microsoft-playwright-testing@latest
Cela génère un fichier playwright.service.config.ts qui sert à :
- Dirige et authentifier Playwright auprès du service Microsoft Playwright Testing.
- Ajoute un rapporteur pour publier les résultats des tests et les artefacts.
Si vous disposez déjà de ce fichier, le package vous demande de le remplacer.
Pour utiliser le service, installez le package Microsoft Playwright Testing.
dotnet add package Azure.Developer.MicrosoftPlaywrightTesting.NUnit --prerelease
Configurer le point de terminaison de la région de service
Dans votre configuration, vous devez fournir le point de terminaison de service spécifique à la région. Le point de terminaison dépend de la région Azure sélectionnée lors de la création de l’espace de travail.
Pour obtenir l’URL du point de terminaison de service, procédez comme suit :
Dans Ajouter un point de terminaison de région dans votre configuration, copiez le point de terminaison de région dans votre espace de travail.
L’URL du point de terminaison correspond à la région Azure que vous avez sélectionnée lors de la création de l’espace de travail. Vérifiez que cette URL est disponible dans la variable d’environnement
PLAYWRIGHT_SERVICE_URL.
Configurer votre environnement
Pour configurer votre environnement, vous devez configurer la variable d’environnement PLAYWRIGHT_SERVICE_URL en définissant la valeur obtenue au cours des étapes précédentes.
Nous vous recommandons d’utiliser le module dotenv pour gérer votre environnement. Avec dotenv, vous définissez les variables d’environnement dans le fichier .env.
Ajoutez le module
dotenvà votre projet :npm i --save-dev dotenvCréez un fichier
.envà côté du fichierplaywright.config.tsdans votre projet Playwright :PLAYWRIGHT_SERVICE_URL={MY-REGION-ENDPOINT}Veillez à remplacer l’espace réservé
{MY-REGION-ENDPOINT}par la valeur que vous avez copiée précédemment.
Définir la configuration du service
Créez un fichier PlaywrightServiceSetup.cs dans votre projet avec le contenu suivant.
using Azure.Developer.MicrosoftPlaywrightTesting.NUnit;
namespace PlaywrightTests; // Remember to change this as per your project namespace
[SetUpFixture]
public class PlaywrightServiceSetup : PlaywrightServiceNUnit {};
Remarque
Vérifiez que votre projet utilise Microsoft.Playwright.NUnit version 1.47 ou ultérieure.
Configurer l’authentification
Pour exécuter vos tests Playwright dans votre espace de travail Microsoft Playwright Testing, vous devez authentifier le client Playwright où vous exécutez les tests avec le service. Il peut s’agir de votre machine de développement local ou de votre machine CI.
Le service offre deux méthodes d’authentification : Microsoft Entra ID et les Jetons d’accès.
Microsoft Entra ID utilise vos informations d’identification Azure, nécessitant une connexion à votre compte Azure pour un accès sécurisé. Vous pouvez également générer un jeton d’accès à partir de votre espace de travail Playwright et l’utiliser dans votre configuration.
Configurer l’authentification à l’aide de Microsoft Entra ID
Microsoft Entra ID est l’authentification par défaut recommandée pour le service. À partir de votre machine de développement locale, vous pouvez utiliser Azure CLI pour vous connecter
az login
Remarque
Si vous faites partie de plusieurs tenants Microsoft Entra, veillez à vous connecter au tenant auquel appartient votre espace de travail. Vous pouvez obtenir l’ID de tenant à partir du Portail Azure. Consultez Trouver votre tenant Microsoft Entra. Une fois l’ID obtenu, connectez-vous à l’aide de la commande az login --tenant <TenantID>
Configurer l’authentification à l’aide de jetons d’accès
Vous pouvez générer un jeton d’accès à partir de votre espace de travail Playwright Testing et l’utiliser dans votre configuration. Toutefois, nous recommandons vivement Microsoft Entra ID pour l’authentification en raison de sa sécurité renforcée. Les jetons d’accès, bien que pratiques, fonctionnent comme des mots de passe de longue durée et sont plus susceptibles d’être compromis.
L’authentification à l’aide de jetons d’accès est désactivée par défaut. Pour l’utiliser, Activer l’authentification basée sur les jetons d’accès
Attention
Nous vous recommandons vivement d’utiliser Microsoft Entra ID pour l’authentification au service. Si vous utilisez des jetons d’accès, consultez Comment gérer les jetons d’accès
Activer les artefacts dans votre configuration Playwright
Dans le fichier playwright.config.ts de votre projet, vérifiez que vous collectez tous les artefacts requis.
use: {
trace: 'on-first-retry',
video:'retain-on-failure',
screenshot:'on'
}
Activez les artefacts tels que la capture d’écran, les vidéos et les traces à capturer par Playwright.
- Pour les captures d’écran, consultez Captures d’écran.
- Pour les vidéos, consultez Enregistrer des vidéos pour vos tests.
- Pour les traces, consultez Enregistrement d’une trace.
Une fois que vous avez collecté ces artefacts, attachez-les à TestContext pour vous assurer qu’ils sont disponibles dans vos rapports de test. Pour plus d’informations, consultez notre exemple de projet pour NUnit.
Exécuter vos tests à grande échelle et résoudre facilement les problèmes avec Microsoft Playwright Testing
Vous avez maintenant préparé la configuration pour exécuter vos tests Playwright dans le cloud à l’aide de Microsoft Playwright Testing. Vous pouvez utiliser l’interface CLI Playwright pour exécuter vos tests ou utiliser l’extension Playwright Test pour Visual Studio Code.
Exécuter un test unique avec le service
Votre facturation de Microsoft Playwright Testing est basée sur le nombre total de minutes de test et le nombrer de résultats des tests publiés. Si vous êtes un nouvel utilisateur ou que vous démarrez avec un essai gratuit, vous pouvez commencer par exécuter un test unique à grande échelle à la place de votre suite de tests complète afin d’éviter d’épuiser les limites de votre essai gratuit.
Remarque
La fonctionnalité de rapport est activée par défaut pour les espaces de travail existants. Elle est actuellement déployée par phases. Cette opération prendra quelques jours. Pour éviter les défaillances, confirmez que le paramètre Rich diagnostics using reporting est ACTIVÉ pour votre espace de travail avant de continuer. Consultez Activer les rapports pour l’espace de travail.
Après avoir validé que le test s’exécute correctement, vous pouvez augmenter progressivement la charge de test en exécutant davantage de tests avec le service.
Pour exécuter un test unique Playwright à l’aide de Microsoft Playwright Testing, procédez ainsi :
Pour utiliser l’interface CLI Playwright pour exécuter vos tests avec Microsoft Playwright Testing, passez le fichier de configuration du service en tant que paramètre de ligne de commande.
Ouvrez une fenêtre de terminal.
Entrez la commande suivante pour exécuter votre test Playwright sur les navigateurs distants de votre espace de travail :
Remplacez l’espace réservé de texte
{name-of-file.spec.ts}par le nom de votre fichier de spécification de test.npx playwright test {name-of-file.spec.ts} --config=playwright.service.config.tsUne fois le test terminé, vous pouvez afficher l’état du test dans le terminal.
Running 1 test using 1 worker 1 passed (2.2s) To open last HTML report run: npx playwright show-report
Vous pouvez maintenant exécuter plusieurs tests avec le service ou exécuter toute votre suite de tests sur des navigateurs distants.
Attention
Selon la taille de votre suite de tests, vous pouvez être soumis à des frais supplémentaires pour les minutes de test allant au-delà de vos minutes de test gratuites allouées et vos résultats des tests gratuits.
Exécutez une suite de tests complète avec le service
Maintenant que vous avez validé que vous pouvez exécuter un test unique avec Microsoft Playwright Testing, vous pouvez exécuter une suite de tests Playwright complète à grande échelle.
Pour exécuter une suite de tests Playwright complète à l’aide de Microsoft Playwright Testing, procédez ainsi :
Lorsque vous exécutez plusieurs tests Playwright ou une suite de tests complète avec Microsoft Playwright Testing, vous pouvez éventuellement spécifier le nombre de travailleurs parallèles en tant que paramètre de ligne de commande.
Ouvrez une fenêtre de terminal.
Entrez la commande suivante pour exécuter votre suite de tests Playwright sur les navigateurs distants de votre espace de travail :
npx playwright test --config=playwright.service.config.ts --workers=20Selon la taille de votre suite de tests, cette commande exécute vos tests sur 20 workers parallèles maximum.
Une fois le test terminé, vous pouvez afficher l’état du test dans le terminal.
Running 6 tests using 6 workers 6 passed (18.2s) Test report: https://playwright.microsoft.com/workspaces/<workspace-id>/runs/<run-id>
Exécutez des tests Playwright sur les navigateurs gérés par le service et consultez les résultats dans le portail unifié à l’aide de la configuration créée ci-dessus.
dotnet test --settings:.runsettings --logger "microsoft-playwright-testing" -- NUnit.NumberOfTestWorkers=20
Les paramètres de votre série de tests sont définis dans le fichier .runsettings. Consultez le guide pratique pour utiliser les options de package de service.
Une fois la série de tests terminée, vous pouvez afficher l’état des tests dans le terminal.
Starting test execution, please wait...
Initializing reporting for this test run. You can view the results at: https://playwright.microsoft.com/workspaces/<workspace-id>/runs/<run-id>
A total of 100 test files matched the specified pattern.
Test Report: https://playwright.microsoft.com/workspaces/<workspace-id>/runs/<run-id>
Passed! - Failed: 0, Passed: 100, Skipped: 0, Total: 100, Duration: 59 s - PlaywrightTestsNUnit.dll (net7.0)
Workload updates are available. Run `dotnet workload list` for more information.
Afficher les exécutions et les résultats de test dans le portail Playwright
Vous pouvez désormais résoudre les problèmes liés aux cas de test ayant échoué dans le portail Playwright.
À la fin de votre série de tests, un lien vers le portail Playwright est généré. Ouvrez ce lien pour voir les résultats des tests détaillés et les artefacts associés. Le portail affiche des informations essentielles, notamment :
- Détails de build CI
- État général de la série de tests
- ID de commit lié à la série de tests
Le portail Playwright fournit toutes les informations nécessaires à la résolution des problèmes. Vous pouvez :
- Basculer entre les nouvelles tentatives.
- Visualiser les journaux des erreurs détaillés, les étapes de test ainsi que les artefacts joints, par exemple des captures d’écran ou des vidéos.
- Accéder directement à la Visionneuse de trace pour une analyse plus approfondie.
La Visionneuse de trace vous permet de parcourir visuellement l’exécution de votre test. Vous pouvez :
- Utiliser la chronologie pour pointer sur des étapes individuelles, ce qui permet de révéler l’état de la page avant et après chaque action.
- Inspecter les journaux détaillés, les captures instantanées DOM, l’activité réseau, les erreurs et la sortie de la console pour chaque étape.
À la fin de votre série de tests, vous obtenez un lien vers le portail Playwright dans votre terminal. Ouvrez ce lien pour voir les résultats des tests détaillés et les artefacts associés. Le portail affiche des informations essentielles, notamment :
- Détails de build CI
- État général de la série de tests
- ID de commit lié à la série de tests
Le portail Playwright fournit toutes les informations nécessaires à la résolution des problèmes. Vous pouvez :
- Visualiser les journaux des erreurs détaillés ainsi que les artefacts joints, par exemple des captures d’écran ou des vidéos.
- Accéder directement à la Visionneuse de trace pour une analyse plus approfondie.
Remarque
Certaines métadonnées, telles que le propriétaire, la description et la catégorie, ne sont actuellement pas affichées sur le tableau de bord du service. Si vous souhaitez voir des informations supplémentaires, envoyez un problème GitHub dans notre dépôt.
La Visionneuse de trace vous permet de parcourir visuellement l’exécution de votre test. Vous pouvez :
- Utiliser la chronologie pour pointer sur des étapes individuelles, ce qui permet de révéler l’état de la page avant et après chaque action.
- Inspecter les journaux détaillés, les captures instantanées DOM, l’activité réseau, les erreurs et la sortie de la console pour chaque étape.
Conseil
Vous pouvez utiliser les fonctionnalités du service Microsoft Playwright Testing de manière indépendante. Vous pouvez publier les résultats des tests dans le portail sans utiliser la fonctionnalité des navigateurs hébergés sur le cloud. Vous pouvez également utiliser uniquement des navigateurs hébergés sur le cloud pour accélérer votre suite de tests sans publier les résultats des tests.
Remarque
Les résultats des tests et les artefacts que vous publiez sont conservés sur le service pendant 90 jours. Après cela, ils sont automatiquement supprimés.
Optimiser la configuration des workers parallèles
Une fois que vos tests s’exécutent correctement avec le service, essayez de varier le nombre de workers parallèles afin de déterminer la configuration optimale pour minimiser la durée d’exécution des tests.
Le service Microsoft Playwright Testing permet d’exécuter jusqu’à 50 workers parallèles. Plusieurs facteurs ont un impact sur la meilleure configuration pour votre projet, notamment le processeur, la mémoire et les ressources réseau de votre ordinateur client, la capacité de gestion de la charge de l’application cible et le type d’actions effectuées dans vos tests.
Vous pouvez spécifier le nombre de workers parallèles sur la ligne de commande CLI Playwright ou configurer la propriété workers dans le fichier de configuration du service Playwright.
Vous pouvez spécifier le nombre de Workers parallèles sur la ligne de commande de l’interface CLI de Playwright ou configurer la propriété NumberOfTestWorkers dans le fichier .runsettings.
Découvrez comment déterminer la configuration optimale pour optimiser l’exécution de la suite de tests.
Étape suivante
Vous avez créé un espace de travail Microsoft Playwright Testing dans le portail Playwright et exécuté vos tests Playwright sur des navigateurs cloud avec succès.
Passez au guide de démarrage rapide suivant pour configurer des tests de bout en bout en continu grâce aux tests Playwright dans votre flux de travail CI/CD.