Gebruik het deelvenster WebMCP in Chrome DevTools om de AI-tools aan de clientzijde te inspecteren, te debuggen en te testen die je website beschikbaar stelt aan AI-agents. Het deelvenster biedt volledig end-to-end inzicht in de levenscyclus van de tool, waaronder registratie, schemavalidatie en aanroepgeschiedenis.
Het deelvenster WebMCP openen
Het deelvenster WebMCP bevindt zich in het deelvenster Toepassing. Volg deze stappen om het te openen:
- Open Chrome DevTools op een pagina die WebMCP tools gebruikt.
- Klik op het tabblad Toepassing.
- Selecteer het deelvenster WebMCP op het hoogste niveau van de zijbalk.
Overzicht van de interface
Het deelvenster WebMCP gebruikt een indeling met 2 deelvensters om je tools te beheren en te controleren:
- Aangeroepen tools: Een chronologisch logboek van interacties tussen de AI-agent en de pagina.
- Beschikbare tools: Een live lijst met alle WebMCP-tools die op het actieve tabblad zijn gevonden.
Beschikbare tools
In het gedeelte Beschikbare tools worden de toolnamen en -beschrijvingen getoond zoals ze aan de AI-agent worden getoond. Het bevat ook een aanroepteller voor elke tool, die aangeeft hoe vaak een tool is aangeroepen tijdens de huidige sessie.
Aangeroepen tools
Het logboek Aangeroepen tools biedt een permanent overzicht van toolinteracties. Als je een vermelding in het logboek selecteert, kun je de volgende gegevens inspecteren:
- Status: Het resultaat van de aanroep (Afgerond, Geannuleerd, In behandeling of Fout).
- Invoer: De exacte parameters die de agent heeft voorspeld en naar de tool heeft gestuurd.
- Uitvoer: De retourwaarde of foutmelding van de tool.
Het logboek filteren
Gebruik de balk Filteren om de lijst met aangeroepen tools te verfijnen op basis van de volgende criteria:
- Naam of beschrijving: Voer tekst in om tools te vinden die overeenkomen met een specifieke naam of een specifiek doel.
- Statustype: Filter aanroepen op hun huidige status, zoals Afgerond, Fout, Geannuleerd of In behandeling.
- Tooltype: Selecteer deze optie om te filteren op declaratieve tools die zijn gedefinieerd in HTML en imperatieve tools die zijn gedefinieerd in JavaScript. Als je alle tooltypen wilt zien, zorg je dat geen van beide filters actief is.
Tools handmatig testen
Je kunt de beslissingslogica van de AI-agent omzeilen om de betrouwbaarheid van je tool onafhankelijk te testen. Dit is handig om de functielogica te verifiëren zonder te wachten op een specifieke agentprompt.
Klik in de lijst Beschikbare tools op de tool die je wilt testen. Je kunt ook in het logboek Aangeroepen tools de cursor op een tool plaatsen om het icoon Afspelen (➜) te tonen en erop te klikken. Het handmatige testgebied wordt geopend.
Voer in het handmatige testgebied parameters in de invoervelden in of pas ze aan.
Klik op Tool uitvoeren.
Integratieproblemen oplossen
Met het deelvenster WebMCP kun je veelvoorkomende integratiefouten opsporen:
- Schendingen van het schema: In het uitvoervenster worden foutmeldingen getoond als de toolparameters of retourwaarden niet overeenkomen met het gedefinieerde schema.
- Afwijzing door agent: Check de aanroepteller in de lijst Beschikbare tools om na te gaan of de agent je tool ooit heeft overwogen voor een bepaalde prompt.
Automatisering en agents
WebMCP is ontworpen voor het agentische web, waar AI-agents de tools van je site kunnen ontdekken en ermee kunnen communiceren. Voor ontwikkeling met hulp van agents biedt het Chrome DevTools voor agents project een gespecialiseerde interface die dit protocol gebruikt om AI agents te helpen je WebMCP-tools te testen en te gebruiken.
Opdrachtregelflags
De WebMCP-tools in Chrome DevTools voor agents (list_webmcp_tools en execute_webmcp_tool) staan standaard uit. Als je ze wilt aanzetten, voeg je de flag --categoryExperimentalWebmcp toe aan je serverargumenten:
"args": ["chrome-devtools-mcp@latest", "--categoryExperimentalWebmcp"]
Ga naar Configuratie voor meer opties.
Gerelateerde bronnen
Ga naar de volgende bronnen voor meer informatie over WebMCP en het agentische web: