Laissez votre agent de programmation déboguer votre session de navigateur avec le MCP des outils de développement Chrome

Sebastian Benz

Alex Rudenko

Date de publication : 11 décembre 2025

Nous avons amélioré le serveur MCP des outils de développement Chrome, une fonctionnalité que beaucoup de nos utilisateurs nous demandaient : la possibilité pour les agents de codage de se connecter directement à une session de navigateur active.

Grâce à cette amélioration, les agents de codage peuvent :

1. Réutiliser une session de navigateur existante : imaginez que vous souhaitez que votre agent de programmation corrige un problème qui nécessite une connexion. Votre agent de codage peut désormais accéder directement à votre session de navigation actuelle, sans qu'une connexion supplémentaire soit requise.
2. Accéder aux sessions de débogage actives : les agents de programmation peuvent désormais accéder à une session de débogage active dans l'interface utilisateur des outils de développement. Par exemple, lorsque vous découvrez une requête réseau qui échoue dans le panneau réseau des outils pour les développeurs Chrome, sélectionnez la requête et demandez à votre agent de codage de l'examiner. Il en va de même pour les éléments sélectionnés dans le panneau "Éléments". Nous sommes ravis de cette nouvelle fonctionnalité qui permet de passer facilement du débogage manuel au débogage assisté par l'IA.

Résultat :

La fonctionnalité de connexion automatique s'ajoute aux méthodes existantes permettant au MCP Chrome DevTools de se connecter à une instance Chrome. Notez que vous pourrez toujours :

• Exécutez Chrome avec un profil utilisateur spécifique au serveur MCP des outils pour les développeurs Chrome (par défaut).
• Connectez-vous à une instance Chrome en cours d'exécution avec un port de débogage à distance.
• Exécutez plusieurs instances Chrome de manière isolée, chacune s'exécutant dans un profil temporaire.

Fonctionnement

Nous avons ajouté une nouvelle fonctionnalité à Chrome M145 (actuellement dans Canary) qui permet au serveur MCP des outils de développement Chrome de demander une connexion de débogage à distance. Ce nouveau flux s'appuie sur les fonctionnalités de débogage à distance existantes de Chrome. Par défaut, les connexions de débogage à distance sont désactivées dans Chrome. Les développeurs doivent d'abord activer explicitement la fonctionnalité en accédant à chrome://inspect#remote-debugging.

Lorsque le serveur MCP des outils de développement Chrome est configuré avec l'option --autoConnect, il se connecte à une instance Chrome active et demande une session de débogage à distance. Pour éviter toute utilisation abusive par des personnes malintentionnées, Chrome affiche une boîte de dialogue à l'utilisateur et lui demande l'autorisation d'autoriser la session de débogage à distance chaque fois que le serveur MCP des outils de développement Chrome demande une session de débogage à distance. De plus, lorsqu'une session de débogage est active, Chrome affiche la bannière "Chrome est contrôlé par un logiciel de test automatisé" en haut de l'écran.

Premiers pas

Pour utiliser les nouvelles fonctionnalités de débogage à distance. Vous devez d'abord activer le débogage à distance dans Chrome, puis configurer le serveur MCP des outils pour les développeurs Chrome pour utiliser la nouvelle fonctionnalité de connexion automatique.

Étape 1 : Configurez le débogage à distance dans Chrome

Dans Chrome, procédez comme suit pour configurer le débogage à distance :

1. Accédez à chrome://inspect/#remote-debugging pour activer le débogage à distance.
2. Suivez l'interface utilisateur de la boîte de dialogue pour autoriser ou refuser les connexions de débogage entrantes.

Étape 2 : Configurez le serveur MCP des outils de développement Chrome pour qu'il se connecte automatiquement à une instance Chrome en cours d'exécution

Pour connecter le serveur chrome-devtools-mcp à l'instance Chrome en cours d'exécution, utilisez l'argument de ligne de commande --autoConnect pour l'ensemble de serveurs MCP.

L'extrait de code suivant est un exemple de configuration pour gemini-cli :

{
   "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": [
        "chrome-devtools-mcp@latest",
        "--autoConnect",
        "--channel=canary"
      ]
    }
  }
}

Étape 3 : Testez votre configuration

Ouvrez maintenant gemini-cli et exécutez l'invite suivante :

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

Le serveur MCP des outils de développement Chrome tentera de se connecter à votre instance Chrome en cours d'exécution. Une boîte de dialogue s'affiche pour demander l'autorisation à l'utilisateur :

Si vous cliquez sur Autoriser, le serveur MCP des outils pour les développeurs Chrome ouvre developers.chrome.com et effectue une trace de performances.

Pour obtenir des instructions complètes, consultez le fichier README sur GitHub.

Laissez votre agent de programmation prendre le contrôle de votre session de débogage

La possibilité de se connecter à une instance Chrome en direct signifie que vous n'avez pas à choisir entre l'automatisation et le contrôle manuel. Vous pouvez utiliser les outils de développement vous-même ou confier une tâche de débogage à votre agent de programmation. Si vous détectez un problème sur votre site Web, vous pouvez ouvrir les outils de développement pour identifier l'élément qui en est à l'origine. Si vous souhaitez que votre agent de programmation résolve le problème, vous pouvez désormais le faire avec le serveur MCP des outils pour les développeurs Chrome. Vous pouvez sélectionner l'élément dans le panneau "Éléments" et demander à l'agent de codage d'examiner le problème.

Il en va de même pour le panneau "Réseau". Vous pouvez sélectionner une requête réseau et demander à votre agent de codage de l'examiner.

Mais ce n'est qu'un début. Nous prévoyons d'exposer progressivement de plus en plus de données de panneau aux agents de codage via le serveur MCP des outils pour les développeurs Chrome. Tenez-vous informé !