Review Chromatic current state
MellyGray opened this issue · comments
Overview of the Feature Request
We need to review Chromatic current state as there are some pending changes. We need to bring it to a stable point so that the new changes applied in each new PR can be reviewed when they go through QA.
If there are some changes needed in the UI to approve the current state of Chromatic, we will create issues to assess those changes
What inspired the request?
There are pending changes in Chromatic
https://www.chromatic.com/reviews?appId=646f68aa9beb01b35c599acd
Reviewed and set baselines per the Chromatic docs to hopefully reduce the number of changed elements that need reviews at each PR. If anything is not looking as-expected then please let me know and we should review as a team.
It's nice to have all the reviews up to date! I noticed that some changes are being flagged because we are using randomized test data, it might be useful to modify how the Stories are run for chromatic, so that randomized doesn't get interpreted in Chormatic as a change in the UI.
For example in this review-
https://www.chromatic.com/review?appId=646f68aa9beb01b35c599acd&number=296&type=linked&view=changes
In the files table, we randomize File Access and ingest state
And in multiple stories, we have random faker data, for example
We could use a faker.seed() to have reproducible results (https://fakerjs.dev/guide/usage.html#reproducible-results) and have conditional logic to only set the seed for a chromatic run https://www.chromatic.com/docs/ischromatic/#with-an-environment-variable.
It could be a bit involved to set the seed correctly and have it visible to all the stories, so it might be worth saving that as a separate ticket and keep doing a visual review for now. Would be good to discuss with the team.
@ekraffmiller Based on todays call, I have opened #305 to address the Faker data differences. How should we proceed with this item?
@M27Mangan there is one more thing I noticed...sometimes the snapshot of a Story is taken before the component finishes loading, for example https://www.chromatic.com/review?appId=646f68aa9beb01b35c599acd&number=296&type=linked&view=components&groupPrefix=Sections%2FDataset+Page
Can we add this to #305? I think it can be solved by adding a delay https://www.chromatic.com/docs/delay/. Then I can close this ticket.
Closing this issue, the follow up tasks are in #305