Integrate Storybook Interactions addon

[certainlyakey]

Summary

We could think of adding this plugin to the project's Storybook.

The plugin allows to replay some basic interactions on a story load. 

This means that we could have a separate story for eg a select component with a dropdown opened, or a modal already on-screen (right now in all the stories you need to click a button that opens it first).

It does overlap a bit with what Cypress does, but, in addition to e2e tests, still brings separate value to manual testing and visual regression testing. We could have 2 things improved: 

• for people manually testing or reviewing components in the Storybook it would be easier to notice regressions because no extra clicks would need to be done eg. to open a modal;
• it integrates nicely to Chromatic testing, making screenshots of actual modals and popups instead of buttons that open them and thus tracking visual changes in those.

What alternatives have you tried?

There are no direct alternatives. Indirectly the same value could be provided by adding isOpen-like props to components that open a popup and then switching a control in a story. But that would mean introducing a minor change to the codebase while the addon allows to avoid any changes to the actual components.

Does this feature request involve any updates to the reference design?

No

Implementation details

Implementation would involve adding @storybook/addon-interactions to package.json and adding more stories that employ play function.