{
"markdown": "# 🎠Playwright\n\n[](https://www.npmjs.com/package/playwright) [](https://www.chromium.org/Home) [](https://www.mozilla.org/en-US/firefox/new/) [](https://webkit.org/) [](https://aka.ms/playwright/discord)\n\n## [Documentation](https://playwright.dev) | [API reference](https://playwright.dev/docs/api/class-playwright)\n\nPlaywright is a framework for web automation and testing. It drives Chromium, Firefox, and WebKit with a single API — in your tests, in your scripts, and as a tool for AI agents.\n\n## Get Started\n\nChoose the path that fits your workflow:\n\n| | Best for | Install |\n|---|---|---|\n| **[Playwright Test](#playwright-test)** | End-to-end testing | `npm init playwright@latest` |\n| **[Playwright CLI](#playwright-cli)** | Coding agents (Claude Code, Copilot) | `npm i -g @playwright/cli@latest` |\n| **[Playwright MCP](#playwright-mcp)** | AI agents and LLM-driven automation | `npx @playwright/mcp@latest` |\n| **[Playwright Library](#playwright-library)** | Browser automation scripts | `npm i playwright` |\n| **[VS Code Extension](#vs-code-extension)** | Test authoring and debugging in VS Code | [Install from Marketplace](https://marketplace.visualstudio.com/items?itemName=ms-playwright.playwright) |\n\n---\n\n## Playwright Test\n\nPlaywright Test is a full-featured test runner built for end-to-end testing. It runs tests across Chromium, Firefox, and WebKit with full browser isolation, auto-waiting, and web-first assertions.\n\n### Install\n\n```bash\nnpm init playwright@latest\n```\n\nOr add manually:\n\n```bash\nnpm i -D @playwright/test\nnpx playwright install\n```\n\n### Write a test\n\n```TypeScript\nimport { test, expect } from '@playwright/test';\n\ntest('has title', async ({ page }) => {\n await page.goto('https://playwright.dev/');\n await expect(page).toHaveTitle(/Playwright/);\n});\n\ntest('get started link', async ({ page }) => {\n await page.goto('https://playwright.dev/');\n await page.getByRole('link', { name: 'Get started' }).click();\n await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible();\n});\n```\n\n### Run tests\n\n```bash\nnpx playwright test\n```\n\nTests run in parallel across all configured browsers, in headless mode by default. Each test gets a fresh browser context — full isolation with near-zero overhead.\n\n### Key capabilities\n\n**Auto-wait and web-first assertions.** No artificial timeouts. Playwright waits for elements to be actionable, and assertions automatically retry until conditions are met.\n\n**Locators.** Find elements with resilient locators that mirror how users see the page:\n\n```TypeScript\npage.getByRole('button', { name: 'Submit' })\npage.getByLabel('Email')\npage.getByPlaceholder('Search...')\npage.getByTestId('login-form')\n```\n\n**Test isolation.** Each test runs in its own browser context — equivalent to a fresh browser profile. Save authentication state once and reuse it across tests:\n\n```TypeScript\n// Save state after login\nawait page.context().storageState({ path: 'auth.json' });\n\n// Reuse in other tests\ntest.use({ storageState: 'auth.json' });\n```\n\n**Tracing.** Capture execution traces, screenshots, and videos on failure. Inspect every action, DOM snapshot, network request, and console message in the [Trace Viewer](https://playwright.dev/docs/trace-viewer):\n\n```TypeScript\n// playwright.config.ts\nexport default defineConfig({\n use: {\n trace: 'on-first-retry',\n },\n});\n```\n\n```bash\nnpx playwright show-trace trace.zip\n```\n\n\n\n**Parallelism.** Tests run in parallel by default across all configured browsers.\n\n[Full testing documentation](https://playwright.dev/docs/intro)\n\n---\n\n## Playwright CLI\n\n[Playwright CLI](https://github.com/microsoft/playwright-cli) is a command-line interface for browser automation designed for coding agents. It's more token-efficient than MCP — commands avoid loading large tool schemas and accessibility trees into the model context.\n\n### Install\n\n```bash\nnpm install -g @playwright/cli@latest\n```\n\nOptionally install skills for richer agent integration:\n\n```bash\nplaywright-cli install --skills\n```\n\n### Usage\n\nPoint your coding agent at a task:\n\n```\nTest the \"add todo\" flow on https://demo.playwright.dev/todomvc using playwright-cli.\nTake screenshots for all successful and failing scenarios.\n```\n\nOr run commands directly:\n\n```bash\nplaywright-cli open https://demo.playwright.dev/todomvc/ --headed\nplaywright-cli type \"Buy groceries\"\nplaywright-cli press Enter\nplaywright-cli screenshot\n```\n\n### Session monitoring\n\nUse `playwright-cli show` to open a visual dashboard with live screencast previews of all running browser sessions. Click any session to zoom in and take remote control.\n\n```bash\nplaywright-cli show\n```\n\n\n\n[Full CLI documentation](https://playwright.dev/agent-cli/introduction) | [GitHub](https://github.com/microsoft/playwright-cli)\n\n---\n\n## Playwright MCP\n\nThe [Playwright MCP server](https://github.com/microsoft/playwright-mcp) gives AI agents full browser control through the [Model Context Protocol](https://modelcontextprotocol.io). Agents interact with pages using structured accessibility snapshots — no vision models or screenshots required.\n\n### Setup\n\nAdd to your MCP client (VS Code, Cursor, Claude Desktop, Windsurf, etc.):\n\n```json\n{\n \"mcpServers\": {\n \"playwright\": {\n \"command\": \"npx\",\n \"args\": [\"@playwright/mcp@latest\"]\n }\n }\n}\n```\n\n**One-click install for VS Code:**\n\n[![\"Install](\"https://img.shields.io/badge/VS_Code-VS_Code?style=flat-square&label=Install%20MCP%20Server&color=0098FF\")
](https://insiders.vscode.dev/redirect?url=vscode%3Amcp%2Finstall%3F%257B%2522name%2522%253A%2522playwright%2522%252C%2522command%2522%253A%2522npx%2522%252C%2522args%2522%253A%255B%2522%2540playwright%252Fmcp%2540latest%2522%255D%257D)\n\n**For Claude Code:**\n\n```bash\nclaude mcp add playwright npx @playwright/mcp@latest\n```\n\n### How it works\n\nAsk your AI assistant to interact with any web page:\n\n```\nNavigate to https://demo.playwright.dev/todomvc and add a few todo items.\n```\n\nThe agent sees the page as a structured accessibility tree:\n\n```\n- heading \"todos\" [level=1]\n- textbox \"What needs to be done?\" [ref=e5]\n- listitem:\n - checkbox \"Toggle Todo\" [ref=e10]\n - text: \"Buy groceries\"\n```\n\nIt uses element refs like `e5` and `e10` to click, type, and interact — deterministically and without visual ambiguity. Tools cover navigation, form filling, screenshots, network mocking, storage management, and more.\n\n[Full MCP documentation](https://playwright.dev/mcp/introduction) | [GitHub](https://github.com/microsoft/playwright-mcp)\n\n---\n\n## Playwright Library\n\nUse `playwright` as a library for browser automation scripts — web scraping, PDF generation, screenshot capture, and any workflow that needs programmatic browser control without a test runner.\n\n### Install\n\n```bash\nnpm i playwright\n```\n\n### Examples\n\n**Take a screenshot:**\n\n```TypeScript\nimport { chromium } from 'playwright';\n\nconst browser = await chromium.launch();\nconst page = await browser.newPage();\nawait page.goto('https://playwright.dev/');\nawait page.screenshot({ path: 'screenshot.png' });\nawait browser.close();\n```\n\n**Generate a PDF:**\n\n```TypeScript\nimport { chromium } from 'playwright';\n\nconst browser = await chromium.launch();\nconst page = await browser.newPage();\nawait page.goto('https://playwright.dev/');\nawait page.pdf({ path: 'page.pdf', format: 'A4' });\nawait browser.close();\n```\n\n**Emulate a mobile device:**\n\n```TypeScript\nimport { chromium, devices } from 'playwright';\n\nconst browser = await chromium.launch();\nconst context = await browser.newContext(devices['iPhone 15']);\nconst page = await context.newPage();\nawait page.goto('https://playwright.dev/');\nawait page.screenshot({ path: 'mobile.png' });\nawait browser.close();\n```\n\n**Intercept network requests:**\n\n```TypeScript\nimport { chromium } from 'playwright';\n\nconst browser = await chromium.launch();\nconst page = await browser.newPage();\nawait page.route('**/*.{png,jpg,jpeg}', route => route.abort());\nawait page.goto('https://playwright.dev/');\nawait browser.close();\n```\n\n[Library documentation](https://playwright.dev/docs/library) | [API reference](https://playwright.dev/docs/api/class-playwright)\n\n---\n\n## VS Code Extension\n\nThe [Playwright VS Code extension](https://marketplace.visualstudio.com/items?itemName=ms-playwright.playwright) brings test running, debugging, and code generation directly into your editor.\n\n\n\n**Run and debug tests** from the editor with a single click. Set breakpoints, inspect variables, and step through test execution with a live browser view.\n\n**Generate tests with CodeGen.** Click \"Record new\" to open a browser — navigate and interact with your app while Playwright writes the test code for you.\n\n**Pick locators.** Hover over any element in the browser to see the best available locator, then click to copy it to your clipboard.\n\n**Trace Viewer integration.** Enable \"Show Trace Viewer\" in the sidebar to get a full execution trace after each test run — DOM snapshots, network requests, console logs, and screenshots at every step.\n\n[Install the extension](https://marketplace.visualstudio.com/items?itemName=ms-playwright.playwright) | [VS Code guide](https://playwright.dev/docs/getting-started-vscode)\n\n---\n\n## Cross-Browser Support\n\n| | Linux | macOS | Windows |\n| :--- | :---: | :---: | :---: |\n| Chromium1 154.0.8037.0 | :white_check_mark: | :white_check_mark: | :white_check_mark: |\n| WebKit 26.6 | :white_check_mark: | :white_check_mark: | :white_check_mark: |\n| Firefox 155.0 | :white_check_mark: | :white_check_mark: | :white_check_mark: |\n\nHeadless and headed execution on all platforms. 1 Uses [Chrome for Testing](https://developer.chrome.com/blog/chrome-for-testing) by default.\n\n## Other Languages\n\nPlaywright is also available for [Python](https://playwright.dev/python/docs/intro), [.NET](https://playwright.dev/dotnet/docs/intro), and [Java](https://playwright.dev/java/docs/intro).\n\n## Resources\n\n* [Documentation](https://playwright.dev)\n* [API reference](https://playwright.dev/docs/api/class-playwright)\n* [MCP server](https://github.com/microsoft/playwright-mcp)\n* [CLI for coding agents](https://github.com/microsoft/playwright-cli)\n* [VS Code extension](https://github.com/microsoft/playwright-vscode)\n* [Contribution guide](CONTRIBUTING.md)\n* [Changelog](https://github.com/microsoft/playwright/releases)\n* [Discord](https://aka.ms/playwright/discord)\n",
"bytes": 11260,
"sha": "1bf217a9a995a6b6d799a83dd8fdf6559af665b3f8324a0734572a99f40915c4",
"repo_slug": "microsoft/playwright",
"fonte": "repo",
"truncated": false,
"api": "https://agentalog.com/api/listings/skl_microsoft_playwright_playwright_dev_596f6d8e/readme"
}