IntelliJ IDEA 2026.1 Help

React アプリケーションをテストする。

React アプリケーションの ジェネレーターで作成Jest テストを実行およびデバッグできます。 始める前に、 react-scripts パッケージが package.json 依存関係オブジェクトに追加されていることを確認してください。

Jest テストは、エディター、 プロジェクト ツールウィンドウ、または実行 / デバッグ構成から直接実行およびデバッグできます。 詳細については、 Jest を参照してください。

エディターからテストを実行する

  • ガターで the Run icon または the Rerun icon をクリックし、リストから <test_name> の実行 を選択します。

    エディターから単一のテストを実行する

    ガターの テストステータスアイコン 成功したテスト および テストに失敗しました により、エディターでテストが成功したか失敗したかを確認することもできます。

実行 / デバッグ構成を介してテストを実行する。

Jest 実行 / デバッグ構成を作成する

  1. 実行 / デバッグ構成ダイアログ (メインメニューの 実行 | 実行構成の編集) を開き、左側のペインで 追加ボタン をクリックし、リストから Jest を選択します。 実行/デバッグ構成: Jest ダイアログが開きます。

  2. 使用する Node.js ランタイムとアプリケーションの作業ディレクトリを指定します。 デフォルトでは、 作業ディレクトリ フィールドにはプロジェクトのルートフォルダーが表示されます。 この定義済みの設定を変更するには、目的のフォルダーへのパスを指定します。

  3. Jest パッケージ フィールドに、 react-scripts パッケージへのパスを指定します。

  4. Jest オプション 」フィールドに --env=jsdom と入力します。

    React をテストする: Jest 実行構成

実行 / デバッグ構成を介してテストを起動する。

  1. 構成のリストから Jest 実行 / デバッグ構成を選択し、リストまたはツールバーの the Run icon をクリックします。

  2. 実行 ツールウィンドウの テストランナー タブで、テストの実行を監視し、テスト結果を分析します。 詳細については、 テスト結果を調べるを参照してください。

デバッグテスト

デバッグテスト

  1. メインツールバーのリストから Jest 実行 / デバッグ構成を選択し、右側の the Debug button をクリックします。

  2. 開いた デバッグツールウィンドウ で、通常どおり続行します: プログラムをステップ実行しプログラムの実行を停止して再開し中断時に調べ 、コールスタックと変数を調べ、ウォッチを設定し、変数を評価し、 実際の HTML DOM を表示します。

2026 年 3 月 30 日