mobile-browser-workflow-to-playwright
Mobile Browser Workflow to Playwright Skill
You are a senior QA automation engineer. Your job is to translate human-readable mobile browser workflow markdown files into Playwright E2E test files that can run in CI using Chromium with mobile viewport emulation.
Translation strategy: Generate tests that approximate mobile Chrome behavior in CI, while marking truly device-specific tests for the mobile-browser-workflow-executor skill. Expect ~70-80% CI coverage of typical workflows.
Task List Integration
CRITICAL: Use TaskCreate, TaskUpdate, and TaskList tools throughout execution.
| Task | Purpose |
|---|---|
| Main Task | "Translate Mobile Browser Workflows to Playwright" |
| Parse Task | Workflow parsing results |
| Check Task | Existing test file comparison |
| Selector Task | Mobile-specific selector discovery |
| Ambiguous Tasks | BLOCKING -- selectors needing user input |
| Generate Task | Chromium mobile test generation |
| Write Task | Final test file output |
More from neonwatty/claude-skills
think-through
A Socratic interview skill for thinking through technical ideas like apps, products, tools, and projects. Use this when the user says "think through [idea]", "help me think about [app/product]", "let's explore [project idea]", or wants to iterate on a technical concept before building. Asks probing questions about the problem, target users, market, technical approach, tradeoffs, and viability. Continues until the idea is well-explored, then produces a written summary and proposes directions.
22mobile-ux-ci
Generates Playwright tests that detect iOS/mobile UX anti-patterns in CI. Use this when the user says "mobile ux ci", "detect anti-patterns", "ios ux checks", "automated ux testing", "prevent ux regressions", or "add mobile ux checks". Creates tests that FAIL when anti-patterns are found (hamburger menus, FABs, small touch targets, Material Design components), enforcing iOS Human Interface Guidelines in CI.
18browser-workflow-generator
Generates, creates, or updates browser workflow files. Use this when the user says "generate browser workflows", "create browser workflows", "update browser workflows", "iterate on browser workflows", or "discover browser workflows". Explores the app's codebase to discover all user-facing features, routes, and interactions, then creates comprehensive numbered workflows with substeps covering the full user experience.
18ios-workflow-executor
Executes web app workflows in Safari on the iOS Simulator from /workflows/ios-workflows.md. Use this when the user says "run ios workflows", "execute ios workflows", "test ios workflows", or "test on ios simulator". Tests each workflow step by step in mobile Safari using iOS Simulator MCP, captures before/after screenshots, audits for iOS HIG anti-patterns, documents issues, and generates HTML reports with visual evidence.
17pr-creator
Creates a pull request from current changes, monitors GitHub CI, and debugs any failures until CI passes. Use this when the user says "create pr", "make a pr", "open pull request", "submit pr", or "pr for these changes". Does NOT merge - stops when CI passes and provides the PR link.
15feature-interview
Deeply interviews the user about a feature idea before implementation. Use this when the user says "interview me about [feature]", "I want to create a new feature", "let's create a new feature", "new feature", "plan a feature", or describes a feature they want to build. Asks probing, non-obvious questions about technical implementation, UI/UX decisions, edge cases, concerns, tradeoffs, and constraints. Continues interviewing until the feature is fully understood, then writes a detailed implementation plan.
15