Graft

WebMCP is beginning to give websites a native way to expose tools to agents. Most websites were built long before that interface existed, and even early WebMCP adopters have little visibility into the contracts their production pages register.

Graft gives both groups a practical path forward. It compiles semantic HTML into reviewable WebMCP contracts, exports those contracts as a self-contained adapter and verifies what a deployed site actually shipped.

Judge path, under 60 seconds

Open https://graft-webmcp.vercel.app/#verify-deployment in ChatGPT's in-app browser. No sign-in or API key is required. Confirm Graft reports seven built-in WebMCP tools in its header. Click “Verify the 8-tool surface.” Read the exact eight names, the 5 of 5 score, the expected-name match and the zero-findings result. Open https://omnidev-flame.vercel.app/agent-lab/ and see the same eight-tool registry on the independent origin. Ask the agent: “List the patch candidates, inspect PATCH-104 and apply the recommended patch.” Review the exact diff, approve it in page and watch the deterministic result move to 3 of 3 checks verified.

Chrome 149 or later with chrome://flags/#enable-webmcp-testing is the supported alternative. The interface remains usable without native WebMCP and now explains exactly which capabilities still work.

The problem

An agent visiting an ordinary website still has to infer intent from page structure, text or pixels. A site owner can hand-write WebMCP tools, but repeating that work across an existing product or content estate is slow and easy to get wrong.

Contracts also drift after launch as a site changes. Today an owner has no simple way to point at a deployed URL and inspect the WebMCP surface that a browser can see.

Graft treats migration and verification as two directions through the same pipeline.

What Graft does

Paste a public URL or choose an owned fixture. Graft reads the page through a guarded server-side intake, removes scripts, frames and network attributes, then derives typed tool candidates from semantic forms, repeated content, tables and page structure.

Every candidate includes:

A tool name and focused description A JSON Schema with bounded inputs WebMCP annotations such as readOnlyHint and untrustedContentHint A confidence score with the exact positive and negative evidence behind it A review state that determines whether the candidate can ship

Clear read operations can register automatically. Ambiguous candidates are held for a person. Derived write actions never register automatically.

After review, the owner downloads one JavaScript adapter. The adapter now includes Graft's runtime, the reviewed contracts and the selectors used to derive them. On the owner's site, await registerGraftTools() registers every reviewed read-only tool against the live DOM with no handler code and no dependency on Graft's host. Owners can override any read tool and must explicitly bind every action that changes state.

Graft also works in reverse. graft_verify_url opens a deployed page in a real browser, reads the tools it actually registers and reports contract quality, naming collisions and drift from the reviewed export.

Why this belongs on WebMCP

Graft produces typed contracts that register through document.modelContext.registerTool() and can be discovered and called through the browser's WebMCP surface. Agents receive an explicit capability interface instead of guessing where to click.

That gives people and agents distinct jobs in one workflow:

An agent can ask Graft to compile a URL and inspect the evidence behind each candidate. A person reviews uncertainty, repairs descriptions and decides which tools may ship. The exported runtime executes approved read tools against the owner's current DOM. State-changing tools remain locked until the owner binds real product behavior. An agent can verify the deployed site later and report drift without access to its source code.

Agents receive named capabilities, schemas and exact arguments instead of interpreting screenshots. Owners keep control over what ships, especially anything that mutates data or page state.

Graft is WebMCP-enabled itself. Seven native graft_ tools let an agent compile a URL, list candidates, inspect confidence evidence, change review state, export an adapter and verify a deployment without operating the interface manually. Every call also appears in a visible execution timeline with its arguments, result, duration and status.

Independent interactive proof

Graft's independent interactive proof runs on OmniDev, a separate origin that Graft does not serve:

https://omnidev-flame.vercel.app/agent-lab/

That page carries an adapter generated by Graft and exposes exactly eight WebMCP tools:

get_page_summary get_page_outline list_files get_file list_patches get_patch list_test_results apply_patch

The first seven expose orientation, file evidence, bounded patch candidates and deterministic test results. apply_patch is the consequential tool. It cannot mutate the fixture until a person approves the exact replacement through a visible in-page checkpoint. Approval requires a trusted browser action, is scoped to one patch and is consumed once. The demo mutation changes deterministic in-memory state only. It never writes a visitor's filesystem or calls a backend.

The Agent Lab makes that contract legible to both judges and agents. It shows the eight exact names, the baseline code, the proposed result, the approval gate and the verified outcome. It does not label the surface live until the browser reports the complete ordered registry.

Graft verifies this integration from the outside. Click “Verify the 8-tool surface” in the live deployment audit and Graft opens the OmniDev page in a WebMCP-capable browser. The current public result is:

8 tools live 5 of 5 checks passed Exact expected-name match No contract findings

The verifier and target run on separate origins. The public Agent Lab adapter is byte-identical to the generated adapter committed in the OmniDev repository and its provenance is pinned to the exact Graft generator revision.

An additional exported-adapter proof remains available at https://graft-owner-example.vercel.app. It exposes six WebMCP tools: five generated read tools and one owner-approved, owner-bound write action. It demonstrates the same exported runtime on another independent origin.

The current demo video shows Graft's core compile, govern, export, execute and verify loop on the owner fixture. OmniDev is the newer interactive proof available through the live links below.

Implementation

The main pipeline is: public URL or owned fixture -> guarded server-side intake -> inert sanitizer and normalized snapshot -> deterministic semantic recipes -> typed candidates with confidence evidence -> human review and publication gate -> native WebMCP registration -> self-contained adapter export -> external deployment verification

Graft is built with React 19, TypeScript and Vite, then deployed on Vercel. The compiler is deterministic, so the same semantic input can be inspected, reproduced and regression-tested without model variance.

The intake rejects private and link-local addresses at every redirect hop, refuses sensitive domain categories, honors robots.txt, forwards no cookies or credentials and stores no target content. Target scripts never execute in the client. Rendered pages run with credentials and downloads disabled, then pass through the same sanitizer.

The exported adapter awaits native registration, rolls back partial failures and exposes cleanup. The runtime handles the read recipes Graft can prove. Owners still provide every production write handler, integration test and security review.

The browser smoke test downloads the generated file, serves it from an unrelated origin, confirms that Chrome registers every exported tool with zero missing handlers and proves that an owner override receives schema-valid arguments. A separate owner-site smoke executes all six live tools.

How AI and Codex were used

The product itself does not call a model API. AI enters through the browser agent that discovers and invokes Graft's WebMCP tools and the tools exported to owner sites.

OpenAI Codex and Claude were used during development. Codex helped refine the PRD, inspect the repository, implement and review the compiler and control plane, diagnose browser failures, strengthen security boundaries, write deterministic tests and verify the live deployments. Browser failures became regression tests instead of being accepted as demo-only problems.

Product claims were checked against the test suite, production builds, Chrome's native registry, the export smoke test or the separately deployed owner site.

What changed during the challenge

The research and tutorial below predate the challenge, but Graft itself was started on August 26, after the submission period opened on August 25. During the challenge I built the deterministic HTML-to-contract compiler, guarded URL intake, seven native control-plane tools, governed review flow, self-contained adapter export, external deployment verifier, OmniDev Agent Lab integration, owner-site proof and regression/security test suite. The public Git history records that work from the initial challenge build through the final submission-hardening commit 330ca08.

Research and education behind Graft

Before the submission period, I wrote a practical WebMCP explainer covering the browser API, human control and the relationship between WebMCP and server-side MCP:

https://www.linkedin.com/posts/himanshu748_webmcp-aiagents-webdevelopment-activity-7434247987377352705-qC_d

I then created a 17-section Codédex tutorial, Build a WebMCP-Ready Portfolio Website, that walks through a portfolio with seven agent tools, no backend and a real browser registration path:

https://github.com/himanshu748/webmcptutorial/blob/main/tutorial.md

Graft turns that research into infrastructure for existing website owners. They can start with the semantic HTML they already have, review the proposed interface and ship one adapter instead of rebuilding the site around agents.

Links

Live app and verifier: https://graft-webmcp.vercel.app/#verify-deployment Eight-tool Agent Lab proof: https://omnidev-flame.vercel.app/agent-lab/ Agent Lab source: https://github.com/himanshu748/omnidev/tree/main/site/agent-lab Owner integration fixture: https://graft-owner-example.vercel.app Public repository: https://github.com/himanshu748/graft-webmcp Demo video: https://youtu.be/uh0QkwJmq8s License: MIT

Honest limits

Semantic pages compile better than heavily client-rendered or visually structured pages. Bot-protected sites may refuse the server-side read. Graft proposes and runs bounded read contracts, but owners remain responsible for production writes, authentication, integration tests and security review. Chrome versions expose different schema detail to verification, so checks that cannot be proved are reported as inconclusive.

Built With

Share this project:

Updates