Open
Conversation
bgentry
force-pushed
the
bg/visual-regression-plan
branch
from
4aca7da to
0625907
Compare
Storybook scenarios were not exercised in CI, and there was no self-hosted screenshot baseline for catching unintended UI changes. This left UI regressions dependent on manual review and an external visual testing addon. Switch Storybook testing to a self-hosted model by wiring a dedicated storybook test project in Vitest and adding a Playwright visual suite that snapshots stories tagged with `visual`. The visual runner builds and serves static Storybook output, honors optional per-story `parameters.visual` settings, disables motion for deterministic output, and commits an initial baseline set for stable component stories. The CI workflow now includes an isolated Storybook/visual job that runs story execution separately from screenshot assertions and uploads Playwright artifacts when diffs fail. Story fixtures that depended on current time or randomness were made deterministic so baseline images remain stable. This adds initial coverage for the tagged Badge, TagInput, and JSON stories through committed Playwright snapshots, and broad story execution coverage through the Storybook Vitest project.
The repository still pinned parts of the build and packaging pipeline to Node 22, which diverged from the current production LTS line and could cause inconsistent behavior between CI/package builds and the intended runtime baseline. Update the Node runtime pins to the 24 LTS line for packaging and image build stages, and keep the packaging workflow's Node selection centralized through `NODE_VERSION`. This keeps Docker image Node pins explicit for Dependabot visibility while aligning build-time Node usage with the updated LTS target.
bgentry
force-pushed
the
bg/visual-regression-plan
branch
from
06ca3b9 to
256f6a4
Compare
brandur
approved these changes
Apr 21, 2026
Collaborator
brandur
left a comment
brandur
left a comment
There was a problem hiding this comment.
Cool! I'd just ask that if this ever starts to become flaky/annoying to make it okay just to remove it wholesale.
I've tried a dozen UI frameworks over the years at ~5 jobs and they all seem like a good idea when they go in, but I've yet to ever find seen one that's actually worked. By the later part of its lifespan it's usually a pretty bad place because people are attached enough to the idea of testing that they don't want to remove them, but they're causing lots of pain for everyone on a daily basis.
| env: | ||
| # Test database. | ||
| TEST_DATABASE_URL: postgres://postgres:postgres@127.0.0.1:5432/river_test?sslmode=disable | ||
| NODE_VERSION: &node_version "24.14.1" |
Collaborator
There was a problem hiding this comment.
This reference syntax is new right? Kind of nice to finally have it.
May alphabetize these vars for general nicety.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
This adds a self-hosted Storybook regression workflow so UI behavior is covered in CI without relying on an external visual testing service. Story rendering is now exercised via a dedicated Storybook Vitest project, and visual diffs are handled with Playwright snapshots for stories tagged with
visual.It also adds the deterministic fixtures and visual-test plumbing needed to keep screenshots stable, seeds an initial baseline set for
Badge,TagInput, andJSONView, and documents the ongoing workflow for tagging stories, running visual tests, and updating snapshots.Along the way, CI/runtime tooling was brought forward so the pipeline stays current: workflow action pins were moved to current major versions, and Node runtime pins were moved to the 24 LTS line in workflows and Docker build stages.