The Chrome team explains WebMCP with real demos: register tools on your site so agents can stop screenshotting and clicking
The agent-ready web: Simplify user actions with WebMCP — Tara Agyemang, Google · Tara Agyemang
21 min total·Actually worth watching closely: ~12 min·3 must-watch clips
- 0:15 – 3:20Watch
The problem: how brittle agents on the web are
AI agents are increasingly using the web on people's behalf, but today that means parsing the entire DOM, reading the accessibility tree, screenshotting, measuring coordinates and clicking, and an ad loading at the top can push the content down so the click lands in the wrong place.
Screen-scraping the web is long, brittle and token-heavy. That's why WebMCP exists.
From 1:58 there's a full visualisation of the flow, and the screen shows how long the process is far better than the words do▶ Jump to 0:15Speaker · Tara Agyemang - 3:20 – 7:16Watch
What WebMCP is, and the Inspector
Introduces the WebMCP proposal, a site defining its capabilities as structured tools for agents to call directly, and shows the Model Context Tool Inspector, a Chrome side-panel extension that lists every tool it finds on your page and lets you call them.
Get semantic HTML, accessibility and the other web foundations right and you're already halfway to an agent-ready site
From 5:00 the Inspector extension and the Maze Escape demo page are on screen; this is the console for every demo that follows, so it's worth seeing what it looks like▶ Jump to 3:20Speaker · Tara Agyemang - 7:16 – 10:00Watch
Maze demo: tool calls live
A single "complete the maze" prompt drives the agent: it maps natural language onto direction parameters for the move tool and keeps calling tools on its own, picking up items and using them, until it's out of the maze.
The agent decides which tool to call, with what parameters, and how many times. The site just has to define the tools well.
This is pure live demo; the agent stepping through the maze is the content, and audio alone misses it entirely▶ Jump to 7:16Speaker · Tara Agyemang - 10:00 – 12:52Listen
How WebMCP relates to MCP
Clarifies that they're complementary, not replacements: MCP is server-side, needs your own server, and is accessible anywhere at any time; WebMCP is the implementation of the tools part of MCP inside the browser, specific to client-side features, and needs an open browser window.
Having an MCP server doesn't mean you don't need WebMCP; they cover the client side and the server side
A spoken conceptual comparison with nothing critical on screen, fine as audio on a commute▶ Jump to 10:00Speaker · Tara Agyemang - 12:52 – 14:18Skim
Declarative API: just add attributes to a form
Add a few attributes, tool name and tool description, to a standard HTML form and the browser automatically generates a JSON schema using the form fields as parameters. There's also an agent-invoked Boolean attribute so you can tell whether the form was filled in by an agent or a human.
For simple forms the cost is close to zero: add a few HTML attributes and the browser writes the schema for you
Mostly code slides; skim the example attributes to get the point rather than following line by line▶ Jump to 12:52Speaker · Tara Agyemang - 14:18 – 15:56Skim
Imperative API: registerTool in practice
Use registerTool to write your own schema and descriptions for more complex, multi-step UI flows; this is the one most people use. Key points: descriptions must be descriptive enough that the agent knows when to call the tool; execute is just normal JavaScript, often a light wrapper around functions you already have; and always return information about what happened.
The quality of your tool description decides whether the agent calls your tool at all, and calls it correctly
Mostly API usage over code slides; glance at the structure and hold on to the three practical rules▶ Jump to 14:18Speaker · Tara Agyemang - 15:56 – 18:20Watch
Ticket demo: chained calls and human-agent handoff
The agent calls search concerts, open concert page and purchase ticket in turn to buy tickets across pages; tools are registered per page, the UI updates at every step, and real payment is left to the user.
Keep the UI in sync with every tool call, and leave the critical action to the user. Two ground rules for mixed human-agent browsing.
The highest-value live demo in the talk; the page navigation and the selected ticket tier only make sense on screen▶ Jump to 15:56Speaker · Tara Agyemang - 18:20 – 21:13Listen
Getting set up, and the early preview caveat
How to try it: Chrome Canary with the WebMCP testing flag in the URL, plus the Inspector extension for debugging. The two resources are the early preview blog post and the GitHub repository with the demo source and the eval CLI. The API is very experimental and the team wants feedback.
You can try it in Canary today, but the API will change; don't put it in production
The close is a spoken list of resources and status; noting the blog post and the GitHub repo is enough▶ Jump to 18:20Speaker · Tara Agyemang