UI Inspect
CLI Reference

upload

Upload pre-captured screenshots from a local directory.

The upload command takes screenshots you've already captured (e.g., from Playwright, Cypress, or Storybook) and uploads them for comparison.

Usage

npx ui-inspect upload <directory> [options]

Arguments

ArgumentRequiredDescription
directoryYesPath to directory containing PNG screenshots

Options

FlagTypeDefaultDescription
--project <id>stringconfig fileProject ID
--branch <name>stringauto-detectGit branch name
--commit <sha>stringauto-detectCommit SHA
--jsonbooleanfalseOutput as JSON

Example

# Upload Playwright screenshots
npx ui-inspect upload ./test-results/screenshots \
  --project proj_abc123

File naming

The upload command scans for all .png files in the directory. The filename (without extension) becomes the component name in the comparison:

screenshots/
├── homepage.png        → component: "homepage"
├── dashboard.png       → component: "dashboard"
└── login-form.png      → component: "login-form"

Integration with test runners

Playwright

playwright.config.ts
export default defineConfig({
  snapshotDir: "./screenshots",
});
npx playwright test
npx ui-inspect upload ./screenshots --project proj_abc123

Storybook

Use Storybook's screenshot addon to capture component snapshots, then upload the output directory.

On this page