Get the FREE Ultimate OpenClaw Setup Guide →

playwright

This is an experimental project to integrate Playwright with MCP. My plan is to conduct in-depth research, understand the intricacies of the integration, and review the best articles on the web to create the optimal version of a project using both technologies.

Installation
Run this command in your terminal to add the MCP server to Claude Code.
Run in terminal:
Command
claude mcp add --transport stdio joanesquivel-playwright-mcp-server npx -y joanesquivel-playwright-mcp-server

How to use

This MCP server provides Playwright-based end-to-end test automation for a mock e-commerce application. It automates user flows such as a successful order and a failed payment scenario against the provided test app. The server exposes Playwright-powered test tooling that you can run to execute the predefined flows, inspect results, and reproduce failures. Use the available npm scripts or direct Playwright calls supported by the MCP server to run tests in headless mode, or to open a headed browser for debugging. The test suite includes flows that cover login, product selection, cart/checkout, and payment outcomes, including a simulated decline and a simulated network error to help verify robust error handling and retry logic.

How to install

Prerequisites:

  • Node.js (14.x or newer) and npm/yarn installed
  • Internet access to fetch dependencies

Installation steps:

  1. Clone the repository or download the MCP server package
  2. Navigate to the project directory
  3. Install dependencies: npm install

    or if you use yarn:

    yarn install
  4. (Optional) Install Playwright browsers for local runs: npx playwright install
  5. Start or run tests via the provided script or MCP server interface: npm run test npm run test:headless npm run test:success # Run the successful order flow npm run test:failure # Run the failed order flow

Note: If the MCP server is provided as a package, you can also install and run it directly via: npx -y joanesquivel-playwright-mcp-server

Additional notes

Tips and known considerations:

  • Ensure the test application URL is accessible: https://v0-imagine-deals.vercel.app
  • If tests rely on environment-specific credentials, set them in a cypress.env.json-like file or the process environment before running tests (e.g., CYPRESS_USERNAME, CYPRESS_PASSWORD, CYPRESS_FAILURE_USERNAME).
  • For debugging, run tests in headed mode and attach a debugger as needed; the Playwright runner can launch browsers in non-headless mode for visual inspection.
  • If you encounter flaky tests, consider increasing navigation timeouts or adjusting wait conditions in the Page Object Model implementations, as network variability can affect timing.
  • When running in CI, ensure necessary secrets (credentials) are provided via environment variables in the CI environment.
  • If you modify tests, run the specific flows (test:success, test:failure) to validate the impact quickly.

Related MCP Servers

Sponsor this space

Reach thousands of developers