Turn app actions into tested WebMCP tools.
A visual configurator and zero-dependency CLI for exposing selected React and Next.js actions through the evolving WebMCP browser API.
Try the live configurator · Read the compatibility notes · Open an issue
WebMCP lets an application expose typed, page-scoped tools to compatible browser agents. WebMCP Configure helps you define a useful tool surface, inspect the generated registration, and check the same visible outcome a person would see.
The repository includes a working catalog configurator. Clone it, run the site, and select Run tool:
git clone https://github.com/Ar9av/webmcp-configure.git
cd webmcp-configure
npm install
npm run devTo generate a registration module, run the zero-dependency CLI from the cloned repository and point --out at the target project:
node bin/webmcp-configure.mjs init \
--name search_catalog \
--description "Search the visible product catalog." \
--handler catalog.search \
--out src/webmcp-tools.tsThe command refuses to overwrite an existing file unless --force is supplied. It also rejects output paths outside the current project. Run with --dry-run to inspect the module without writing it.
- Configures a tool name, description, representative input, and handler binding.
- Generates current-draft code against
document.modelContext. - Uses an
AbortControllerso tools unregister with their route or component. - Registers two real tools on the included catalog demo.
- Updates the visible catalog when the filter tool executes.
- Reports when the native API is available and provides a clearly labeled preview path otherwise.
- Ships a zero-dependency generator CLI with overwrite and path safeguards.
const registration = new AbortController();
await document.modelContext?.registerTool(
{
name: "search_catalog",
description: "Search the visible product catalog.",
inputSchema: {
type: "object",
properties: {},
additionalProperties: false,
},
execute: async (input) => catalog.search(input),
annotations: {
readOnlyHint: false,
untrustedContentHint: false,
},
},
{ signal: registration.signal },
);The empty schema is deliberate: the CLI cannot safely infer your application contract. Review the generated file, define the actual JSON Schema, and set annotations based on what the handler does.
The project checks the useful contract instead of treating registration as success:
filter_productsis registered with a bounded JSON Schema.- A valid invocation returns the matching product and updates the visible catalog.
- Invalid categories and prices reject without changing the result.
- Registration cleanup is owned by an abort signal.
Run the automated checks:
npm test
npm run lint
npm run buildWebMCP is a Draft Community Group Report and can change. This alpha follows the document.modelContext interface in the September 4, 2026 draft and has been exercised with the ChatGPT desktop browser implementation. See compatibility notes for the tested surface and limitations.
The current release is a focused working slice. Source scanning, automated patch application, additional framework adapters, and saved browser reports are planned in PLAN.md.
- Small tool surfaces. Expose the actions that complete real user journeys, not every internal function.
- Visible outcomes. A tool should drive the same state and authorization path as the human interface.
- Readable ownership. Generated code belongs to the application and remains straightforward to change or remove.
- Honest compatibility. Native execution, preview execution, and unsupported environments stay distinguishable.
- Local by default. The CLI has no telemetry, account, network request, or runtime dependency.
Issues and focused pull requests are welcome. Start with CONTRIBUTING.md, and report security concerns through SECURITY.md.
MIT © Ar9av