Gepubliceerd: 19 mei 2026
AI-codeertools zijn ongelooflijk krachtig in het schrijven van code, maar ze staan vaak los van de uitvoering ervan. Ze kunnen een complexe webapplicatie genereren, maar ze kunnen het gedrag ervan niet observeren of de uitvoer ervan in een live browser inspecteren.
Chrome DevTools voor agents biedt uw codeeragent het inzicht dat nodig is om code in realtime te verifiëren, debuggen en optimaliseren. Een paar maanden geleden lieten we het voor het eerst zien , en nu zijn we verheugd aan te kondigen dat Chrome DevTools voor agents beschikbaar is als stabiele versie 1.0.
Verbind uw agent met de browser.
Met Chrome DevTools voor agents kan uw agent uw site ervaren zoals een echte gebruiker dat zou doen. Deze stabiele release bevat verschillende manieren waarop u en uw agent met Chrome kunnen communiceren:
- Model Context Protocol (MCP)-server : een server die grote taalmodellen (LLM's) verbindt met de debugmogelijkheden van DevTools.
- Command-line interface (CLI) : Een token-efficiënt alternatief waarmee agents acties in scripts kunnen bundelen.
- Agentvaardigheden : deskundige instructies die uw agent leren hoe en wanneer specifieke tools te gebruiken voor taken zoals toegankelijkheids- of prestatiedebugging.
Debuggen, emuleren en automatisch controleren
Met versie 1.0 kan uw codeeragent nu geavanceerde debugtaken uitvoeren die voorheen handmatig moesten worden gedaan.
Automatiseer kwaliteitsaudits
Uw agent kan nu Lighthouse-audits uitvoeren om de websitekwaliteit te evalueren. Het kan problemen met toegankelijkheid, SEO, best practices en agent-browsing identificeren. Het is alsof u een linter hebt die de runtime begrijpt. Gebruikt als kwaliteitscontrole, verandert het uw codeeragent in een expert die kritieke knelpunten opspoort voordat ze de productieomgeving bereiken.
Simuleer gebruikerservaringen uit de praktijk
Uw agent kan DevTools voor agents gebruiken om te testen hoe een website eruitziet en presteert op verschillende apparaten of locaties met behulp van emulatietools . Het kan vensters vergroten of verkleinen, geolocaties simuleren en netwerk- en CPU-snelheden beperken om de omstandigheden in de praktijk na te bootsen. Op deze manier kan uw agent mobielspecifiek gedrag testen, zoals hamburgermenu's, zonder dat u uw browser handmatig hoeft te vergroten of verkleinen.
Chrome-extensies ontwikkelen en debuggen.
Je kunt je agent niet alleen gebruiken om Chrome-extensies te ontwikkelen, maar ook om ze te debuggen. Je agent kan extensies installeren, herladen en acties direct uitvoeren. Dit helpt bij het automatiseren van de frequente cyclus van 'opslaan en vernieuwen' tijdens de ontwikkeling. De agent kan ook achtergrondscripts en extensiepagina's onderzoeken om je te helpen bij het oplossen van bugs in complexere browserconfiguraties.
Foutopsporing en testen van WebMCP-tools
We bieden ook uitgebreide informatie over de WebMCP (Web Model Context Protocol) Origin Trial om u te helpen bij de implementatie van deze nieuwe API.
In plaats van dat uw agent afhankelijk is van signalen om een plan af te leiden voor het navigeren door de DOM, kan deze direct communiceren met gestructureerde tools die u beschikbaar stelt via WebMCP. Dit maakt het ontwikkelen, testen en debuggen van deze tools eenvoudiger: uw agent kan ze in realtime weergeven, programmatisch aanroepen en de correctheid ervan controleren. Dit stroomlijnt het proces van het toevoegen van WebMCP-ondersteuning aan uw site en het testen ervan.
Geheugenlekken opsporen en verhelpen
We hebben ook speciale tools voor geheugenanalyse toegevoegd. Uw agent kan nu heap-snapshots maken om geheugenlekken te identificeren, zoals losgekoppelde DOM-nodes. Door gebruik te maken van gespecialiseerde vaardigheden voor het opsporen van geheugenlekken, fungeert de agent als een prestatie-expert die u helpt uw applicatie efficiënt en snel te houden.
Sessies overdragen met automatische verbinding
Je kunt je huidige browsercontext delen met een agent , in plaats van dat de agent een eigen, afgeschermde browseromgeving opent (wat normaal gesproken de manier is waarop DevTools voor agents agents toegang geeft tot de browser). Dit is perfect voor het debuggen van zaken waarvoor een login vereist is, zoals een geauthenticeerd dashboard, waarbij je wilt dat de AI-agent het technische onderzoek overneemt zonder dat je alles opnieuw hoeft te authenticeren.
Interne status weergeven met behulp van tools van derden voor ontwikkelaars.
Ontwikkelaarstools van derden stellen uw webapplicatie in staat om interne statusinformatie en componentdetails rechtstreeks te delen met AI-agenten. Door toegang te bieden tot gegevens die normaal gesproken verborgen blijven voor standaardanalyses, geven deze tools agenten de context die ze nodig hebben om complexe logica te begrijpen. Dit resulteert in nauwkeurigere suggesties voor het debuggen, gebaseerd op hoe de applicatie zich daadwerkelijk gedraagt in de browser.
Aan de slag
Je kunt de stabiele versie installeren met npm of deze direct configureren in de agent van je keuze:
Antizwaartekracht
Chrome DevTools voor agents wordt standaard meegeleverd met Antigravity 2.0 . Je kunt er direct mee aan de slag via de browser-subagent . Probeer bijvoorbeeld een slash-commando zoals:
/browser Navigate to the Google homepage
Om toegang te krijgen tot gespecialiseerde agentvaardigheden, raden we aan de DevTools-plug-in te installeren tijdens de stap 'Bouwen met Google' van de eerste installatie of in de toepassingsinstellingen. Raadpleeg de documentatie van de Antigravity Browser Subagent voor meer informatie.
Gemini CLI
Om het MCP-pakket en de bijbehorende vaardigheden als extensie te installeren, gebruikt u de volgende opdracht:
$ gemini extensions install --auto-update https://github.com/ChromeDevTools/chrome-devtools-mcp
Claude Code
Om Chrome DevTools voor agents als een Claude Code-plug-in te installeren, gebruikt u de volgende slash-opdrachten in Claude Code. Voeg de marketplace-registratie toe:
/plugin marketplace add ChromeDevTools/chrome-devtools-mcp
Installeer vervolgens de plugin vanuit het marketplace-register:
/plugin install chrome-devtools-mcp@chrome-devtools-plugins
Voor meer gedetailleerde handleidingen en voorbeeldopdrachten kunt u onze documentatie over Chrome DevTools voor agents raadplegen. U kunt ook de broncode op GitHub bekijken.