[fma]

For those who are using Storybook: Do you develop your component in storebook first? Then implement on your actual page?

Also are you able to leverage it for automation test? I.e. if you have a photo gallery...have a state where it has 0 photos, 1, 2.. and have some UI automation test (i.e. Selenium) run against it?

If not do you have any recommendations for something like this kind of use case?

[crubier]

Yes we develop on storybook first, it’s a bit like TDD but for UI.

And yes, we use Chromatic (their hosted service) and it’s been hugely beneficial, I would say a 10x ROI. Super useful for visual regression testing, sharing with non technical people in the org, etc...)

My recommendation in this field is Storybook. It’s the best tool for this use case. We also use Cypress for integration tests and heat for unit tests.

[fma]

Hi - Thanks for your reply! Glad to hear of success amid a sea of negative experiences.

I tried looking up "Heat" but was not able to find a framework/util. Could you send me the link please?

It looks like the testing feature of Chromatic is to take screenshots of the deployed component and visually compare them? So there's literally no code writing if comparing one commit to the next.

[crubier]

Sorry, autocorrect transformed « Jest » to « Heat ». I meant « Jest »

And yes you are right about Chromatic. It informs you directly in GitHub PRs about the number of stories that changed, visually or at the dom level. And has a nice UI to review changes visually in a click.