AgentSkillsCN

sketch-playwright-qa

Sketch Magic的Playwright QA工作流。当运行移动流程测试、视觉基线、快照更新或调试不稳定WebKit/Chromium运行及端口冲突时使用。

SKILL.md
--- frontmatter
name: sketch-playwright-qa
description: Playwright QA workflow for Sketch Magic. Use when running mobile flow tests, visual baselines, snapshot updates, or debugging flaky WebKit/Chromium runs and port conflicts.

Sketch Playwright QA

Overview

Standardize Playwright test runs for mobile flow and visual baselines, including snapshot updates and trace review.

Quick Start

  • •Mobile flow: PLAYWRIGHT_PORT=3020 pnpm test:e2e tests/e2e/mobile-flow.spec.ts
  • •Visual baselines: PLAYWRIGHT_PORT=3021 pnpm test:e2e tests/e2e/visual.spec.ts
  • •Update snapshots: append --update-snapshots

Workflow

1) Pick a port

  • •Use a clean port (e.g., 3020–3030) to avoid conflicts.
  • •Set PLAYWRIGHT_PORT in the command.

2) Run required suites

  • •Mobile flow: tests/e2e/mobile-flow.spec.ts
  • •Visual baselines: tests/e2e/visual.spec.ts

3) Handle failures

  • •Review trace/video artifacts under test-results/.
  • •If a snapshot mismatch is expected, re-run with --update-snapshots.
  • •If flakiness appears, check animations or timing.

4) Record evidence

  • •Keep a short log of commands + ports used.
  • •Capture failing screenshots/videos when needed.
  • •Use qa-verification for the standard evidence format.

References

  • •references/playwright-workflow.md — exact commands, snapshot guidance, and troubleshooting.