# Webmcp Gen

Create, compile, and validate site-specific WebMCP init scripts from a target URL and...

- Repository: https://github.com/browserbase/skills (3748 stars)
- Category: Testing
- License: MIT
- Last updated: 2026-10-27
- Runs scripts: yes, review before use

## Install

Claude Code: `npx skills add browserbase/skills --skill webmcp-gen -g -a claude-code -y`
Codex: `npx skills add browserbase/skills --skill webmcp-gen -g -a codex -y`
Cursor: `npx skills add browserbase/skills --skill webmcp-gen -g -a cursor -y`
Gemini CLI: `npx skills add browserbase/skills --skill webmcp-gen -g -a gemini-cli -y`
Claude Code plugin marketplace: `/plugin marketplace add browserbase/skills`

## Description

Create, compile, and validate site-specific WebMCP init scripts from a target URL and desired tool capability. Use when the user wants to author WebMCP tools for a website, produce a webmcp.init.js artifact, or test WebMCP registration and invocation through Stagehand.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# WebMCP Gen

Author website-specific WebMCP tools by writing a manifest, compiling it to an init script, and validating that Chrome registers and invokes the tools.

This skill does not call a nested agent. You are responsible for exploring the page, writing `manifest.json`, and iterating based on validation output.

## Setup check

From the skill directory, install dependencies if they are not already installed:

```bash
cd skills/webmcp-gen
pnpm install
```

This installs the pinned Stagehand package plus the TypeScript toolchain (`tsx`,
`typescript`, `@types/node`) used to run the generated `stagehand-example.ts`.

## Workflow

1. Pick an artifact slug with exactly one slash:

```text
<domain>/<task>
```

Example:

```text
example.com/page-context
```

2. Scaffold the artifact:

```bash
node scripts/scaffold.mjs example.com/page-context --url https://example.com
```

3. Explore the target page with the `browse` CLI:

```bash
browse open https://example.com --local
browse snapshot
browse get title
browse get url
browse get text body
browse get html body
```

Prefer `browse snapshot`, page text, and DOM inspection over screenshots unless visual layout matters. Use `browse stop` when exploration is complete.

4. Edit `artifacts/<domain>/<task>/manifest.json`. The manifest is the source of truth.

5. Compile:

```bash
node scripts/compile.mjs artifacts/example.com/page-context
```

6. Generate a runnable Stagehand example (`stagehand-example.ts`) and run it with `tsx`:

```bash
node scripts/generate-stagehand-example.mjs artifacts/example.com/page-context
npx tsx artifacts/example.com/page-context/stagehand-example.ts
```

7. Validate:

```bash
node scripts/validate.mjs artifacts/example.com/page-context
```

8. If validation fails, inspect `eval.json` and `eval-report.md`, patch `manifest.json`, then compile and validate again.

## Manifest contract

The rest: https://github.com/browserbase/skills/blob/HEAD/skills/webmcp-gen/SKILL.md