エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
Storybook CSF3.0で登録したStoryをJestで再利用する
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
Storybook CSF3.0で登録したStoryをJestで再利用する
はじめに デザインシステムが盛り上がっている今日この頃、フロントエンド開発においてコンポーネントカ... はじめに デザインシステムが盛り上がっている今日この頃、フロントエンド開発においてコンポーネントカタログとしてStorybookを導入している方は多いのではないでしょうか? 今回はStorybookをコンポーネントカタログとしてだけではなく、テストツールの一部としても使用する方法について書いていこうと思います。 前提 Storybookが導入されていること Jest+Testing Libraryが導入されていること テスト対象のコンポーネントの要件 今回はメールアドレスを入力するフォームコンポーネントをテスト対象とします。 要件は以下です。 inputのid属性とlabelのfor属性が同じであること メールアドレスが未入力の場合は送信ボタンがdisabledであること 実際のコード 筆者がReactに慣れている都合上、Reactで実装した場合のコードになります。 import Reac