frontend-screenshots

Automating viewport screenshots with Playwright involves running scripts against a local development server to capture both desktop and mobile views. This Skill handles the capture process while ensuring user authentication to prevent PII exposure in the output.

Yes, you can capture mid-interaction screenshots of dropdowns, modals, and hover states using Playwright. This Skill scripts these specific UI interactions on local pages to generate accurate visual documentation for design reviews or bug reproductions.

Yes, a local development server must be running to take automated screenshots. This Skill specifically targets pages served by a local `bin/dev` server, capturing viewport screenshots directly from the local environment to ensure accurate page rendering.

The screenshot capture process prevents exposing PII by enforcing a seeded user identity gate. This ensures the automated Playwright scripts interact with the local pages using a controlled identity, keeping sensitive user data out of the generated viewport screenshots.

The best way to document UI bugs and PRs is by automating viewport screenshots across desktop and mobile views. This Skill uses Playwright to capture the local pages, providing reliable visual evidence for bug reproductions and pull request documentation.

Yes, executing this Playwright screenshot automation requires Playwright and its associated MCP tools. These dependencies are necessary to run the scripts that capture the desktop and mobile viewport screenshots from your local development environment.