Playwright MCP donne à un agent IA un vrai navigateur qu'il peut piloter : ouvrir une page, la lire, cliquer, saisir du texte, remplir des formulaires, prendre des captures d'écran. C'est le serveur de Microsoft, bâti sur la même bibliothèque Playwright qui fait tourner une grande partie des tests end-to-end du web, et avec 39 614 étoiles GitHub, c'est l'un des MCP servers les plus installés qui existent.
Il en est aussi toujours à la version 0.0.x, et il a beaucoup changé. Les flags sur lesquels reposent les tutoriels de 2025 ont disparu, les outils sont désormais regroupés derrière --caps, et en 0.0.85 une navigation renvoie un chemin de fichier au lieu de l'arbre de la page. Nous avons exécuté la version 0.0.85, publiée le 9 novembre 2026, via le CLI de MCP Inspector sur macOS le 14 novembre 2026, et compté ce qu'elle expose réellement.
Installation
Vous avez besoin de Node.js et d'un client MCP. Le README et npm indiquent Node 18 ou plus récent ; playwright.dev indique 20 ou plus récent. Utilisez 20.
Claude Code
claude mcp add playwright npx @playwright/mcp@latest
Codex
codex mcp add playwright npx "@playwright/mcp@latest"
VS Code
code --add-mcp '{"name":"playwright","command":"npx","args":["@playwright/mcp@latest"]}'
Claude Desktop, Cursor, Windsurf et la plupart des autres acceptent le même JSON. Dans Cursor, il se place sous Settings, MCP ; dans Claude Desktop, dans claude_desktop_config.json :
{
"mcpServers": {
"playwright": {
"command": "npx",
"args": ["@playwright/mcp@latest"]
}
}
}
Les options vont dans args après le nom du paquet, par exemple ["@playwright/mcp@latest", "--headless", "--isolated"]. Notre générateur de configuration écrit l'entrée pour chaque client si vous en utilisez plusieurs.
Le premier prompt suggéré par playwright.dev est un bon test : « Navigate to https://demo.playwright.dev/todomvc and add a few todo items. » Une fenêtre de navigateur s'ouvre, car Playwright MCP s'exécute en mode headed par défaut, et vous pouvez le regarder travailler.
Comment il perçoit une page
Playwright MCP n'envoie pas de captures d'écran au modèle par défaut. Il envoie l'instantané d'accessibilité de Playwright : une arborescence YAML de rôles, de noms et de texte, où chaque élément sur lequel l'agent peut agir porte une ref telle que [ref=e5]. Le modèle lit l'arborescence, choisit une ref et appelle browser_click avec celle-ci. C'est pourquoi cela fonctionne avec des modèles dépourvus de vision et pourquoi les clics atteignent le bon élément même lorsque la mise en page bouge.
Les instantanés peuvent être volumineux. Nous avons navigué vers trois pages avec la 0.0.85 et mesuré les fichiers d'instantané qu'il a enregistrés :
| Page | Taille de l'instantané | Refs d'éléments |
|---|---|---|
| demo.playwright.dev/todomvc | 690 octets | 12 |
| Page de dépôt GitHub (microsoft/playwright-mcp) | 62 785 octets | 807 |
| Article Wikipédia sur MCP | 88 162 octets | 721 |
Même page GitHub avec --mobile |
54 053 octets | 683 |
Une page réelle atteint des dizaines de milliers de caractères, et un agent qui prend un instantané après chaque clic sature vite son contexte. L'astuce du README selon laquelle les pages mobiles sont plus légères s'est vérifiée sur GitHub, où --mobile a réduit l'instantané de 14 %. Notre exécution mobile sur Wikipédia a été redirigée vers le site mobile et a été capturée avant son chargement, nous l'avons donc laissée de côté.
Deux choses dans la 0.0.85 aident. Premièrement, browser_navigate ne colle plus toute l'arborescence dans la réponse. Il a exécuté l'appel page.goto et renvoyé l'URL, le titre et un lien vers un fichier dans .playwright-mcp/ du répertoire de travail. L'agent lit le fichier, ou appelle browser_snapshot, lorsqu'il en a besoin. Ajoutez .playwright-mcp/ à votre .gitignore, car ces fichiers s'accumulent dans votre projet. Deuxièmement, browser_find recherche du texte ou un motif dans l'instantané et ne renvoie que les correspondances, ce qui coûte bien moins cher que de lire 800 refs pour trouver un seul bouton.
Les outils, en chiffres
Sans aucune option, MCP Inspector listait 25 outils. Nous avons ensuite démarré le serveur une fois par valeur de --caps et recompté. Les sept valeurs ont été acceptées :
| Groupe | Comment l'activer | Outils ajoutés | Ce qu'ils font |
|---|---|---|---|
| Core | toujours actif | 24 | Naviguer, snapshot, rechercher, cliquer, saisir, remplir des formulaires, glisser, téléverser, boîtes de dialogue, console, journal réseau, capture d'écran, évaluer, redimensionner |
| Tabs | toujours actif | 1 | browser_tabs : lister, ouvrir, fermer, sélectionner |
| Vision | --caps=vision |
6 | Souris par coordonnées : cliquer, glisser, déplacer, molette |
| DevTools | --caps=devtools |
13 | Traces, enregistrement vidéo, mise en évidence et annotation des éléments |
| Storage | --caps=storage |
17 | Cookies, localStorage, sessionStorage, sauvegarde et chargement de l'état du stockage |
| Testing | --caps=testing |
5 | Générer des locators, vérifier le texte, les valeurs et la visibilité |
| Network | --caps=network |
4 | Passer hors ligne, router et simuler des requêtes |
--caps=pdf |
1 | Enregistrer la page au format PDF | |
| Config | --caps=config |
1 | Lire la configuration résolue |
Combinez les groupes avec des virgules, par exemple --caps=vision,devtools. Chaque groupe ajoute des définitions d'outils à chaque requête : n'activez donc que ce dont une tâche a besoin.
Un outil activé par défaut mérite un coup d'œil avant l'installation : browser_run_code_unsafe. Le README le qualifie d'« équivalent RCE », car il exécute du JavaScript arbitraire dans le processus du serveur Playwright sur votre machine, et non dans la page. Il figure dans la liste par défaut que nous avons obtenue. Si votre client permet de désactiver des outils individuellement, c'est celui à couper, sauf si vous en avez besoin.
Les options qui comptent
Le README documente plus de cinquante options, chacune pouvant aussi être définie via une variable d'environnement PLAYWRIGHT_MCP_. Voici celles qui changent l'usage quotidien :
| Option | Quand l'utiliser |
|---|---|
--headless |
Vous n'avez pas besoin de regarder. Le mode headed est celui par défaut |
--isolated |
Chaque session doit démarrer proprement. Le profil vit en mémoire et disparaît à la fermeture du navigateur |
--user-data-dir <path> |
Vous voulez placer le profil persistant à l'endroit de votre choix |
--storage-state <file> |
Vous voulez une session isolée qui démarre déjà connectée, à partir d'un fichier de cookies enregistré |
--browser <name> |
Vous avez besoin de firefox, webkit, msedge ou Chrome au lieu du Chromium fourni |
--device "iPhone 15" ou --mobile |
Vous testez des mises en page mobiles, ou vous voulez des snapshots plus petits |
--extension |
L'agent doit utiliser des onglets dans votre propre Chrome ou Edge déjà connecté |
--port 8931 |
Le serveur doit tourner comme service HTTP sur /mcp au lieu d'être lancé par le client |
--allowed-origins, --blocked-origins |
Vous voulez restreindre l'agent à certains sites. Séparés par des points-virgules |
--output-dir <path> |
Les captures d'écran et les snapshots doivent aller ailleurs que dans le répertoire de travail |
--idle-timeout <ms> |
Vous voulez que le navigateur se ferme après une période d'inactivité. En headless, la valeur par défaut est d'une heure |
--secrets <file> |
Les valeurs d'un fichier dotenv doivent être masquées dans la sortie des outils |
Plusieurs options présentes dans d'anciens guides n'existent plus. --vision est devenu --caps=vision. --save-trace et --save-video sont devenus des outils sous --caps=devtools, si bien que l'agent démarre et arrête une trace ou un enregistrement quand il en a besoin.
Utiliser votre propre navigateur avec l'extension
L'extension Playwright, disponible sur le Chrome Web Store, permet au serveur de piloter des onglets dans le Chrome ou Edge que vous utilisez déjà, avec vos identifiants. Lancez le serveur avec --extension. À la première connexion, une page vous demande d'approuver et de choisir quels onglets ou quel groupe d'onglets le client peut contrôler ; si vous n'en choisissez aucun, il obtient un nouvel onglet vide. Chaque client possède ses propres onglets et ne peut pas toucher aux autres. Il peut lire les cookies mais ne peut pas modifier l'état global du navigateur.
Pour éviter la page d'approbation, définissez PLAYWRIGHT_MCP_EXTENSION_TOKEN avec le token figurant sur la page Manage clients de l'extension. Ne le faites que pour un client en qui vous avez autant confiance qu'en vous-même, car il agit désormais comme vous sur tous les sites où vous êtes connecté.
L'exécuter comme service ou dans Docker
npx @playwright/mcp@latest --port 8931 démarre un serveur de longue durée, et les clients s'y connectent par URL à http://localhost:8931/mcp. Le README le suggère pour les navigateurs headed sur des machines sans affichage et pour les processus worker des IDE. Il écoute sur localhost par défaut et le README ne décrit aucune authentification pour ce point de terminaison, donc ne l'ouvrez pas avec --host 0.0.0.0 sur un réseau partagé.
Microsoft publie aussi mcr.microsoft.com/playwright/mcp. Il ne prend en charge que Chromium en headless :
{
"mcpServers": {
"playwright": {
"command": "docker",
"args": ["run", "-i", "--rm", "--init", "--pull=always", "mcr.microsoft.com/playwright/mcp"]
}
}
}
Playwright MCP, Chrome DevTools MCP ou la CLI
Trois outils se disputent désormais le rôle de « donner un navigateur à l'agent », et ils sont conçus pour des usages différents.
| Playwright MCP | Chrome DevTools MCP | Playwright CLI | |
|---|---|---|---|
| Paquet | @playwright/mcp 0.0.85 |
chrome-devtools-mcp 1.13.0 |
@playwright/cli 0.1.24 |
| Étoiles | 39 614 | 55 670 | 15 186 |
| Moteur | Playwright | Puppeteer | Playwright |
| Navigateurs | Chromium, Chrome, Edge, Firefox, WebKit | Chrome et Chrome for Testing officiellement | Chrome, Firefox, WebKit, Edge |
| Point fort | Agir sur les pages, parcours de type test | Traces de performance, Core Web Vitals, Lighthouse, mémoire, console avec source maps | La même automatisation avec moins de contexte consommé |
| Télémétrie | Le README n'en dit rien | Statistiques d'usage envoyées à Google par défaut ; --no-usage-statistics les désactive |
Chrome DevTools MCP liste 63 outils répartis en 13 catégories. Ses outils de performance enregistrent une trace, rapportent LCP, INP et CLS et détaillent une insight ; il exécute aussi Lighthouse et prend et compare des snapshots de tas. C'est un travail DevTools que Playwright MCP ne cherche pas à faire. À noter sur ses valeurs par défaut : il envoie des statistiques d'usage à Google, et ses outils de performance peuvent transmettre des URL de traces à l'API CrUX de Google si vous ne passez pas --no-performance-crux.
Les recommandations de l'équipe Playwright sur sa CLI sont sans détour. La CLI avec des skills est « plus économe en tokens » parce que l'agent exécute de courtes commandes shell et lit les snapshots depuis des fichiers au lieu de charger les schémas d'outils et les arbres complets dans le contexte. MCP reste le meilleur choix pour l'automatisation exploratoire, les tests auto-réparateurs et les longues exécutions autonomes, où conserver l'état du navigateur entre les étapes compte plus que les tokens.
Il existe une quatrième option pour les suites de tests : les agents de test de Playwright. npx playwright init-agents --loop=claude met en place un planner qui explore votre application et rédige un plan de test, un generator qui transforme le plan en tests Playwright, et un healer qui relance les tests en échec et les corrige. Ils s'appuient en interne sur les outils MCP de Playwright.
Notre version courte : écrivez et corrigez les tests avec les agents de test, laissez un agent de codage vérifier ses propres changements d'UI avec la CLI, utilisez Playwright MCP quand le travail de l'agent est la navigation elle-même, et ajoutez Chrome DevTools MCP quand la question est de savoir pourquoi une page est lente.
Sécurité
Le README est clair : Playwright MCP « n'est pas une frontière de sécurité ». Concrètement, cela signifie :
- Le profil persiste. Par défaut, chaque espace de travail dispose de son propre profil sous
~/Library/Caches/ms-playwright/sur macOS (~/.cache/ms-playwright/sous Linux), et les identifiants de connexion y restent d'une session à l'autre. Supprimez-le pour réinitialiser l'état, ou utilisez--isolated. - Les listes d'origines sont une clôture, pas un mur.
--allowed-originset--blocked-originsne s'appliquent pas aux redirections. Ne comptez pas sur elles pour empêcher un agent d'atteindre un site. - Le masquage est cosmétique.
--secretset--redact-url-paramsmasquent des valeurs dans la sortie des outils ; le README les présente comme une commodité, pas comme une fonctionnalité de sécurité. - Les pages parlent au modèle. Tout ce qui figure dans le snapshot est du texte que le modèle lit, y compris le texte écrit pour l'orienter. Les outils qu'une page enregistre via WebMCP apparaissent comme des outils
webmcp_, et playwright.dev recommande de les traiter comme des entrées non fiables ;--no-webmcples désactive. - L'accès aux fichiers est limité par défaut. Le serveur ne peut lire et écrire qu'à l'intérieur des racines de votre espace de travail, et les URL
file://sont bloquées sauf si vous passez--allow-unrestricted-file-access.
La configuration quotidienne la plus sûre est --isolated avec un fichier --storage-state pour le seul site dont l'agent a besoin, plus --headless une fois que vous faites confiance au flux. Pour en savoir plus sur ces risques, voir Sécurité MCP.
Quand cela ne fonctionne pas
| Ce que vous voyez | Cause | Correction |
|---|---|---|
| Le navigateur ne se lance pas sur un serveur | Aucun affichage pour un navigateur avec interface | Ajoutez --headless, ou lancez le serveur avec --port comme le suggère le README |
| Un second client dans le même projet ne parvient pas à démarrer le navigateur | Un profil persistant ne prend en charge qu'un seul navigateur à la fois | Utilisez --isolated, ou un --user-data-dir différent par client |
| L'agent clique au mauvais endroit ou ne trouve pas un élément | Élément absent de l'arbre d'accessibilité, comme un canvas | Activez --caps=vision et laissez-le utiliser les coordonnées |
| Le contexte sature après quelques pages | Instantanés complets de pages lourdes | Demandez browser_find au lieu d'instantanés complets ; essayez --mobile |
| D'anciens flags de tutoriel sont rejetés | --vision et --save-trace ont été supprimés |
Utilisez --caps=vision et --caps=devtools |
| Les clients HTTP se déconnectent | Délai d'expiration du heartbeat de cinq secondes | Augmentez PLAYWRIGHT_MCP_PING_TIMEOUT_MS, ou réglez-le sur 0 |
Des fichiers .playwright-mcp/ dans votre git status |
Fichiers d'instantanés et de captures d'écran enregistrés dans le répertoire de travail | Ajoutez le dossier à .gitignore, ou définissez --output-dir |
Avant de blâmer l'agent, vérifiez le serveur seul : npx @modelcontextprotocol/inspector --cli npx @playwright/mcp@latest --headless --method tools/list devrait afficher la liste des outils. Notre guide MCP Inspector traite de cet outil.
Les autres serveurs de navigateur de notre catalogue, avec les scores de checks et les commandes d'installation pour chacun, figurent dans le tableau en haut de cette page.
