RomanNum3ral
/
paperclip
mirror of https://github.com/paperclipai/paperclip.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity
paperclip/tests/storybook-visual
History
Dotta e9a5a07ab4
feat(ui): add task status badges and inline blocker removal (#13097) 
Add navigable status badges to task relationships and a separate blocker remove button with stable hover geometry. Keep Storybook previews passive and cover navigation, removal, and query refresh rendering with regression tests.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
 		2026-09-09 10:06:21 -05:00
..
README.md [codex] Document Storybook visual baseline platform lock (#9216) 2026-07-08 07:23:02 -05:00
baseline-manifest.json feat(ui): single-source design tokens, visual regression suite, and theme retune (#9134) 2026-07-07 16:22:16 -05:00
in-feed-connections.config.ts feat(connections): connect services from native task feeds (#13058) 2026-09-08 15:55:26 -05:00
in-feed-connections.spec.ts feat(connections): connect services from native task feeds (#13058) 2026-09-08 15:55:26 -05:00
new-issue-dialog-viewport.spec.ts fix(ui): keep new task dialog visible above mobile keyboard (#11281) 2026-08-12 11:49:05 -04:00
playwright.config.ts feat(ui): design-system component convergence — Card/Badge adoption, multiplicative radius ladder, unified list surfaces (#9240) 2026-07-08 17:15:45 -07:00
relationship-badges.spec.ts feat(ui): add task status badges and inline blocker removal (#13097) 2026-09-09 10:06:21 -05:00
storybook-visual.spec.ts feat(ui): single-source design tokens, visual regression suite, and theme retune (#9134) 2026-07-07 16:22:16 -05:00

README.md

Storybook Visual Baselines

The visual suite compares built Storybook stories against PNG snapshots stored outside git. The checked-in manifest at baseline-manifest.json pins the immutable archive URL, SHA-256, byte size, snapshot count, and capture environment.

Commands

pnpm storybook-visual:baseline download
pnpm storybook-visual:baseline verify
pnpm test:storybook-visual
pnpm test:storybook-visual:update

download fetches the archive, verifies its SHA-256 and byte size, unpacks it to tests/storybook-visual/.snapshots/, and checks the PNG count. The same snapshot directory can be overridden with STORYBOOK_VISUAL_SNAPSHOT_DIR.

Known Limitation: Linux Baselines

Storybook visual baselines are platform-locked. The checked-in manifest records the capture environment as ubuntu-24.04, and Playwright compares screenshots with maxDiffPixels: 0. Pixel-exact results are only meaningful when local runs use the same Linux/Ubuntu capture platform as the baseline.

macOS, Windows, and other non-matching local environments can produce false-positive diffs from font rasterization and subpixel rendering differences. Use the Storybook Visual GitHub Actions workflow on ubuntu-latest as the source of truth for cross-platform review, or run the suite locally in a matching Linux environment before accepting or updating baselines.

CI and Review Artifacts

Storybook visual tests are opt-in while the suite stabilizes. Add the storybook-visual label to a pull request, or run the Storybook Visual workflow manually, to download the pinned baseline, build Storybook, and run the Playwright visual suite on GitHub Actions.

The workflow uploads tests/storybook-visual/playwright-report/ and tests/storybook-visual/test-results/ as a storybook-visual-report-* artifact on every run. When screenshots differ, Playwright writes the actual, expected, and diff PNGs into test-results, so reviewers can inspect the failure without rerunning the suite locally.

Normal PR visual runs use repository read-only permissions and never upload or modify baseline objects. To review intentional visual changes before updating baseline-manifest.json, run the workflow manually with update_snapshots enabled. That produces a storybook-visual-baseline-review-* artifact containing the packed candidate snapshot archive for review. Publishing that bundle to the baseline bucket still requires the explicit maintainer upload command below.

Updating Baselines

  1. Run pnpm test:storybook-visual:update after reviewing intentional visual diffs.
  2. Run pnpm storybook-visual:baseline pack to create tests/storybook-visual/baseline-review/snapshots.tgz.
  3. Upload the archive from a trusted maintainer environment with STORYBOOK_VISUAL_S3_URI=s3://bucket/baselines/storybook-visual/<sha>/snapshots.tgz pnpm storybook-visual:baseline upload.
  4. Copy the printed snapshotCount and archive fields into baseline-manifest.json.

Generated snapshots, review bundles, Playwright reports, and downloaded caches are ignored by git.