install-playwright-mcp

Install Playwright MCP server for browser automation in Claude Code

9 stars

Best use case

install-playwright-mcp is best used when you need a repeatable AI agent workflow instead of a one-off prompt.

Install Playwright MCP server for browser automation in Claude Code

Teams using install-playwright-mcp should expect a more consistent output, faster repeated execution, less prompt rewriting.

When to use this skill

  • You want a reusable workflow that can be run more than once with consistent structure.

When not to use this skill

  • You only need a quick one-off answer and do not need a reusable workflow.
  • You cannot install or maintain the underlying files, dependencies, or repository context.

Installation

Claude Code / Cursor / Codex

$curl -o ~/.claude/skills/install-playwright-mcp/SKILL.md --create-dirs "https://raw.githubusercontent.com/jpoutrin/product-forge/main/plugins/claude-code-dev/skills/install-playwright-mcp/SKILL.md"

Manual Installation

  1. Download SKILL.md from GitHub
  2. Place it in .claude/skills/install-playwright-mcp/SKILL.md inside your project
  3. Restart your AI agent — it will auto-discover the skill

How install-playwright-mcp Compares

Feature / Agentinstall-playwright-mcpStandard Approach
Platform SupportNot specifiedLimited / Varies
Context Awareness High Baseline
Installation ComplexityUnknownN/A

Frequently Asked Questions

What does this skill do?

Install Playwright MCP server for browser automation in Claude Code

Where can I find the source code?

You can find the source code on GitHub using the link provided at the top of the page.

SKILL.md Source

# Install Playwright MCP Server

Install the Playwright MCP server to enable browser automation capabilities.

## What This Does

The Playwright MCP server provides:
- **Browser automation** - Navigate, click, fill forms, take screenshots
- **Accessibility snapshots** - LLM-friendly structured data, no vision models needed
- **Fast and lightweight** - Uses Playwright's accessibility tree

## Installation Command

Run this command to install:

```bash
claude mcp add playwright -- npx @playwright/mcp@latest
```

## Scope Options

- `--scope local` (default): Available only in current project
- `--scope project`: Shared with team via `.mcp.json`
- `--scope user`: Available across all your projects

```bash
# Install for user (all projects)
claude mcp add playwright --scope user -- npx @playwright/mcp@latest

# Install for project (team shared)
claude mcp add playwright --scope project -- npx @playwright/mcp@latest
```

## Headless Mode

For headless operation (no visible browser):

```bash
claude mcp add playwright -- npx @playwright/mcp@latest --headless
```

## Common Configurations

### With specific browser
```bash
claude mcp add playwright -- npx @playwright/mcp@latest --browser firefox
```

### With custom viewport
```bash
claude mcp add playwright -- npx @playwright/mcp@latest --viewport-size 1920x1080
```

### With isolated sessions (no persistence)
```bash
claude mcp add playwright -- npx @playwright/mcp@latest --isolated
```

## Verify Installation

After installation:
1. Restart Claude Code
2. Run `/mcp` to see the playwright server
3. Test with: "Navigate to google.com and take a snapshot"

## Available Tools After Installation

- `browser_navigate` - Go to URL
- `browser_click` - Click elements
- `browser_type` - Type text
- `browser_snapshot` - Get page accessibility tree
- `browser_take_screenshot` - Capture screenshot
- `browser_fill_form` - Fill multiple form fields
- And many more...

## Execution Instructions

When the user runs this command:

1. **Determine scope** from arguments or ask:
   - Default to `local` if not specified

2. **Run installation**:
   ```bash
   claude mcp add playwright [--scope <scope>] -- npx @playwright/mcp@latest [options]
   ```

3. **Verify success** by checking output

4. **Inform user** to restart Claude Code to use the new MCP server

Related Skills

install-lsp

9
from jpoutrin/product-forge

Install and configure LSP (Language Server Protocol) for Claude Code to enable go-to-definition, find-references, and real-time diagnostics

zod

9
from jpoutrin/product-forge

Zod schema validation patterns and type inference. Auto-loads when validating schemas, parsing data, validating forms, checking types at runtime, or using z.object/z.string/z.infer in TypeScript.

typescript-import-style

9
from jpoutrin/product-forge

Merge-friendly import formatting (one-per-line, alphabetical). Auto-loads when writing TypeScript/JavaScript imports to minimize merge conflicts in parallel development. Enforces consistent grouping and sorting.

setup-mcp-auth

9
from jpoutrin/product-forge

Configure authentication for an existing FastMCP server

fastmcp

9
from jpoutrin/product-forge

FastMCP TypeScript framework patterns for MCP servers. Auto-loads when building MCP servers, creating tools/resources/prompts, implementing authentication, configuring transports, or working with FastMCP in TypeScript.

add-mcp-tool

9
from jpoutrin/product-forge

Add a new tool to an existing FastMCP server with guided configuration

add-mcp-resource

9
from jpoutrin/product-forge

Add a new resource or resource template to an existing FastMCP server

plan-with-team

9
from jpoutrin/product-forge

Validate plan file ownership

privacy-compliance

9
from jpoutrin/product-forge

GDPR, CCPA, and privacy compliance guidance for data protection. Use when handling personal data, implementing consent management, or ensuring regulatory compliance across jurisdictions.

oauth

9
from jpoutrin/product-forge

OAuth 2.0 and OpenID Connect implementation patterns. Use when implementing authentication, authorization flows, or integrating with OAuth providers like Google, GitHub, or custom identity providers.

mcp-security

9
from jpoutrin/product-forge

Use when securing MCP servers, preventing prompt injection, implementing authorization, validating user input, or building secure multi-agent pipelines. Provides 5-layer defense architecture patterns.

rag-cag-security

9
from jpoutrin/product-forge

Security patterns for RAG and CAG systems with multi-tenant isolation. Use when building retrieval-augmented or cache-augmented generation systems that require tenant isolation, access control, and secure data handling.