Files

¨NW¨ 5a77528b23 refactor: clean up root directory - move deprecated files to archive

Archive:
- docker-compose.yml, Dockerfile.playwright
- scripts/ (legacy test scripts)
- docs/, .test/ (old documentation and tests)
- IMPROVEMENT_PROPOSAL.md (superseded by .kilo/)
- BROWSER_VISIBILITY.md, README.Docker.md
- cleanup-packages.sh, fix-permissions.sh, install-apaw.sh

Keep in root:
- .kilo/ (active system)
- .claude/ (Claude Code runtime)
- AGENTS.md (agent reference)
- README.md (main documentation)
- src/ (utility code)
- package.json, tsconfig.json (project config)

2026-04-05 03:52:10 +01:00

2.0 KiB

Raw Blame History

Browser Visibility Configuration

By Default: Browser is VISIBLE (headed mode)

This allows you to observe browser actions in real-time during testing.

Configuration Options

Option 1: Visible Browser (Default for Development)

# Docker: Browser window visible
docker-compose up playwright-mcp

# Or directly:
npx @playwright/mcp@latest --browser chromium --no-sandbox
# (without --headless flag = visible window)

Option 2: Hidden Browser (For CI/CD)

Set environment variable:

export PLAYWRIGHT_MCP_HEADLESS=true

Or use flag:

npx @playwright/mcp@latest --headless --browser chromium --no-sandbox

Docker Setup for Visible Browser

Linux

# Allow Docker to access X11
xhost +local:docker

# Run with display
docker-compose up playwright-mcp

macOS

# Install XQuartz for X11
brew install --cask xquartz

# Start XQuartz
open -a XQuartz

# Allow connections
xhost +local:

# Run with display
docker-compose up playwright-mcp

Windows (WSL2)

# Install VcXsrv or use WSLg (Windows 11)
# Export display
export DISPLAY=$(cat /etc/resolv.conf | grep nameserver | awk '{print $2}'):0

# Run
docker-compose up playwright-mcp

Environment Variables

Variable	Default	Purpose
`PLAYWRIGHT_MCP_HEADLESS`	`false`	`true` = hidden, `false` = visible
`PLAYWRIGHT_MCP_BROWSER`	`chromium`	Browser to use
`DISPLAY`	`:0`	X11 display for headed mode

Benefits of Headed Mode

Observe Actions - Watch browser in real-time
Debug Tests - See what's happening visually
Learn - Understand how automation works
Verify - Confirm correct behavior visually

When to Use Headless

For CI/CD pipelines or production testing where you don't need to see the browser:

# Set in CI environment
export PLAYWRIGHT_MCP_HEADLESS=true

# Or in docker-compose.override.yml
services:
  playwright-mcp:
    environment:
      - PLAYWRIGHT_MCP_HEADLESS=true

2.0 KiB Raw Blame History