Storybook の 6.4.0 がリリースされ、Interactive storiesが新機能として追加されました。詳細はStorybook のブログでも記載されています。 概要 Interactive stories の Addon を追加すると、testing-library で定義した操作を Storybook 上で確認することができるようになります。 次の gif のようにユーザー操作に対するコンポーネントの状態を UI(Addon)からステップごとに確認できます。 導入手順 パッケージを追加する Storybook のmain.jsに設定を追加する Interactive stories 用の story をstories.tsxに追加する 1. パッケージを追加する Interactive addon を利用するには次のパッケージが必要です。 (今回は React のコンポ
![Interactive storiesを使ってStorybook上でユーザー操作の状態を確認する | サイボウズ フロントエンドエキスパートチーム](https://cdn-ak-scissors.b.st-hatena.com/image/square/f81be0749655538fbc2574e0ba36f45b0956eff9/height=288;version=1;width=512/https%3A%2F%2Fcybozu.github.io%2Ffrontend-expert%2Fogp%2Fposts%2Fstorybook-interactive-stories.jpg)