Playwright est un framework pour les tests et l'automatisation Web. Il permet de tester Chromium, Firefox et WebKit avec une seule API. Playwright est conçu pour permettre une automatisation Web multi-navigateurs qui est toujours verte , performante , fiable et rapide .
| Linux | macOS | Fenêtres | |
|---|---|---|---|
| Chrome 131.0.6778.33 | ✅ | ✅ | ✅ |
| WebKit 18.0 | ✅ | ✅ | ✅ |
| Firefox 132.0 | ✅ | ✅ | ✅ |
L'exécution sans tête est prise en charge pour tous les navigateurs sur toutes les plateformes. Consultez la configuration système requise pour plus de détails.
Vous recherchez un dramaturge pour Python, .NET ou Java ?
Playwright dispose de son propre programme d'exécution de tests pour les tests de bout en bout, nous l'appelons Playwright Test.
Le moyen le plus simple de démarrer avec Playwright Test consiste à exécuter la commande init.
# Run from your project's root directory
npm init playwright@latest
# Or create a new project
npm init playwright@latest new-projectCela créera un fichier de configuration, ajoutera éventuellement des exemples, un workflow GitHub Action et un premier test example.spec.ts. Vous pouvez maintenant passer directement à la section de rédaction d'assertions.
Ajoutez une dépendance et installez des navigateurs.
npm i -D @playwright/test
# install supported browsers
npx playwright installVous pouvez éventuellement installer uniquement les navigateurs sélectionnés, voir installer les navigateurs pour plus de détails. Ou vous pouvez n'installer aucun navigateur et utiliser les canaux de navigateur existants.
Attente automatique . Le dramaturge attend que les éléments soient exploitables avant d'effectuer des actions. Il propose également un riche ensemble d’événements d’introspection. La combinaison des deux élimine le besoin de délais d’attente artificiels – l’une des principales causes des tests irréguliers.
Affirmations axées sur le Web . Les affirmations du dramaturge sont créées spécifiquement pour le Web dynamique. Les contrôles sont automatiquement retentés jusqu'à ce que les conditions nécessaires soient remplies.
Traçage . Configurez la stratégie de nouvelle tentative de test, capturez la trace d'exécution, les vidéos et les captures d'écran pour éliminer les flocons.
Les navigateurs exécutent du contenu Web appartenant à différentes origines dans différents processus. Playwright est aligné sur l'architecture des navigateurs modernes et exécute des tests hors processus. Cela libère Playwright des limitations typiques des testeurs en cours de processus.
Multiple tout . Testez des scénarios couvrant plusieurs onglets, plusieurs origines et plusieurs utilisateurs. Créez des scénarios avec différents contextes pour différents utilisateurs et exécutez-les sur votre serveur, le tout en un seul test.
Événements de confiance . Survolez des éléments, interagissez avec des contrôles dynamiques et produisez des événements fiables. Playwright utilise un véritable pipeline d'entrée de navigateur impossible à distinguer de l'utilisateur réel.
Testez les images, percez Shadow DOM. Les sélecteurs de dramaturge percent le Shadow DOM et permettent de saisir des images de manière transparente.
Contextes du navigateur . Playwright crée un contexte de navigateur pour chaque test. Le contexte du navigateur est équivalent à un tout nouveau profil de navigateur. Cela offre une isolation complète des tests sans aucune surcharge. La création d'un nouveau contexte de navigateur ne prend que quelques millisecondes.
Connectez-vous une fois . Enregistrez l'état d'authentification du contexte et réutilisez-le dans tous les tests. Cela évite les opérations de connexion répétitives dans chaque test, tout en offrant une isolation complète des tests indépendants.
Codegen . Générez des tests en enregistrant vos actions. Enregistrez-les dans n'importe quelle langue.
Inspecteur dramaturge . Inspectez la page, générez des sélecteurs, parcourez l'exécution du test, consultez les points de clic et explorez les journaux d'exécution.
Visionneuse de traces . Capturez toutes les informations pour enquêter sur l’échec du test. Playwright Trace contient un screencast d'exécution de test, des instantanés DOM en direct, un explorateur d'actions, une source de test et bien d'autres.
Vous recherchez un dramaturge pour TypeScript, JavaScript, Python, .NET ou Java ?
Pour savoir comment exécuter ces exemples de Playwright Test, consultez nos documents de démarrage.
Cet extrait de code accède à la page d'accueil de Playwright et enregistre une capture d'écran.
import { test } from '@playwright/test' ;
test ( 'Page Screenshot' , async ( { page } ) => {
await page . goto ( 'https://playwright.dev/' ) ;
await page . screenshot ( { path : `example.png` } ) ;
} ) ; Cet extrait émule Mobile Safari sur un appareil à une géolocalisation donnée, accède à maps.google.com, exécute l'action et prend une capture d'écran.
import { test , devices } from '@playwright/test' ;
test . use ( {
... devices [ 'iPhone 13 Pro' ] ,
locale : 'en-US' ,
geolocation : { longitude : 12.492507 , latitude : 41.889938 } ,
permissions : [ 'geolocation' ] ,
} )
test ( 'Mobile and geolocation' , async ( { page } ) => {
await page . goto ( 'https://maps.google.com' ) ;
await page . getByText ( 'Your location' ) . click ( ) ;
await page . waitForRequest ( / .*preview/pwa / ) ;
await page . screenshot ( { path : 'colosseum-iphone.png' } ) ;
} ) ; Cet extrait de code accède à example.com et exécute un script dans le contexte de la page.
import { test } from '@playwright/test' ;
test ( 'Evaluate in browser context' , async ( { page } ) => {
await page . goto ( 'https://www.example.com/' ) ;
const dimensions = await page . evaluate ( ( ) => {
return {
width : document . documentElement . clientWidth ,
height : document . documentElement . clientHeight ,
deviceScaleFactor : window . devicePixelRatio
}
} ) ;
console . log ( dimensions ) ;
} ) ; Cet extrait de code configure le routage des requêtes pour une page afin de consigner toutes les requêtes réseau.
import { test } from '@playwright/test' ;
test ( 'Intercept network requests' , async ( { page } ) => {
// Log and continue all network requests
await page . route ( '**' , route => {
console . log ( route . request ( ) . url ( ) ) ;
route . continue ( ) ;
} ) ;
await page . goto ( 'http://todomvc.com' ) ;
} ) ; 
