WebMCP Tool Development Workflow (build-webmcp-tools)

WebMCP lets a web page expose client-side capabilities as structured tools to in-browser AI agents on document.modelContext, instead of agents scraping or clicking the DOM. This skill routes a developer to the right stage of the tool lifecycle and points to the reference file that holds the detailed rules and code for that stage.

Key tenet: WebMCP runs client-side in the browser tab on document.modelContext, inside the user's authenticated session. It supports Tools only (no Resources or Prompts). It is not a backend MCP server over stdio/SSE, and tools execute application logic (state stores, APIs, client routers) directly rather than simulating typing or clicks.

How to Use This Skill

1. Match the developer's request to a row in the Router and go to that stage.
2. Read the files in the "Read first" column before responding. Paths are relative to this skill's directory. This file only summarizes them; the detailed rules, examples, and code patterns live in the references, so do not answer from this summary alone.
3. If the request refers to an artifact you were not given (transcripts, schema.json, source files), read it if it is available in the workspace; otherwise ask for it, and outline how you will apply the stage's key rules from its reference file (for audits, include the verification steps). Never invent the missing artifact.
4. Apply the Non-Negotiables to everything you produce.
5. Before finishing an audit, schema.json, or implementation, check your output against references/audit-checklist.md.