Menu

テスティング

React and Next.jsでは、それぞれ異なる目的とユースケースを持つ複数の種類のテストを作成できます。このページでは、アプリケーションをテストするための種類とよく使用されるツールの概要を提供します。

テストの種類

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

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

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

ガイド

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