Sets up WebMCP projects: enables Chrome flags or MCP-B polyfill, scaffolds tool registration via navigator.modelContext, configures dev environment for AI agent tools on new websites.
npx claudepluginhub orcaqubits/agentic-commerce-skills-plugins --plugin webmcp-browser-agentsThis skill is limited to using the following tools:
**Fetch live docs**:
Guides Next.js Cache Components and Partial Prerendering (PPR) with cacheComponents enabled. Implements 'use cache', cacheLife(), cacheTag(), revalidateTag(), static/dynamic optimization, and cache debugging.
Migrates code, prompts, and API calls from Claude Sonnet 4.0/4.5 or Opus 4.1 to Opus 4.5, updating model strings on Anthropic, AWS, GCP, Azure platforms.
Automates semantic versioning and release workflow for Claude Code plugins: bumps versions in package.json, marketplace.json, plugin.json; verifies builds; creates git tags, GitHub releases, changelogs.
Fetch live docs:
https://developer.chrome.com/blog/webmcp for the latest Chrome WebMCP announcement and API overviewsite:github.com mcp-b polyfill README for the MCP-B polyfill installation and quickstartwebmcp chrome canary flag enable for current browser flag names and version requirementssite:chromestatus.com webmcp for feature status and milestonesWebMCP project setup prepares a website to expose tools to AI agents:
WebMCP for Testing flag, or install the MCP-B polyfillmcp-b packages for vanilla JS or Reactnavigator.modelContext.registerTool()my-webmcp-site/
├── src/
│ ├── webmcp/
│ │ ├── tools.js # Tool definitions and registration
│ │ ├── schemas.js # JSON Schemas for tool inputs
│ │ └── interactions.js # User interaction handlers
│ ├── index.html # Page with optional declarative form attributes
│ └── app.js # Main application entry
├── package.json
└── tests/
└── webmcp.test.js
my-webmcp-react-app/
├── src/
│ ├── webmcp/
│ │ ├── tools.ts # Tool definitions
│ │ ├── schemas.ts # JSON Schemas
│ │ ├── McpProvider.tsx # MCP-B React provider/hooks wrapper
│ │ └── interactions.ts # User interaction logic
│ ├── App.tsx
│ └── index.tsx
├── package.json
├── tsconfig.json
└── tests/
└── webmcp.test.tsx
registerTool), Declarative (HTML attributes), or both?To enable native WebMCP in Chrome Canary:
chrome://flagsFor browsers without native WebMCP, the MCP-B polyfill provides the same API surface. Fetch the README for exact installation commands, as packages and APIs may have changed.
Fetch the latest Chrome blog post and MCP-B README for exact commands, package names, and API patterns before scaffolding.