browser-bug-testing-workflow
OfficialReproduce and verify web UI bugs automatically.
System Documentation
What problem does it solve?
Investigating browser UI bugs is slow and inconsistent when done manually. This Skill provides a repeatable, end-to-end workflow to spin up local servers, drive Playwright interactions, and capture evidence (snapshots, screenshots, logs) so issues are reproduced reliably and fixes are verified quickly.
Core Features & Use Cases
- Tmux-managed servers: Start, observe, and cleanly shut down app servers in isolated tmux sessions with log capture for debugging.
- Playwright automation: Navigate pages, click buttons, fill forms, handle dialogs, wait for conditions, and validate outcomes with snapshots and screenshots.
- Use Case: Debug a flaky “Auto mode” checkbox—launch the dev server in tmux, open the target page, toggle the checkbox, trigger dependent actions, wait for the expected text, and store screenshots and logs in the retrospective folder for review.
Quick Start
Run the browser-bug-testing-workflow to start the app in tmux, navigate to the target page, reproduce the bug with Playwright interactions, and save screenshots to the current retrospective’s screenshots directory.
Dependency Matrix
Required Modules
None requiredComponents
Standard package💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: browser-bug-testing-workflow Download link: https://github.com/sandgardenhq/sgai/archive/main.zip#browser-bug-testing-workflow Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.