skills.rest
gioe
gioeCOMMUNITY
Explore all skills by this author →
GitHub

refresh-screenshots

Regenerate web and iOS reference screenshots using Playwright and XcodeBuildMCP.

Updated May 25, 2024
Search Tags:#automation#screenshots#ios#playwright#web#visual-regression
One-click install
npx skills add https://github.com/gioe/laughtrack --skill refresh-screenshots
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: refresh-screenshots
Source: https://github.com/gioe/laughtrack/tree/main/.claude/skills/refresh-screenshots
Command: npx skills add https://github.com/gioe/laughtrack --skill refresh-screenshots

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Refresh cross-platform reference screenshots used for web to iOS to Spotify-inspired UX comparisons. Each screenshots/view/ subdirectory contains a web.jpg (Playwright against https://laugh-track.com) and an ios.jpg (XcodeBuildMCP against the iPhone simulator), and may include spotify*.png reference designs that are not regenerated. This set acts as the single source of truth for visual regression and design comparison across surfaces.

Core Features & Use Cases

  • Orchestrates web Playwright navigation and iOS simulator captures to refresh visuals across 13 web views and 11 iOS views.
  • Maintains the screenshot inventory under screenshots/view/ with standard file names web.jpg and ios.jpg, plus optional spotify reference assets that are not regenerated.
  • Supports handling for login modal interactions and dynamic detail IDs, ensuring stable captures across sessions.

Quick Start

Run this skill to refresh all web and iOS reference screenshots for every defined view.

Frequently Asked Questions about refresh-screenshots

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I automate cross-platform screenshots for web and iOS visual regression?▼

Automating cross-platform screenshots uses Playwright for web navigation and capture alongside XcodeBuildMCP for iOS simulator views. This generates standardized web.jpg and ios.jpg files for each view to serve as a consistent baseline for visual regression testing.

Can Playwright handle login modals and dynamic IDs when taking web screenshots?▼

Yes, Playwright handles login modal interactions and resolves dynamic detail IDs during navigation. It waits for content to load and evaluates page readiness before storing the final web screenshots.

What is the best way to refresh reference screenshots for UX comparisons against Spotify designs?▼

Refreshing reference screenshots regenerates web and iOS captures while preserving existing Spotify.png reference assets. This maintains the screenshot inventory under screenshots/view/ subdirectories for accurate visual comparisons.

Does this screenshot automation approach support both web browsers and iOS simulators?▼

Yes, the approach supports capturing 13 web views via Playwright and 11 iOS views via XcodeBuildMCP. It orchestrates both platforms to ensure visual consistency across web and iOS surfaces.

Why are my dynamic detail views failing to capture consistently in visual regression baselines?▼

Dynamic detail views fail due to unhandled dynamic IDs or unwaited content loading. The capture process must evaluate page readiness and apply specific handling for dynamic IDs and login modals to ensure stable screenshots.

How do I store cross-platform screenshots in a standardized directory structure?▼

Store cross-platform screenshots by saving web captures as screenshots/<view>/web.jpg and iOS captures as screenshots/<view>/ios.jpg. This standardizes the file inventory for every defined view.

Related Skills

Explore More Design & Creative Skills→
DimillianDimillian
3.9k

ios-debugger-agent

Build, run, and debug iOS apps on booted simulators via XcodeBuildMCP.

Community
Advanced
ssmleossmleo

govfolio-drift-detection

Detect source drift in datasets against predefined baselines and rank by severity.

Community
Advanced
igor-kupczynskiigor-kupczynski

ios-debugger-agent

Build, run, and debug iOS applications on booted simulators using XcodeBuildMCP.

Community
Advanced
ajianazajianaz
4

mobile-devops

Orchestrate mobile DevOps workflows for iOS and Android builds, tests, and deployments.

Community
Advanced