Agent skill

sketch-playwright-qa

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.

Stars 163
Forks 31

Install this agent skill to your Project

npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/data/sketch-playwright-qa

SKILL.md

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.

Expand your agent's capabilities with these related and highly-rated skills.

Didn't find tool you were looking for?

Be as detailed as possible for better results