claude code add mcp playwright - Brave Search

Anyone get Microsoft Playwright MCP to Work with Claude Code?

reddit.com › r › ClaudeAI › comments › 1l6nv6u › anyone_get_microsoft_playwright_mcp_to_work_with

I use (in wsl) `claude mcp add playwright npx u/playwright/mcp @latest` only things that is tricky is that you cannot let claude install the browser or the deps since it needs sudo to elevate the commands, so just install them manually and follow the prompts in a terminal. then you can check using /mcp and see its installed and test it using a command like, `use playwright to navigate to google.com` Answer from BruceJillis on reddit.com

til.simonwillison.net › claude-code › playwright-mcp-claude-code

Using Playwright MCP with Claude Code | Simon Willison’s TILs

I found I needed to explicitly say "playwright mcp" the first time, otherwise it might try to use Bash to run Playwright instead. The claude mcp add command will persist but will only affect the directory ...

github.com › microsoft › playwright-mcp

GitHub - microsoft/playwright-mcp: Playwright MCP server

After installation, the Playwright MCP server will be available for use with your GitHub Copilot agent in VS Code. ... Go to Settings -> AI -> Manage MCP Servers -> + Add to add an MCP Server.

Starred by 24.7K users

Forked by 2K users

Languages TypeScript 54.4% | CSS 37.0% | JavaScript 6.0% | Dockerfile 1.6% | HTML 1.0%

Videos

Claude Code Now Has Eyes | Playwright MCP Integration - YouTube

August 25, 2025

Claude Code + Playwright MCP = Perfect UI Every Time - YouTube

August 28, 2025

Install Playwright MCP in Claude Desktop – AI-Powered Web ...

Playwright MCP for Claude Code: Don't Miss This Game-Changer - YouTube

October 21, 2025

Turn Claude Code into Your Own INCREDIBLE UI Designer (using ...

August 16, 2025

Integrate Playwright with Claude AI from Scratch | Full Setup & ...

reddit.com › r/claudeai › anyone get microsoft playwright mcp to work with claude code?

r/ClaudeAI on Reddit: Anyone get Microsoft Playwright MCP to Work with Claude Code?

June 9, 2025 -

No matter what I try, Claude code cannot access the Microsoft Playwright MCP. I'm searching for troubleshooting tips, but can't find anything. Is there anyone using it?

[EDIT] Solved, "claude mcp add playwright -- npx "@playwright/mcp@latest" worked.

I use (in wsl) `claude mcp add playwright npx u/playwright/mcp @latest` only things that is tricky is that you cannot let claude install the browser or the deps since it needs sudo to elevate the commands, so just install them manually and follow the prompts in a terminal. then you can check using /mcp and see its installed and test it using a command like, `use playwright to navigate to google.com`

Working on my end

testomat.io › home › playwright mcp claude code

Playwright MCP Claude Code

October 27, 2025 - Here’s how to do it: ... Edit config. You need to access the Claude Desktop configuration File, which is named claude_desktop_config.json Then add or update the settings to define the MCP server with this JSON configuration snippet:

Address Ul. Koszykarska 27b-26, Kraków

reddit.com › r/claudeai › claude code + playwright mcp - how did you speed up the browser interactions

Claude code + playwright mcp - how did you speed up ...

May 17, 2025 -

I have successfully integrated this playwright mcp -Microsoft one ( adding tools ) to Claude code . We can now add a prompt and pass it in Claude code headless cli .. however the browser navigation is quite slow .. for example it takes more than 4 seconds for Claude code to login using username and password..

How did you speed up the process ..? I am using WSL2

Thanks in advance

I say this with all the kindness in the world. Why the fuck would you burn Claude code tokens running playwright tests? Why would you not just write the tests and then have the tests run with CI/CD pipelines?

how did you install the microsoft playwright mcp to claude code?

x.com › simonw › status › 1940197916267986946

Using Playwright MCP with Claude Code

I figured out how to add the official Playwright browser automation MCP to Claude Code. Run this before you start "claude": claude mcp add playwright npx '@playwright/mcp@latest' Now Claude Code can use a Chrome browser directly!

madewithlove.com › blog › claude-as-tester-using-playwright-and-github-mcp

Claude as tester using Playwright and GitHub MCP

July 22, 2025 - Based on the ticket, I gave Claude the following prompt: Use playwright MCP, go to <testing environment URL> log in with username <user> and password <password, create a new event with the role <Role>. You should only add one role, do not press ...

medium.com › @kapilkumar080 › understanding-the-claude-playwright-mcp-server-setup-426a574cc232

Understanding the Claude + Playwright MCP Server setup | by Kapil kumar | Oct, 2025 | Medium

October 31, 2025 - ... | Step | What to do | Purpose ... | Install Node.js & Playwright | For browser automation | | 2 | `npm install -g @executeautomation/playwright-mcp-server` | Run the Playwright MCP server | | 3 | Install Claude Desktop | To ...

Find elsewhere

Google Bing Mojeek

playwright.dev › agents

Agents | Playwright

October 9, 2025 - repo/ .github/ # agent definitions specs/ # human-readable test plans basic-operations.md tests/ # generated Playwright tests seed.spec.ts # seed test for environment tests/create/add-valid-todo.spec.ts playwright.config.ts · Under the hood, agent definitions are collections of instructions and MCP tools. They are provided by Playwright and should be regenerated whenever Playwright is updated. Example for Claude Code subagents: npx playwright init-agents --loop=vscode ·

code.claude.com › docs › en › mcp

Connect Claude Code to tools via MCP - Claude Code Docs

You can use --scope user to add the server to your user configuration instead of the project-specific one · If you’ve already configured MCP servers in Claude Desktop, you can import them: ... After running the command, you’ll see an interactive dialog that allows you to select which servers you want to import. ... If servers with the same names already exist, they will get a numerical suffix (for example, server_1) You can use Claude Code itself as an MCP server that other applications can connect to:

Playwright MCP Server

executeautomation.github.io › local development › installation

Installation | Playwright MCP Server

Modify your claude-desktop-config.json file as shown below to work with local playwright mcp server The file is generally located at C:\Users\{yourusername}\AppData\Roaming\Claude

nikiforovall.blog › ai › 2025 › 09 › 06 › playwright-claude-code-testing.html

Testing with Playwright and Claude Code | N+1 Blog

September 6, 2025 - Learn how to use Playwright MCP servers with Claude Code slash commands to perform manual and exploratory testing of web applications.

github.com › executeautomation › mcp-playwright

executeautomation/mcp-playwright ...

2 weeks ago - OPENAI_API_KEY=your-key npx mcp-eval src/evals/evals.ts src/tools/codegen/index.ts · When adding new tools, please be mindful of the tool name length. Some clients, like Cursor, have a 60-character limit for the combined server and tool name (server_name:tool_name). Our server name is playwright-mcp.

Starred by 5.1K users

Forked by 460 users

Languages TypeScript 93.6% | JavaScript 6.0%

simonwillison.net › 2025 › Jul › 1 › using-playwright-mcp-with-claude-code

TIL: Using Playwright MCP with Claude Code

July 1, 2025 - Inspired by Armin ("I personally use only one MCP - I only use Playwright") I decided to figure out how to use the official Playwright MCP server with Claude Code. ... The claude mcp add command only affects the current directory by default - it gets persisted in the ~/.claude.json file.

medium.com › everyday-ai › claude-code-playwright-mcp-put-eye-on-your-website-a0f5851f8106

Claude Code + Playwright MCP = Put Eye on your website | by Manpreet Singh | Everyday AI | Medium

August 21, 2025 - With these glasses, Claude Code can look at the website it’s making and figure out what’s wrong and fix it all by itself. ... We’ll talk about why this is a big deal and how Playwright MCP helps, and how you can set it up.

supatest.ai › home › blog › playwright mcp: a new approach to browser automation

Playwright MCP Guide: Setup, Configuration & Best Practices

August 12, 2025 - Learn how to set up Playwright MCP, connect AI tools, and optimize browser automation with security, performance, and integration best practices

news.ycombinator.com › item

Show HN: Playwright Skill for Claude Code – Less context than playwright-MCP | Hacker News

October 25, 2025 - Instead of sending accessibility tree snapshots on every action, Claude just writes Playwright code and runs it. You get back screenshots and console output. That's it · 314 lines of instructions vs a persistent MCP server. Full API docs only load if Claude needs them

JavaScript in Plain English

javascript.plainenglish.io › experience-story-figma-mcp-claude-code-playwright-68b20bb0f8ce

Experience Story: Figma MCP + Claude Code + Playwright MCP | by Orhan Asım Arslan | JavaScript in Plain English

October 15, 2025 - This led me to discover a powerful combination: Figma’s MCP (Model Context Protocol) server, Claude Code for AI interpretation, and Playwright MCP for programmatic validation.

lobehub.com › mcp › sia819-claude-code-playwright-mcp

claude-code-playwright-mcp | MCP Servers · LobeHub

1 month ago - { "mcpServers": { "sia819-claude-code-playwright-mcp": { "args": [ "/c", "npx", "-y", "@playwright/mcp@latest", "--user-data-dir=./playwright-profile" ], "command": "cmd" } } } Let us know, and we will add it as soon as possible~Submit MCP

shipyard.build › blog › playwright-mcp-screenshots

Taking screenshots of your app with the Playwright MCP server | Shipyard

September 15, 2025 - To get the Playwright MCP installed for Claude Code, run this command in your terminal: claude mcp add playwright npx @playwright/mcp@latest