storybook-visual-testing

Give every story static args or fixtures instead of live data, freeze the clock with storybook-addon-mock-date, and make infinite JS animations honor prefers-reduced-motion. UI Verify already seeds Math.random, kills CSS animations, and waits for fonts, so only app-internal variation needs fixing.

Use storybook-addon-mock-date on Storybook 10+ and set parameters.mockingDate in .storybook/preview.ts, overridable per meta or story. On older Storybook, install @sinonjs/fake-timers in a decorator with install({ now: FROZEN_NOW }) to cover Date, Date.now, and timers.

Yes. The capturer kills CSS animations and transitions, disables the Web Animations API, emulates prefers-reduced-motion, seeds Math.random, and waits for fonts and images. You only need to fix the clock, infinite JS loops, live data, and non-Math.random randomness.

Check navigator.userAgent for the UIVerify marker or test for the window.__UI_VERIFY__ global. Use that branch to render a settled end frame, for example disabling a chart animation or drawing one static canvas frame instead of starting a requestAnimationFrame loop.

The usual cause is live or dynamic data: star counts, timestamps, or reordered lists that change between captures. Replace them with fixed args or MSW-mocked responses, and pin any clock reads, since static data cannot churn run-to-run.

No. Stories are isolated components with no page scroll, analytics, or consent scripts, so those concerns do not apply. Scroll-settling and third-party stubbing are real-page capture problems covered by the playwright-visual-testing skill, not story-level testing.