# Add Webmcp

Analyze an existing web application, identify safe user-visible capabilities across...

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

## Install

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

## Description

Analyze an existing web application, identify safe user-visible capabilities across routes, forms, server actions, handlers, and schemas, then implement first-party WebMCP tools and validate discovery and invocation with Stagehand. Use when the user asks to make a codebase agent-ready, expose website features as WebMCP tools, or add WebMCP directly to an app rather than generating a standalone injection script from a URL.

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

# Add WebMCP

Turn capabilities already implemented by a web app into maintained, first-party WebMCP tools. Modify the target codebase and its tests; do not introduce a hosted proxy or third-party runtime.

Compatibility: the bundled Stagehand validator requires Node.js 22.18 or newer. Validation needs Chrome/Chromium locally or `BROWSERBASE_API_KEY` for a publicly reachable preview.

Be verbose as you work: report what each step found as you go, not only in the final report.

Use `webmcp-gen` instead when the requested output is a standalone init script derived from a live URL. This skill starts from source code and integrates tools into the application.

## 1. Establish the application boundary

Read the target repository's instructions, package manifests, framework configuration, and current git status. Preserve unrelated changes.

Set `ADD_WEBMCP_SKILL_DIR` to the directory containing this file and run the bounded scanner:

```bash
node "$ADD_WEBMCP_SKILL_DIR/scripts/scan-codebase.mjs" "$TARGET_REPO"
```

Treat scanner results as leads, not conclusions. In a monorepo, identify the actual browser app and the server packages it calls before editing.

## 2. Build a capability inventory

Trace each candidate from its user-visible entry point through the client handler, validation schema, server boundary, authorization checks, side effect, and returned state. Look at:

- routes and screens;
- forms and their submit handlers;
- server actions, API handlers, RPC procedures, and service clients;
- Zod, Valibot, Yup, Joi, JSON Schema, or equivalent validators;
- authentication, authorization, CSRF, idempotency, rate limits, and audit hooks.

Prefer complete user tasks such as `search_catalog` or `save_draft`, not a mechanical tool per endpoint. Exclude internal/admin-only operations, authentication bypasses, raw database access, secret-bearing operations, and capabilities the UI does not grant the current user.

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