Veröffentlicht am 19. Mai 2026
KI-Codierungstools sind unglaublich leistungsstark beim Schreiben von Code, aber oft nicht mit der Ausführung verbunden. Sie können eine komplexe Web-App generieren, aber ihr Verhalten nicht beobachten oder ihre Ausgabe in einem Live-Browser prüfen.
Mit Chrome-Entwicklertools für Agents erhalten Sie die nötige Transparenz, um Code in Echtzeit zu überprüfen, zu debuggen und zu optimieren. Vor einigen Monaten haben wir das Tool zum ersten Mal vorgestellt. Jetzt freuen wir uns, bekannt zu geben, dass Chrome-Entwicklertools für Agents als stabile Version 1.0 verfügbar ist.
Agent mit dem Browser verbinden
Mit Chrome-Entwicklertools für Agents kann Ihr Agent Ihre Website so nutzen, wie es ein echter Nutzer tun würde. Diese stabile Version bietet Ihnen und Ihrem Agent mehrere Möglichkeiten, mit Chrome zu interagieren:
- MCP-Server (Model Context Protocol): Ein Server, der große Sprachmodelle (Large Language Models, LLMs) mit den Debugging-Funktionen der Entwicklertools verbindet.
- Befehlszeile: Eine tokeneffiziente Alternative, mit der Agents Aktionen in Skripten zusammenfassen können.
- Agent-Fähigkeiten: Expertenanweisungen, die Ihrem Agent beibringen, wie und wann er bestimmte Tools für Aufgaben wie das Debugging von Barrierefreiheit oder Leistung verwenden soll.
Automatisch debuggen, emulieren und prüfen
Mit der Version 1.0 kann Ihr Codierungs-Agent jetzt erweiterte Debugging-Aufgaben ausführen, die bisher manuell erledigt werden mussten.
Qualitätsprüfungen automatisieren
Ihr Agent kann jetzt Lighthouse-Prüfungen ausführen, um die Qualität von Websites zu bewerten. Er kann Probleme mit Barrierefreiheit, SEO, Best Practices und dem agentenbasierten Browsen erkennen. Das ist wie ein Linter, der die Laufzeit versteht. Als Qualitätssicherungstool macht es Ihren Codierungs-Agent zu einem Experten, der kritische Blocker erkennt, bevor sie in die Produktion gelangen.
Nutzererfahrungen aus der Praxis emulieren
Ihr Agent kann mit den Entwicklertools für Agents testen, wie eine Website auf verschiedenen Geräten oder an verschiedenen Standorten mithilfe von Emulationstools aussieht und funktioniert. Er kann Fenstergrößen ändern, Geostandorte simulieren und die Netzwerk- und CPU-Geschwindigkeiten drosseln, um reale Bedingungen nachzuahmen. So kann Ihr Agent mobilspezifische Verhaltensweisen wie Burgermenüs testen, ohne dass Sie die Größe Ihres Browsers manuell ändern müssen.
Chrome-Erweiterungen entwickeln und debuggen
Sie können Ihren Agent nicht nur bei der Entwicklung von Chrome-Erweiterungen unterstützen, sondern auch beim Debuggen. Ihr Agent kann Erweiterungsaktionen direkt installieren, neu laden und auslösen. So lässt sich der häufige Zyklus aus Speichern und Aktualisieren während der Entwicklung automatisieren. Er kann auch Hintergrundskripts und Erweiterungsseiten untersuchen, um Fehler in komplexeren Browserkonfigurationen zu beheben.
WebMCP-Tools debuggen und testen
Wir bieten auch umfassende Transparenz für die WebMCP-Testphase (Web Model Context Protocol), damit Sie diese neue API implementieren können.
Anstatt dass Ihr Agent Signale verwendet, um einen Plan für die Navigation im DOM abzuleiten, kann er direkt mit strukturierten Tools interagieren, die Sie mit WebMCP bereitstellen. So lassen sich diese Tools einfacher entwickeln, testen und debuggen: Ihr Agent kann sie in Echtzeit auflisten, programmatisch aufrufen und ihre Richtigkeit überprüfen. Dadurch wird der Prozess vereinfacht, WebMCP-Unterstützung zu Ihrer Website hinzuzufügen und sie zu testen.
Speicherlecks erkennen und debuggen
Wir haben auch spezielle Tools für die Speicheranalyse hinzugefügt. Ihr Agent kann jetzt Heap-Snapshots erstellen, um Speicherlecks wie getrennte DOM-Knoten zu erkennen. Durch die Verwendung spezieller Fähigkeiten zum Debuggen von Speicherlecks fungiert der Agent als Leistungsexperte, der Ihnen hilft, Ihre Anwendung schlank und schnell zu halten.
Sitzungen mit automatischer Verbindung übergeben
Sie können Ihren aktuellen Browserkontext für einen Agent freigeben, anstatt dass der Agent eine eigene Sandbox-Browserinstanz öffnet (so erhalten Agents normalerweise Zugriff auf den Browser). Das ist ideal für das Debuggen von Dingen, für die eine Anmeldung erforderlich ist, z. B. ein authentifiziertes Dashboard. In diesem Fall soll der KI-Agent die technische Untersuchung übernehmen, ohne dass Sie alles neu authentifizieren müssen.
Internen Status mit Entwicklertools von Drittanbietern verfügbar machen
Mit Entwicklertools von Drittanbietern kann Ihre Webanwendung den internen Status und Komponentendetails direkt für KI-Agents freigeben. Durch den Zugriff auf Daten, die normalerweise für die Standardanalyse ausgeblendet sind, erhalten Agents den Kontext, den sie zum Verständnis komplexer Logik benötigen. So erhalten Sie genauere Debugging-Vorschläge, die auf dem tatsächlichen Verhalten der Anwendung im Browser basieren.
Jetzt starten
Sie können die stabile Version mit npm installieren oder direkt in Ihrem bevorzugten Agent konfigurieren:
Antigravity
Chrome-Entwicklertools für Agents ist bereits mit Antigravity 2.0 gebündelt. Sie können es sofort mit dem Browser-Sub-Agent verwenden. Verwenden Sie einen Slash-Befehl wie:
/browser Navigate to the Google homepage
Wenn Sie auf spezielle Agent-Fähigkeiten zugreifen möchten, empfehlen wir Ihnen, das Entwicklertools-Plug-in während des Schritts Mit Google entwickeln der Ersteinrichtung oder in den Anwendungseinstellungen zu installieren. Weitere Informationen finden Sie in der Dokumentation zum Antigravity-Browser Sub-Agent.
Gemini CLI
Verwenden Sie den folgenden Befehl, um das MCP-Paket und die Fähigkeiten als Erweiterung zu installieren:
$ gemini extensions install --auto-update https://github.com/ChromeDevTools/chrome-devtools-mcp
Claude Code
Verwenden Sie die folgenden Slash-Befehle in Claude Code, um Chrome-Entwicklertools für Agents als Claude Code-Plug-in zu installieren. Fügen Sie die Marketplace-Registrierung hinzu:
/plugin marketplace add ChromeDevTools/chrome-devtools-mcp
Installieren Sie das Plug-in aus der Marketplace-Registrierung:
/plugin install chrome-devtools-mcp@chrome-devtools-plugins
Ausführlichere Anleitungen und Beispiel-Prompts finden Sie in der Dokumentation zu Chrome-Entwicklertools für Agents. Sie können sich auch den Quellcode auf GitHub ansehen.