> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify.com/microsoft/playwright-mcp/llms.txt
> Use this file to discover all available pages before exploring further.

# Browser Extension

> Connect Playwright MCP to your existing browser tabs using the Playwright MCP Bridge extension

The Playwright MCP Chrome Extension allows you to connect to existing browser tabs and leverage your logged-in sessions and browser state. This means the AI assistant can interact with websites where you're already logged in, using your existing cookies, sessions, and browser state.

## Prerequisites

* Chrome, Edge, or Chromium browser

## Installation

### Step 1: Install the Extension

Install [Playwright MCP Bridge](https://chromewebstore.google.com/detail/playwright-mcp-bridge/mmlmfjhmonkocbjadbfplnigmagldckm) from the Chrome Web Store.

### Step 2: Configure Playwright MCP Server

Add the `--extension` flag to your MCP server configuration:

```json theme={null}
{
  "mcpServers": {
    "playwright-extension": {
      "command": "npx",
      "args": [
        "@playwright/mcp@latest",
        "--extension"
      ]
    }
  }
}
```

## Usage

### Browser Tab Selection

When the LLM interacts with the browser for the first time, it will load a page where you can select which browser tab the LLM will connect to. This gives you control over which specific page the AI assistant will interact with during the session.

## Bypassing Connection Approval

By default, you need to approve each connection when the MCP server tries to connect to your browser. To bypass this approval dialog and allow automatic connections, use an authentication token.

### Using Your Authentication Token

<Steps>
  <Step title="Get your token">
    After installing the extension, click on the extension icon or navigate to the extension's status page. Copy the `PLAYWRIGHT_MCP_EXTENSION_TOKEN` value displayed in the extension UI.
  </Step>

  <Step title="Add token to configuration">
    Add the token to your MCP server configuration:

    ```json theme={null}
    {
      "mcpServers": {
        "playwright-extension": {
          "command": "npx",
          "args": [
            "@playwright/mcp@latest",
            "--extension"
          ],
          "env": {
            "PLAYWRIGHT_MCP_EXTENSION_TOKEN": "your-token-here"
          }
        }
      }
    }
    ```
  </Step>
</Steps>

This token is unique to your browser profile and provides secure authentication between the MCP server and the extension. Once configured, you won't need to manually approve connections each time.

## Benefits

<CardGroup cols={2}>
  <Card title="Use Existing Sessions" icon="user-check">
    Interact with websites where you're already logged in without separate authentication.
  </Card>

  <Card title="Access Browser State" icon="database">
    Leverage your existing cookies, local storage, and browser configuration.
  </Card>

  <Card title="Seamless Experience" icon="wand-magic-sparkles">
    No need to set up storage state files or manage separate profiles.
  </Card>

  <Card title="Real Browser Context" icon="window-restore">
    Work with your actual browser tabs and their current state.
  </Card>
</CardGroup>

## Limitations

* Only works with Chrome, Edge, and Chromium browsers
* The `browser` configuration is ignored when using `--extension` mode
* Requires manual tab selection on first connection (unless using authentication token)