Why do we Need Storybook?

Testing React components, rather than JavaScript functions, is more difficult because they must first be rendered, which requires state, properties, a virtual DOM, and so on. It’s possible to do this without Storybook, but when we’re testing rendered components, there’s no substitute for actually looking at the rendered result. To make that happen, we can use Storybook and snapshot tests.

The problem at hand

Jest is good for reviewing the way the computer sees code: as data structures. It allows us to test the pieces in isolation and check that the logic agrees with how we think it should work. This is useful, but users are not computers. They see our application in the browser as boxes, text, pixels. What we really want to know is whether the page appears correct to the user, but this is an ill-defined concept. There is currently no way to automate checking for correct appearance. So what is an alternative to automation?