Chrome DevTools MCP

officiel

Serveur MCP officiel de Chrome DevTools pour contrôler et inspecter un navigateur Chrome en direct depuis des agents de codage tels que Gemini, Claude, Cursor et Copilot.

Que pouvez-vous faire avec Chrome DevTools MCP ?

  • Tracing des performances — Demandez à votre assistant d'enregistrer un trace de performance pour une URL et de mettre en évidence des informations exploitables, par ex. « Vérifiez les performances de https://developers.chrome.com ».
  • Analyse réseau — Faites inspecter les requêtes réseau par votre assistant pour déboguer les problèmes de chargement, les ressources échouées ou les problèmes d'appels API.
  • Surveillance de la console — Demandez une vérification des messages de la console du navigateur, y compris les traces de pile avec mappage de sources, pour diagnostiquer les erreurs JavaScript.
  • Capture d'écran — Donnez pour instruction à votre assistant de prendre des captures d'écran de la page actuelle pour une vérification visuelle ou une documentation.
  • Actions automatisées du navigateur — Dirigez votre assistant pour automatiser des interactions comme les clics, la navigation ou les remplissages de formulaires à l'aide de Puppeteer, avec une attente automatique des résultats.

Documentation

Chrome DevTools pour les agents

npm chrome-devtools-mcp package

Chrome DevTools pour les agents (chrome-devtools-mcp) permet à votre agent de codage (comme Antigravity, Claude, Cursor ou Copilot) de contrôler et d'inspecter un navigateur Chrome en direct. Il agit comme un serveur Model-Context-Protocol (MCP), donnant à votre assistant de codage IA accès à toute la puissance de Chrome DevTools pour une automatisation fiable, un débogage approfondi et une analyse des performances. Une CLI est également fournie pour une utilisation sans MCP.

Référence des outils | Journal des modifications | Contribuer | Dépannage | Principes de conception

Fonctionnalités clés

  • Obtenez des informations sur les performances : Utilise Chrome DevTools pour enregistrer des traces et extraire des informations exploitables sur les performances.
  • Débogage avancé du navigateur : Analysez les requêtes réseau, prenez des captures d'écran et vérifiez les messages de la console du navigateur (avec des traces de pile mappées aux sources).
  • Automatisation fiable. Utilise puppeteer pour automatiser les actions dans Chrome et attend automatiquement les résultats des actions.

Avertissements

chrome-devtools-mcp expose le contenu de l'instance du navigateur aux clients MCP, leur permettant d'inspecter, de déboguer et de modifier toutes les données du navigateur ou de DevTools. Évitez de partager des informations sensibles ou personnelles que vous ne souhaitez pas partager avec les clients MCP.

chrome-devtools-mcp prend officiellement en charge Google Chrome et Chrome for Testing uniquement. D'autres navigateurs basés sur Chromium peuvent fonctionner, mais cela n'est pas garanti et vous pouvez rencontrer des comportements inattendus. Utilisez-les à vos propres risques. Nous nous engageons à fournir des correctifs et un support pour la dernière version de Chrome Extended Stable.

Les outils de performance peuvent envoyer des URL de trace à l'API Google CrUX pour récupérer les données d'expérience utilisateur réelles. Cela aide à fournir une image complète des performances en présentant les données de terrain aux côtés des données de laboratoire. Ces données sont collectées par le Chrome User Experience Report (CrUX). Pour désactiver cette fonctionnalité, exécutez avec l'indicateur --no-performance-crux.

Statistiques d'utilisation

Google collecte des statistiques d'utilisation (telles que les taux de réussite des appels d'outils, la latence et les informations sur l'environnement) pour améliorer la fiabilité et les performances de Chrome DevTools MCP.

La collecte de données est activée par défaut. Vous pouvez vous désinscrire en passant l'indicateur --no-usage-statistics lors du démarrage du serveur :

"args": ["-y", "chrome-devtools-mcp@latest", "--no-usage-statistics"]

Google traite ces données conformément à la Politique de confidentialité de Google.

La collecte de statistiques d'utilisation par Google pour Chrome DevTools MCP est indépendante des statistiques d'utilisation du navigateur Chrome. Le fait de désactiver les métriques Chrome ne désactive pas automatiquement cet outil, et vice-versa.

La collecte est désactivée si les variables d'environnement CHROME_DEVTOOLS_MCP_NO_USAGE_STATISTICS ou CI sont définies.

Vérifications des mises à jour

Par défaut, le serveur vérifie périodiquement le registre npm pour les mises à jour et enregistre une notification lorsqu'une version plus récente est disponible. Vous pouvez désactiver ces vérifications de mises à jour en définissant la variable d'environnement CHROME_DEVTOOLS_MCP_NO_UPDATE_CHECKS.

Prérequis

Pour commencer

Ajoutez la configuration suivante à votre client MCP :

{
  "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": ["-y", "chrome-devtools-mcp@latest"]
    }
  }
}

[!NOTE] L'utilisation de chrome-devtools-mcp@latest garantit que votre client MCP utilisera toujours la dernière version du serveur Chrome DevTools MCP.

Si vous souhaitez uniquement effectuer des tâches de navigation de base, utilisez le mode --slim :

{
  "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": ["-y", "chrome-devtools-mcp@latest", "--slim", "--headless"]
    }
  }
}

Voir Référence des outils simplifiés.

Configuration du client MCP

Pour des instructions de configuration spécifiques à votre éditeur ou agent (par exemple Antigravity, Claude Code, Cursor, VS Code), veuillez consulter notre Guide de configurations client.

Votre première invite

Saisissez l'invite suivante dans votre client MCP pour vérifier que tout fonctionne :

Check the performance of https://developers.chrome.com

Votre client MCP devrait ouvrir le navigateur et enregistrer une trace de performance.

[!NOTE] Le serveur MCP démarrera le navigateur automatiquement dès que le client MCP utilisera un outil nécessitant une instance de navigateur en cours d'exécution. La connexion au serveur Chrome DevTools MCP en soi ne démarrera pas automatiquement le navigateur.

Outils

Si vous rencontrez des problèmes, consultez notre guide de dépannage. Voir la Référence des outils complète pour une liste de toutes les capacités MCP prises en charge.

Configuration

Trouvez la liste complète des paramètres du serveur (par exemple, --headless, --isolated, --slim) et comment configurer les connexions WebSocket dans le Guide de configuration.

Utilisation avancée

Pour des fonctionnalités avancées telles que la gestion des sessions simultanées, les répertoires de données utilisateur persistants, la connexion à une instance Chrome en cours d'exécution au lieu d'en démarrer une nouvelle, ou le débogage sur Android, consultez notre Guide d'utilisation avancée.

Intégration en tant que sous-agent navigateur

Si vous développez des outils agentiques et souhaitez fournir un sous-agent navigateur intégré dans le cadre de votre produit, nous recommandons de construire sur Chrome DevTools pour les agents.

Pour une implémentation de référence, consultez la documentation de l'agent navigateur Gemini CLI.