Stitch Extract Static HTML

This skill is a catalog-normalized import from https://github.com/google-labs-code/stitch-skills at commit 3f64079d75d025bc5890c73669f27c26a2d80b31, source path plugins/stitch-design/skills/extract-static-html. The upstream control file was corrected for this workspace: the verified Stitch MCP surface here is design-system oriented, so screen lookup, screen generation, and screen editing tools must be used only when the current host explicitly exposes them.

When to Use This Skill

• Use when a route or UI state must become standalone HTML for review or Stitch upload.
• The task involves Google Stitch project IDs, .stitch/ artifacts, DESIGN.md files, Stitch exports, or Stitch-specific validation.
• The broader stitch-design router points here as the narrowest workflow.

Workflow

1. Prefer scripts/snapshot.ts when the app can run locally without auth blockers.
2. Use interactive browser capture only when clicks, form input, or navigation are needed first.
3. Use static mock fallback only when the app cannot run and the user accepts a manually flattened state.
4. Start or identify the dev server and record the URL before capture.
5. Run npx tsx scripts/snapshot.ts --url <url> --output .stitch/<page>.html with matched viewport and wait flags.
6. Open or parse the output to confirm CSS, images, and critical layout survived script removal.

Local Assets