テスト

React および Next.js では、いくつかの異なる種類のテストを記述できます。それぞれに独自の目的とユースケースがあります。このページでは、アプリケーションをテストするために使用できる種類と一般的に使用されるツールについて概要を説明します。

テストの種類

• ユニットテストでは、個々のユニット (またはコードブロック) を分離してテストします。React では、ユニットは単一の関数、フック、またはコンポーネントにすることができます。
  • コンポーネントテストは、テストの主な対象が React コンポーネントである、より焦点を絞ったユニットテストです。これには、コンポーネントがどのようにレンダリングされるか、プロップとの相互作用、およびユーザーイベントへの応答における動作をテストすることが含まれる場合があります。
  • 統合テストでは、複数のユニットがどのように連携するかをテストします。これは、コンポーネント、フック、および関数の組み合わせにすることができます。
• エンドツーエンド (E2E) テストでは、ブラウザのような実際のユーザーシナリオをシミュレートする環境でユーザーフローをテストします。これは、本番環境のような環境で特定のタスク (例: サインアップフロー) をテストすることを意味します。
• スナップショットテストでは、コンポーネントのレンダリングされた出力をキャプチャし、スナップショットファイルに保存します。テストを実行すると、コンポーネントの現在のレンダリングされた出力が、保存されたスナップショットと比較されます。スナップショットの変更は、予期しない動作の変更を示すために使用されます。

非同期サーバーコンポーネント

async サーバーコンポーネントは React エコシステムでは新しいものであるため、一部のツールでは完全にサポートされていません。それまでの間、async コンポーネントにはユニットテストではなくエンドツーエンドテストを使用することをお勧めします。

ガイド

これらの一般的に使用されるテストツールを使用して Next.js をセットアップする方法については、以下のガイドを参照してください。