Storybook でテストする: play 関数と Chromatic
テスト 3 層の第 2 層を書きます。story に play 関数を足して開閉の操作を検証し、Vitest アドオンで実ブラウザの上で実行します。a11y の違反をテストの失敗にする設定と、Chromatic で見た目の差分を検知する流れも扱います。
テスト 3 層の第 2 層を書きます。story に play 関数を足して開閉の操作を検証し、Vitest アドオンで実ブラウザの上で実行します。a11y の違反をテストの失敗にする設定と、Chromatic で見た目の差分を検知する流れも扱います。
Base UI と Tailwind CSS のプロジェクトに Storybook を入れ、ダイアログの閉じた状態と開いた状態を story にします。導入コマンドが足すもの、Tailwind CSS を story に効かせる設定、a11y アドオン、CSF 3 での story の書き方を扱います。