Agent Skill
2/7/2026

mcp-playwright

Browser automation via Playwright MCP — navigate, interact, screenshot, and inspect web pages headlessly. Use for: 'scrape this page', 'fill out a web form', 'take a screenshot of a URL', 'check if a site is up'. Use when no browser session exists.

H
helloworldsungin
0GitHub Stars
1Views
npx skills add HelloWorldSungin/ark-ai-mcp

SKILL.md

Namemcp-playwright
DescriptionBrowser automation via Playwright MCP — navigate, interact, screenshot, and inspect web pages headlessly. Use for: 'scrape this page', 'fill out a web form', 'take a screenshot of a URL', 'check if a site is up'. Use when no browser session exists.

name: mcp-playwright description: "Browser automation via Playwright MCP \u2014 navigate, interact, screenshot, and inspect web pages headlessly. Use for: 'scrape this page', 'fill out a web form', 'take a screenshot of a URL', 'check if a site is up'. Use when no browser session exists." allowed-tools: [Bash]

<objective> Automate browser interactions through the Playwright MCP server via mcporter CLI. Navigate to URLs, click elements, fill forms, take screenshots, and read page content — all headless by default. Use this when you need to interact with web pages, verify UI, scrape content, or test web flows.

Playwright MCP vs Claude-in-Chrome: Use Playwright MCP for headless/CI/server automation where no browser window exists. Use Claude-in-Chrome MCP tools for interactive browser sessions where the user has Chrome open with the extension. </objective>

<process>

Call Syntax

# Colon-delimited
mcporter call playwright.TOOL_NAME key:value --output json

# Function-call style
mcporter call 'playwright.TOOL_NAME(key: "value")' --output json

Tool Reference

Navigation

ToolParametersDescription
browser_navigateurlNavigate to a URL
browser_navigate_backGo back to previous page
browser_closeClose the current page

Observation

ToolParametersDescription
browser_snapshotAccessibility snapshot of the page (primary observation tool)
browser_take_screenshotCapture a PNG screenshot
browser_console_messagesGet browser console output
browser_network_requestsList network requests made by the page

Interaction

ToolParametersDescription
browser_clickelement, refClick an element (use ref from snapshot)
browser_typeelement, ref, textType text into an input
browser_select_optionelement, ref, valuesSelect dropdown options
browser_hoverelement, refHover over an element
browser_dragstartElement, startRef, endElement, endRefDrag and drop
browser_press_keykeyPress a keyboard key

Forms

ToolParametersDescription
browser_fill_formfieldsFill multiple form fields at once

JavaScript

ToolParametersDescription
browser_evaluateexpressionRun a JavaScript expression in the page
browser_run_codecodeRun a Playwright code snippet

Tabs, Waiting & Dialogs

ToolParametersDescription
browser_tabsList open tabs
browser_wait_fortext or timeoutWait for text to appear or a timeout
browser_handle_dialogacceptAccept or dismiss a dialog
browser_file_uploadpathsUpload files to a file input

Setup

ToolParametersDescription
browser_installInstall the browser binary if missing

Common Workflows

Scrape Page Content

# Navigate and get accessibility tree
mcporter call 'playwright.browser_navigate(url: "https://example.com")' --output json
mcporter call playwright.browser_snapshot --output json

# Extract specific data via JavaScript
mcporter call 'playwright.browser_evaluate(expression: "document.querySelector(\"h1\").textContent")' --output json

Fill and Submit a Form

# Navigate and inspect
mcporter call 'playwright.browser_navigate(url: "https://example.com/login")' --output json
mcporter call playwright.browser_snapshot --output json

# Use refs from snapshot to interact
mcporter call 'playwright.browser_type(element: "Username field", ref: "e3", text: "user@example.com")' --output json
mcporter call 'playwright.browser_type(element: "Password field", ref: "e5", text: "password")' --output json
mcporter call 'playwright.browser_click(element: "Submit button", ref: "e7")' --output json

Take a Screenshot

mcporter call 'playwright.browser_navigate(url: "https://example.com")' --output json
mcporter call playwright.browser_take_screenshot --output json

Debug a Page

mcporter call 'playwright.browser_navigate(url: "https://example.com")' --output json
mcporter call playwright.browser_console_messages --output json
mcporter call playwright.browser_network_requests --output json
</process> <tips> - Discover all tools and parameters: `mcporter list playwright --all-parameters` - **Headless by default**: The server runs `--headless` since Claude operates in a terminal. No display server needed. - **First call is slower**: npx downloads `@playwright/mcp` on the first invocation. Subsequent calls reuse the cached package. - **Use `browser_snapshot` as your primary observation tool** — it returns an accessibility tree with element refs that you use for `browser_click`, `browser_type`, etc. - **Element refs**: After a `browser_snapshot`, use the `ref` values (e.g., `"e3"`) to target elements in interaction tools. - **Empty accessibility tree?** Use `browser_wait_for` with a timeout or text selector to wait for dynamic content to load, then retry `browser_snapshot`. - No authentication required — this server runs locally via npx. - **Install browser if needed**: If Playwright browsers aren't installed, call `browser_install` first. - Extended capabilities: Pass `--caps` flags when configuring the server for vision mode, PDF generation, or testing features. - Use `--output json` for machine-readable results. </tips>
Skills Info
Original Name:mcp-playwrightAuthor:helloworldsungin