turbosnap

The turbosnap command analyzes your git changes to determine which screenshots are affected, letting you skip unchanged components for faster builds.

Usage

npx ui-inspect turbosnap [options]

Options

Flag	Type	Default	Description
`--base-branch <name>`	`string`	`main`	Base branch to compare against
`--json`	`boolean`	`false`	Output as JSON

How it works

Runs git merge-base to find the common ancestor with the base branch
Gets all changed files since that ancestor
Maps changed files to affected screenshot URLs using import analysis
Returns a list of screenshots that need re-testing

Example

npx ui-inspect turbosnap --base-branch main

Output:

Changed files: 5
  src/components/Button.tsx
  src/components/Card.tsx
  src/styles/globals.css
  src/pages/about.tsx
  README.md

Affected screenshots: 3/10
  ✓ button — affected by Button.tsx
  ✓ card — affected by Card.tsx
  ✓ about — affected by about.tsx
  ○ homepage — skipped
  ○ dashboard — skipped
  ○ login — skipped
  ...

Skip rate: 70%

Global dependencies

Files in turboSnap.globalDeps trigger a full re-test of all screenshots:

ui-inspect.config.yml

turboSnap:
  enabled: true
  globalDeps:
    - "src/styles/**"
    - "tailwind.config.*"
    - "package.json"

If any global dependency is changed, TurboSnap returns all screenshots as affected.

Integration with build

TurboSnap runs automatically when using --turbosnap with the build command:

npx ui-inspect build --project proj_abc123 --turbosnap

See TurboSnap Concepts for a deeper explanation of the algorithm.