← Retour à la liste←
★★★★½ 4.5 / 5
Catégorie 05 — MCP

MCP Playwright

Contrôle de navigateur complet — tests, screenshots, scraping

Installation
Claude Code — déjà disponible via plugin# Claude Code charge @playwright/mcp automatiquement si configuré. # Pour l'ajouter manuellement : claude mcp add playwright -- npx @playwright/mcp@latest
Mode headed (navigateur visible)claude mcp add playwright -- npx @playwright/mcp@latest --headed
Configuration avancée (fichier JSON)# playwright-mcp-config.json : # { "browser": { "headless": false }, "network": { "blockedUrls": ["*analytics*"] } } claude mcp add playwright -- npx @playwright/mcp@latest --config ./playwright-mcp-config.json
Version0.0.73 (mai 2026)
PrixGratuit (open source, Apache 2.0)
Plateformes
WindowsmacOSLinux
Commandes10
Exemples3
MCP
À propos

Serveur MCP officiel Microsoft/Playwright (v0.0.73, mai 2026) qui expose un navigateur Chromium contrôlable par l'IA. 24 outils couvrent la navigation, les clics, les formulaires, les screenshots, la console JS et le réseau. Utilisé nativement dans Claude Code via le plugin @playwright/mcp — c'est le seul MCP actif par défaut dans cet environnement.

Fonctionnalités clés
Snapshots d'accessibilité (aria-ref)Le mode par défaut n'utilise pas de screenshots — il génère un snapshot de l'arbre d'accessibilité. Plus rapide, moins coûteux en tokens, et interagit via des aria-ref stables plutôt que des coordonnées fragiles.
24 outils navigateurNavigation, clic, saisie, drag & drop, sélection, upload, évaluation JS, gestion des dialogues, onglets multiples, monitoring réseau et console — couverture complète pour automatiser n'importe quel workflow web.
Screenshots et PDFCapture d'écran à la demande (PNG) ou export PDF. Indispensable pour les tests de régression visuelle et la vérification d'UI depuis un agent IA.
Monitoring réseaubrowser_network_requests liste toutes les requêtes HTTP de la page — méthode, URL, statut, headers. Idéal pour débugger des API calls ou vérifier les payloads envoyés.
Console JSbrowser_console_messages capture tous les logs console (log, warn, error). Détecter les erreurs JS d'une page sans ouvrir les DevTools manuellement.
Configuration avancée via JSONMode headless/headed, timeout global, authentification HTTP, règles de blocage réseau (bloquer les trackers, CDN) — tout configurable via fichier JSON avec le flag --config.
Commandes
CommandeDescription
browser_navigateNaviguer vers une URL (attend le chargement complet)
browser_snapshotCapturer l'arbre d'accessibilité de la page (mode par défaut — sans screenshot)
browser_take_screenshotPrendre une capture d'écran PNG de la page ou d'un élément
browser_clickCliquer sur un élément par aria-ref, sélecteur CSS ou texte
browser_type / browser_fill_formSaisir du texte dans un champ ou remplir tout un formulaire
browser_evaluateExécuter du JavaScript arbitraire dans le contexte de la page
browser_network_requestsLister toutes les requêtes HTTP de la session en cours
browser_console_messagesRécupérer tous les messages console (log, warn, error, info)
browser_wait_forAttendre qu'un sélecteur, une URL ou un état réseau soit atteint
browser_tabsLister les onglets ouverts et naviguer entre eux
Exemples
Test visuel d'une featureCODE
"Navigue sur http://localhost:3000, prends un screenshot de la page d'accueil,
puis clique sur le bouton 'Explorer la stack' et vérifie que tu atteins bien
la section #cat-ide. Prends un second screenshot pour confirmer."
Audit de formulaireCODE
"Navigue sur /template, tente d'accéder sans cookie de session.
Vérifie que tu es bien redirigé vers /. Ensuite remplis le formulaire
d'unlock avec le code HUBERT et confirme l'accès au contenu."
Debug réseau — vérifier les API callsCODE
"Navigue sur http://localhost:3000/tools/cursor.
Après le chargement, liste toutes les requêtes réseau effectuées
et identifie celles qui retournent un statut >= 400."
Points forts & faibles
Points forts
+Officiel Microsoft/Playwright — activement maintenu (releases hebdomadaires)
+24 outils — couverture complète du workflow navigateur
+Snapshots aria-ref plus stables que les coordonnées pixel
+Monitoring réseau et console intégrés
+Zéro configuration pour démarrer (npx direct)
+Déjà actif dans Claude Code via plugin @playwright/mcp
Points faibles
−Chromium uniquement (Firefox et WebKit disponibles mais non configurés par défaut)
−Pas de gestion des extensions navigateur
−Mode headed nécessite un display (X11/Wayland en Linux headless)
−Captures d'écran consomment beaucoup de tokens (images base64)
−Version 0.x — API peut changer entre releases
Verdict

Le MCP le plus puissant pour les développeurs web. Tester une feature, auditer une page, scraper du contenu JS-rendered, automatiser un workflow — Playwright MCP fait tout. La stabilisation des aria-ref est un vrai différenciateur.

→ Développeurs web qui testent des interfaces, automatisent des workflows navigateur, vérifient visuellement des rendus ou scrapent du contenu nécessitant l'exécution JavaScript.