【感想】フロントエンド開発のためのテスト入門を読んだ

これまで見たことがなかったフロントエンドのテストに特化した入門書ということで読んでみました。特に印象深かった3つのポイントを感想と共に挙げてみたいと思います。

コード例がとにかく多かったです。書籍の半分近くはコード例で占められているといっても過言ではないかなと思います。

シンプルな足し算を行う関数から始まり、例外処理や非同期処理の検証方法、さらにはUIコンポーネントのテスト方法など、多様なテストシナリオが詳しく説明されていました。

値が期待値を満たしているかを検証するマッチャーの部分では、真偽値、数値、文字列、配列、オブジェクトなど、様々なデータ型に対してのテストの実装と具体的な理由が書かれていました。入門書ということもあり、序盤からとても丁寧に説明されているという印象を受けました。

また、闇雲にコードが散りばめられているというわけではなく、それぞれのテストコードがなぜ、どのように実装するべきなのかという背景も合わせて述べられているため、理解が深まったように感じます。

ツールのインストール方法から、コンポーネントをStoryに登録する手順など、Storybookを初めて使用する方でも問題ないように解説されていました。

内容としては、文字入力やトグルスイッチのクリックといった基本的なインタラクションの登録方法から、ReactのContext APIやWeb APIに依存したコンポーネントといった少々複雑なケースについても取り扱われています。

導入からテストの実装方法まで、一通りの流れについて学ぶことができて、これまでのStorybookに対する苦手意識が薄まりました。 Storybookを初めて使う方から既に経験がある方まで、価値のある内容となっているのかなと思います。

これまでフロントエンドのテストを書いたことがない人からすると、テストを導入するハードルはそれなりに高いはずです。しかし、この書籍を読むことで、少なくとも単体テストレベルなら比較的楽に導入できることが分かります。

さらに、ビジュアルリグレッションテストやE2Eテストといった応用的な手法についても説明があるため、単体テストや結合テストから自然にステップアップし、既存の開発に組み込むことが可能になると感じました。

そして、テストの書き方に迷ったときは、この書籍のコード例を参考にして実装に役立てることもできるはずです。

他にもアクセシビリティを配慮したテストの書き方や、カバレッジレポートの読み方などの新しい学びがたくさんありました。フロントエンドのテストについて学んでみたいという方はぜひ読んでみてください！

まっつーのブログ