Publish Sign in

Webmcp

Implement WebMCP in web projects — add browser-native structured tools for AI agents using imperative JS or declarative HTML APIs.

You say
Install this skill Read the source first Free Written by qdhenry · unverified publisher
Context cost
22.3k tokensestimated from the bundle, loaded when it triggers
Bundle
15 files · 89.1 kBtext throughout, nothing executable
Licence
free to use
Last change
—no release on file
Servers it uses
Noneruns standalone

What it does

Implement WebMCP in web projects — add browser-native structured tools for AI agents using imperative JS or declarative HTML APIs. Full lifecycle from setup through testing and optimization.

Installed, it changes the agent in these ways.

What this skill changes about the agent is not written down here yet. The listing was collected from its source, and the description is in its own SKILL.md.

Workflow

Runs a procedure end to end.

browserautomation
Filed under

Web, Search & Scraping

The skill itself

This is the whole product. A skill is instructions the model reads, so there is nothing behind the listing you cannot see first — the front matter loads with every session, and the body below it loads when the skill triggers.

SKILL.md4.3 kB · 111 lines
--- name: webmcp description: Implement WebMCP in web projects — add browser-native structured tools for AI agents using imperative JS or declarative HTML APIs. Full lifecycle from setup through testing and optimization. ---
6<essential_principles>
7
8WebMCP is a browser-native standard that exposes structured tools for AI agents on websites. Instead of screen-scraping, agents interact through typed JavaScript APIs and HTML annotations.
9
10**Two APIs:**
11- **Imperative API** — window.navigator.modelContext — register tools via JavaScript
12- **Declarative API** — HTML toolname/tooldescription attributes on <form> elements
13
14**Prerequisites:** Chrome 146.0.7672.0+, chrome://flags/#enable-webmcp-testing enabled.
15
16**Core principles that always apply:**
17
181. **Tools must be atomic and composable** — one function per tool, no overlapping tools with nuanced differences. Combine similar tools into one with input parameters.
19
202. **Accept raw user input** — tools should accept natural strings (e.g., "11:00") not computed values (e.g., minutes-from-midnight). Minimize cognitive computing for the model.
21
223. **Validate in code, not schema** — schema constraints are helpful but not guaranteed. Validate within execute functions and return descriptive errors so agents can self-correct.
23
244. **Update UI before returning** — agents use UI state to verify execution. Ensure execute/submit logic updates visible state before resolving.
25
265. **Positive, verb-first descriptions** — describe what the tool does and when to use it. Avoid negations. "Creates a calendar event for a specific date" not "Do not use for weather."
27
28</essential_principles>
29
30<intake>
31What would you like to do?
32
331. **Set up WebMCP** in a project (initial integration)
342. **Add a tool** using the imperative JavaScript API
353. **Add a tool** using the declarative HTML form API
364. **Debug** WebMCP tools that aren't working
375. **Audit** existing WebMCP implementation for best practices
386. **Test** WebMCP tools
397. Something else
40
41**Wait for response before proceeding.**
42</intake>
43
44<routing>
45| Response | Workflow |
46|----------|----------|
47| 1, "setup", "integrate", "install", "start" | workflows/setup-webmcp.md |
48| 2, "imperative", "javascript", "js", "register", "programmatic" | workflows/add-imperative-tool.md |
49| 3, "declarative", "html", "form", "annotate" | workflows/add-declarative-tool.md |
50| 4, "debug", "fix", "broken", "not working", "error" | workflows/debug-webmcp.md |
51| 5, "audit", "review", "check", "best practices" | workflows/audit-webmcp.md |
52| 6, "test", "verify", "inspect" | workflows/test-webmcp.md |
53| 7, other | Clarify, then select workflow or references |
54
55**After reading the workflow, follow it exactly.**
56</routing>
57
58<reference_index>
59
60All in references/:
61
62**APIs:** imperative-api.md, declarative-api.md
63**Design:** tool-design.md
64**Events:** events-and-css.md
65**Quality:** testing.md, anti-patterns.md
66
67</reference_index>
68
69<workflows_index>
70
71All in workflows/:
72
73| Workflow | Purpose |
74|----------|---------|
75| setup-webmcp.md | Initial WebMCP integration into a project |
76| add-imperative-tool.md | Register tools via JavaScript API |
77| add-declarative-tool.md | Annotate HTML forms as WebMCP tools |
78| debug-webmcp.md | Diagnose and fix WebMCP issues |
79| audit-webmcp.md | Review implementation against best practices |
80| test-webmcp.md | Test tools with inspector extension and agents |
81
82</workflows_index>
83
84<templates_index>
85
86All in templates/:
87
88| Template | Purpose |
89|----------|---------|
90| imperative-tool.md | Scaffolding for JS-registered tools |
91| declarative-form.md | Scaffolding for HTML form-based tools |
92
93</templates_index>
94
95<verification_loop>
96
97After every WebMCP change:
98
991. Open Chrome DevTools console — check for JS errors
1002. Verify navigator.modelContext exists (Chrome flag enabled?)
1013. Use Model Context Tool Inspector extension to list registered tools
1024. Manually execute a tool from the inspector to confirm it works
1035. Check that UI updates are visible after tool execution
104
105Report to user:
106- "Tools registered: X imperative, Y declarative"
107- "Tool [name]: executes successfully / returns error [detail]"
108- "UI state: updates correctly after execution / missing update"
109
110</verification_loop>
111
In the file
SKILL.md564 words
Files15
Licence
Why you can read it

Nothing in a skill executes. The client loads the text and the model follows it, so a skill can be audited the way a runbook is — by reading it.

What it costs in context

Skills are not billed by the call. They are paid for in context: every token the instructions occupy is a token your code, your diff and your conversation cannot use. Here is what this one takes and when it takes it.

≈60
always loaded
The name and description, so the model knows the skill exists and when to reach for it.
22,215
on trigger
The instruction body and 14 supporting files, read only when the skill fires.
11.1%
of a 200k window
Ten skills this size would take about 111% of the window before you open a file.
050k100k150k200k context window

22.3k tokens, estimated from the bundle at four bytes to the token, held for the rest of the session once it triggers. Heavy. Teams tend to install this one per project rather than globally, and load it only when the job comes up.

Servers bill, skills cost

A server charges by the month. A skill charges once per session, in context, and then keeps charging it for as long as the session lives.

Before and after

The same question, put to the same model twice: once as it comes, and once with these instructions loaded.

No worked example has been published for this skill yet.

Adoption
Installsnone yet
Ratingno reviews yet

The procedure it runs

The procedure has not been published here. It is in the skill’s own SKILL.md, which its author has not sent to the marketplace yet.

Prose, not code

These steps are written for a model to follow, not executed by a runtime. It can still be told to skip one, and it will say so when it does.

Servers it uses

None. This skill calls no MCP servers at all.

Everything it needs is in the instructions, so it works in a project with nothing connected — the model reads the file and changes how it works with what it can already reach.

It writes no files and reaches no network. All it changes is how the model reasons and writes.

What it asks for
Writes filesno
Network accessno

Read from the allowed-tools line of this skill’s own SKILL.md. A skill grants no permissions of its own — it can only ask for tools your client already has.

What it will not do

Every skill is narrow, and the useful ones say where they stop. These are the jobs this one is the wrong tool for.

What this skill is not for has not been published here. Nothing is implied by that: it is a section the author has not filled in.

What is in the bundle

15 files, 89.1 kB on disk. A bundle is text throughout: the instructions the model reads, plus the templates it fills in.

  • SKILL.md4.3 kB
  • references/anti-patterns.md12.0 kB
  • references/declarative-api.md9.0 kB
  • references/events-and-css.md6.3 kB
  • references/imperative-api.md8.5 kB
  • references/testing.md5.9 kB
  • references/tool-design.md7.7 kB
  • templates/declarative-form.md4.0 kB
  • templates/imperative-tool.md3.3 kB
  • workflows/add-declarative-tool.md5.5 kB
  • workflows/add-imperative-tool.md4.6 kB
  • workflows/audit-webmcp.md5.1 kB
  • workflows/debug-webmcp.md4.7 kB
  • workflows/setup-webmcp.md2.6 kB
  • workflows/test-webmcp.md5.6 kB
What is not in it

No dependencies and nothing executable: a skill is text the agent reads, so the bundle is 15 files you can review in full before installing.

Install

Installing copies the bundle into your project. Nothing runs at install time — the files sit on disk until the model reads them.

# Webmcp · 22.3k tokens when loaded npx mcprush@latest skill add qdhenry/webmcp

Writes to .claude/skills/webmcp/ in the current project. Add --global to put it in your home directory instead, for every project.

Which clients pick it up on their own

A skill is a folder of text. A client with a skills folder reads it without being told; everywhere else the same text works, it is just handed to the model rather than found.

Claude Code.claude/skills/
Claude Desktop
ChatGPT
Cursor.cursor/skills/
VS Code.github/skills/
Codex CLI.agents/skills/
Gemini CLI.gemini/skills/
Grok.grok/skills/
Zed.agents/skills/
Windsurf.windsurf/skills/
Agent SDK.claude/skills/
HTTP / API
This release
Versionnot versioned
Publishedno release date on file
PriceFree
Referenceqdhenry/webmcp

Versions

Its author publishes no version number, so there is nothing here to pin to: what you install is the folder as it stands today. Instructions change more often than APIs do — a skill can be rewritten entirely without anything it depends on moving.

v
  • No earlier releases have been published to the marketplace.
Pinning

Nothing to pin to: this skill carries no version number of its own. What you install is what the folder holds on the day you install it.

Reviews

—no reviews yet · no installs yet

Nobody has reviewed this skill yet. The rating is the mean of the reviews written here, so there is none until somebody writes the first.

Who can post

Only accounts that have had the skill installed for fourteen days, so a review is written after living with it rather than after reading it. Publishers may reply once.

Who wrote it

QD
qdhenry

Publishes on mcprush.

0 servers listed1 skill listednot claimed
Profile
Publisher
Servers0
Claim this skill