自动化测试框架

# 1. Use this template (click "Use this template" on GitHub) — or clone directly
git clone https://github.com/ErkanBarin/playwright-agent-mcp-starter.git
cd playwright-agent-mcp-starter

# 2. Install dependencies
npm install

# 3. Set up environment
cp .env.example .env
# Edit .env → set BASE_URL to your app (defaults to http://localhost:3000)

# 4. Set up MCP (optional, for Claude Code / AI agent users)
cp .mcp.json.example .mcp.json
# MCP servers run via npx — no extra install needed

# 5. Install browsers + Playwright CLI
npx playwright install
npm install -g @playwright/cli@latest  # optional, for codegen/open/screenshot

# 6. Run one UI test (proof it works)
npx playwright test tests/ui/smoke.spec.ts --project=chromium

# 7. Run API tests (no browser launched — fast)
npx playwright test --project=api

# 8. See the HTML report
npm run report

├── ai/                  # Shared AI workspace (canonical location)
│   ├── agents/          # AI agent definitions (test design, PR hygiene, security, etc.)
│   ├── skills/          # Reusable prompt skills (MCP scout, prompt library)
│   ├── prompts/         # Prompt templates
│   └── knowledge/       # Domain knowledge and reference material
├── .claude/
│   ├── agents -> ai/agents   # Symlink — Claude Code reads from ai/
│   └── skills -> ai/skills   # Symlink — Claude Code reads from ai/
├── docs/
│   ├── QA_CONTEXT.md    # Scope, selectors, waits, PR slicing
│   ├── PROMPT_LIBRARY.md
│   ├── PR_WORKFLOW.md
│   ├── SECURITY_SANITIZATION.md
│   └── MCP_SETUP.md
├── pages/               # Page Object Models (base + login example)
├── tests/
│   ├── auth.setup.ts    # Auth setup (runs before UI projects)
│   ├── fixtures/        # Custom Playwright fixtures
│   ├── ui/              # UI test specs (smoke.spec.ts)
│   └── api/             # API test specs (health.spec.ts)
├── utils/
│   ├── index.ts         # Barrel — import everything from '../utils'
│   ├── timeouts.ts      # Named timeout constants (SHORT, MEDIUM, LONG, etc.)
│   ├── data-factory.ts  # Test data generators (user, product, order, etc.)
│   ├── api-helpers.ts   # API response assertion helpers
│   └── env.ts           # Typed environment variable access
├── .mcp.json.example    # MCP server config template
├── playwright.config.ts
└── package.json

setup → chromium, firefox, webkit (parallel)
                                        api (independent, no browser)

import { Timeouts, TestData, assertStatus, getBaseUrl } from '../utils';

await page.click(selector, { timeout: Timeouts.SHORT });   // 3s
await expect(locator).toBeVisible({ timeout: Timeouts.MEDIUM }); // 5s
await page.goto(url, { timeout: Timeouts.NAVIGATION });    // 15s

import { TestData } from '../utils';

const user = TestData.user();                        // random user
const admin = TestData.user({ role: 'admin' });      // override role
const product = TestData.product({ price: 9.99 });   // override price
const order = TestData.order();                      // random order
const email = TestData.email('signup');               // signup.k8f3x2@example.com

Design UI tests for the login page following POM pattern. Check existing
page objects first, then create missing ones. Tag all tests @ui @smoke.

Scan this repo for hardcoded secrets, API keys, tokens, and internal URLs.
Report findings with file paths and line numbers.

Analyze test coverage gaps. Map page objects and API endpoints to existing
tests. Show what's untested and prioritize by risk.

cp .mcp.json.example .mcp.json