Proof of Concept of a Rails app into Storybook with Appraise.qa for visual approval testing (kind of Chromatic.com DIY ;).

January 2022 - Component visual testing with ViewComponents and Appraise.qa

At Google Presentations

Component visual testing with ViewCompontents and Appraise.qa

$ git clone https://github.com/nando/RSA.git
$ cd RSA
$ bundle install
$ yarn install

$ rake view_component_storybook:write_stories_json
$ bundle exec rails server

At this point we have two options:

• run our Storybook server localy: npm run storybook, or
• generate it static at public/storybook/: npm run storybook:build

If we have opted for the latter option (usual when deploying to a server) we should be able to enjoy the stories of our components in https://localhost:3000/storybook/.

$ npm run examples

To approve all the examples in one page:

$ npm run approve -- --page "awesome_component"

To approve a specific example:

$ npm run approve -- --page "awesome_component" --example "Button w short text"

Joel Hawksley's talk at RailsConf 2021 "ViewComponents in the Real World"

• View Components, Storybook and Tailwind: The Holy Trinity?
• How to Setup Storybook with Rails View Components in under 10 Minutes