{"slug": "building-for-the-webmcp-challenge-expose-your-real-actions-not-a-chatbot", "title": "Building for the WebMCP Challenge? Expose your real actions, not a chatbot", "summary": "OpenAI, in partnership with Chrome, Cloudflare, Shopify, Vercel, and Netlify, has launched the WebMCP Challenge, a hackathon running from August 25 to September 3 on Devpost with $35,000 in prizes. The challenge encourages developers to build tools using WebMCP, a browser API that allows web pages to expose real actions to AI agents. An open-source maintainer of a WebMCP tool advises participants to register actual site actions rather than chat interfaces and to return structured data from tools to ensure agent demos succeed.", "body_md": "The [WebMCP Challenge](https://openai.com/webmcp-challenge/) is live — OpenAI with Chrome, Cloudflare, Shopify, Vercel, Render, and Netlify, running Aug 25–Sep 3 on [Devpost](https://webmcp.devpost.com/), with $35k in prizes. Ten days to build something with WebMCP: the browser API that lets a page hand AI agents real tools to call instead of making them click through your UI.\n\nI maintain an open-source WebMCP tool (disclosed bias — link at the end), so I've watched a lot of these builds. The projects that demo cleanly and the ones that fall apart in front of an agent differ on exactly two things. If you're building this week, here they are.\n\nThe reflex is to register a `chat`\n\nor `ask`\n\ntool that wraps a search box. Don't. An agent already *is* the chat interface — it doesn't need another one. What it can't do is **your site's actions**: search your catalog, add to cart, check availability, book a slot, submit the form. Register those.\n\n```\ndocument.modelContext.registerTool({\n  name: \"search_catalog\",\n  description: \"Search products in this store\",\n  inputSchema: {\n    type: \"object\",\n    properties: { q: { type: \"string\" } },\n    required: [\"q\"],\n  },\n  async execute({ q }) {\n    const res = await fetch(`/api/search?q=${encodeURIComponent(q)}`);\n    const items = await res.json();\n    return {\n      content: [{ type: \"text\", text: `${items.length} results for \"${q}\"` }],\n      structuredContent: { items },\n    };\n  },\n});\n```\n\n(The registration getter moved from `navigator.modelContext`\n\nto `document.modelContext`\n\non Aug 10 — feature-detect both if you want to be safe, and gate on support so non-agentic browsers are unaffected.)\n\nThis is the one that fails demos. A human reads your page; an agent reads **what your tool returns**. So a tool that does its job and returns `{ ok: true }`\n\n— or navigates the page and returns nothing — has told the agent nothing. The next step in the agent's plan has no data to act on, so it stalls or hallucinates.\n\nReturn the actual result as `structuredContent`\n\n: the items found, the new cart total, the booking confirmation number, the validation error. Treat every tool's return as an API contract you now owe the agent — because that's what it is.\n\nThree failure modes to check before you record your demo:\n\n`{ ok: true }`\n\nfrom a search tool. Return the results instead.The Challenge grades a working demo. Two things it won't surface that bite the moment a real agent hits your site:\n\nNeither is hard to reason about; both are easy to forget while racing a 10-day clock.\n\nIf your project is an existing site rather than a greenfield app, you don't have to hand-write a `registerTool`\n\nfor every action. [Latch](https://latch.tools/?ref=devto-hackathon) is an MIT-licensed one-line script that auto-detects your search, cart, and forms and exposes them as WebMCP tools — handy when you want coverage fast and time is the constraint ([source](https://github.com/r0bertini/latch)). Write them yourself if you want full control; either way, the two rules above still decide whether your demo works.\n\nGood luck in the Challenge. Build the actions, honor the return contract, and your agent demo will do the thing on the first take.", "url": "https://wpnews.pro/news/building-for-the-webmcp-challenge-expose-your-real-actions-not-a-chatbot", "canonical_source": "https://dev.to/r0bertini/building-for-the-webmcp-challenge-expose-your-real-actions-not-a-chatbot-4d1f", "published_at": "2026-08-27 01:15:11+00:00", "updated_at": "2026-08-27 01:48:40.318016+00:00", "lang": "en", "topics": ["developer-tools", "ai-agents", "ai-products"], "entities": ["OpenAI", "Chrome", "Cloudflare", "Shopify", "Vercel", "Netlify", "Devpost", "Latch"], "alternates": {"html": "https://wpnews.pro/news/building-for-the-webmcp-challenge-expose-your-real-actions-not-a-chatbot", "markdown": "https://wpnews.pro/news/building-for-the-webmcp-challenge-expose-your-real-actions-not-a-chatbot.md", "text": "https://wpnews.pro/news/building-for-the-webmcp-challenge-expose-your-real-actions-not-a-chatbot.txt", "jsonld": "https://wpnews.pro/news/building-for-the-webmcp-challenge-expose-your-real-actions-not-a-chatbot.jsonld"}}