Playwright MCP

Playwright MCP exposes browser tools to an existing agent. Use its structured snapshots to reproduce a staging-page issue, keep browser context across calls, and distinguish an observed application failure from a tool or session problem.

Reproduce one staged browser failure

A bounded validation failure is easier to reproduce than an entire checkout journey. The report should support a regression assertion even when the cause remains unresolved.

Test URL, test records, reproduction steps, expected validation message, and the last permitted action.

Copy the request into a new Floatboat conversation and provide the required material.

Download Floatboat

Your request for Floatboat

Preview and copy the request. It is not sent automatically from this page.

Reference: Playwright MCP
https://github.com/microsoft/playwright-mcp

Read the original documentation and check the current environment and dependencies. Propose any new installation or tool connection before proceeding.

My task:
Use the configured Playwright MCP to reproduce the validation issue on my staging form. Inspect a snapshot, follow the supplied steps, and report expected versus actual state. Do not submit a real order.

Expected deliverable:
Reproduction steps with observed states and a proposed regression assertion. Include failed steps and unresolved questions when evidence is insufficient.

About Playwright MCP

Playwright MCP is Microsoft’s MCP interface to Playwright browser automation. Instead of requiring a vision model to choose every click from pixels, it exposes structured accessibility snapshots and tools for navigation, input, and observation. The connected host performs the reasoning; the server operates the selected browser context.

The upstream README also points coding agents toward the separate Playwright CLI and its official Skill, especially when concise terminal operations fit the workflow. MCP is a useful choice for iterative page investigation with persistent state and rich tool inspection. This is an interface choice, not a claim that one route always produces better results or that the CLI Skill configures the MCP server.

Browser state depends on configuration. A persistent profile can retain data but conflicts if multiple browser instances try to share it; isolated mode keeps the profile in memory instead. Existing-session access requires its documented connection path. Floatboat can use the corresponding MCP route documented for Cursor and Codex after Node and browser preparation. Apache-2.0 applies to the server, separately from host model and service terms.

Use Structured State for Iterative Investigation

A snapshot identifies controls, the browser context carries session state, and tool responses show what an action returned. Use all three to reproduce a specific problem; none alone is a complete assertion that the application behaved correctly.

  • Snapshot-driven interaction

    browser_snapshot exposes accessible controls and refs. browser_click or browser_fill_form can use the observed structure instead of guessing a selector from a screenshot.

  • Stateful browser context

    Navigation and later observations can share the selected context. Profile and isolation choices determine whether the task begins with retained data or a fresh in-memory profile.

  • Targeted text and visual evidence

    Use snapshots for labels and control structure, and browser_take_screenshot for visible layout. Optional tools depend on server configuration, so inspect the active tool list before planning a check.

Investigations That Benefit from Browser Context

Start with a supplied URL and one expected application behavior. Validation errors, keyboard movement, filtered reports, and interface comparisons require different observations; retain the browser state needed for the question instead of expanding every check into a complete test suite.

Reproduce a staging-form validation error

Supply a staging URL and an invalid test value, such as a malformed email. Use the snapshot to identify the field and submit control, perform the test, and capture the displayed error and retained value. Report whether the application rejected the input as expected, rather than equating a successful click with successful validation.

Check one keyboard navigation path

Provide the initial page state and expected focus sequence through a small form. Perform keyboard actions and inspect the controls and focus evidence after each relevant step. Report the exact unreachable or unnamed control. This produces a focused defect report, not a complete accessibility certification.

Read a report after changing its period

Use an approved test session and specify the date range and expected report fields. Observe the chosen dates before reading records so an unchanged table is not silently treated as a refreshed report. If downloading is part of the task, inspect the resulting file separately from the browser response.

Choose MCP or CLI for repeated coding checks

Run the same small staging task through the candidate interface and compare the maintained steps, outputs, and context needs. Persistent interactive investigation may favor MCP; a compact terminal routine may favor CLI. Record actual observations instead of asserting universal token savings from a different workload.

Prepare the Server and Browser Mode

The walkthrough uses the MCP server, a reachable staging form, and approved test values. Choose the browser mode before the test so persisted accounts or a profile conflict do not change the initial conditions unexpectedly.

  • MCP runtime

    The official README requires Node.js 18 or newer and documents a server launched with npx @playwright/mcp@latest. Add it through the chosen host’s MCP setup and inspect the tools it exposes.

  • Profile choice

    Use isolated mode for an in-memory test profile, or deliberately choose a persistent profile or documented existing-session connection. Do not share one persistent profile between concurrent browser instances.

  • Form and expected error

    Supply the staging URL, field label, invalid test value, permitted submit action, and expected validation message. Use a test form where submission cannot create a real purchase or production record.

Reproduce and Explain One Validation Failure

The first task checks whether a form rejects a known invalid value. Use tool names from the official server, but read the current tool schema for arguments and refs; do not reuse an element reference copied from another page or session.

  1. Navigate and identify the form

    Call browser_navigate with the supplied staging URL. If the expected form is not ready, use browser_wait_for for its known text, then browser_snapshot. Confirm the field and submit control are the intended ones; a login or unavailable page should be reported as a prerequisite failure.

  2. Enter the supplied test value

    Use browser_fill_form with the current field reference and invalid value. Inspect the resulting state before clicking the permitted test submit control with browser_click. If refs have changed, take a fresh snapshot and locate the target again rather than retrying an obsolete handle.

  3. Read what the application actually did

    Inspect a fresh snapshot for the expected message, retained value, and any navigation. Use a screenshot if the defect concerns error placement or visibility. If the application shows a different failure, distinguish it from the planned validation assertion rather than calling both a successful reproduction.

  4. Return a reproduction or a precise blocker

    Return the URL, browser mode, exact test input, action order, expected and observed state, and relevant evidence. If the tool disconnected or the profile was busy, report that environment problem separately. A useful handoff lets a developer repeat the same check before and after a fix.

Related Software Projects

Compare the workflows, operating requirements, and source licenses of these projects.

Playwright MCP FAQ

When does MCP make more sense than CLI?
MCP is useful for iterative inspection where the host benefits from persistent state and rich browser tools. Evaluate CLI for concise terminal-driven routines. The upstream recommendation is a selection guide, not a guarantee about your workload’s cost or success rate.
Is this the Playwright test runner?
No. This server exposes browser tools to an agent. A test runner executes maintained test suites. After investigating a defect, you may separately write a regression test, but an agent’s interactive session does not itself create that test suite.
Why can’t two clients use one profile?
A persistent profile can only be used by one browser instance at a time. Use isolated mode or a distinct user-data directory for additional instances as documented; otherwise startup conflict can be mistaken for an application failure.
Do I need a vision model?
Ordinary snapshot-based interaction uses structured accessibility data. Layout claims still require visual evidence; coordinate-based vision tools also depend on the enabled capability. Read the active schema rather than assuming every screenshot implies pixel-driven control.
Does the official CLI Skill install MCP?
No. The Playwright CLI usage Skill teaches a separate terminal interface. Configure this MCP server through its own host instructions; using both names in one project family does not make their installation or state interchangeable.
What is the Floatboat integration claim here?
The official repository documents Cursor and Codex MCP setup. Floatboat can follow the corresponding protocol path once its runtime and browser are prepared. This is not an assertion that the upstream certifies Floatboat or that the page has run a local installation test.