テストの実行
ファイルまたはフォルダー内で直接テストを実行する
テストを開始する前に特定のアクションが必要なく、コードカバレッジなどの追加オプションを構成したくない場合は、次のオプションを使用してテストを実行できます。
キャレットをテストに置き、Ctrl+Shift+F10 を押します。または、テストの横にある ガターアイコンをクリックし、リストから実行 '<test name>' を選択します。
ガターアイコンは、テストの状態に応じて変化します。
ガターアイコンは、一連のテストを示します。
ガターアイコンは、新しいテストをマークします。
ガターアイコンは、成功したテストを示します。
ガターアイコンは、失敗したテストをマークします。
ファイル内のすべてのテストを実行するには、プロジェクトツールウィンドウ Alt+1 でこのファイルを選択し、コンテキストメニューから実行 '<filename>' を選択します。
実行ウィジェットを使用してテストを実行する
テストを実行すると、WebStorm は一時的な実行構成を作成します。一時的な実行構成を保存したり、設定を変更したり、チームの他のメンバーと共有したりできます。詳細については、実行 / デバッグ構成を参照してください。
新しい実行構成を作成するまたは一時的なものを保存します。
メインツールバーの実行ウィジェットを使用して、実行する構成を選択します。
をクリックするか、Shift+F10 を押します。
Structure からテストを実行する
構造ツールウィンドウで、テストを右クリックし、 実行 'method name' (Ctrl+Shift+F10) を選択します。
WebStorm はこのテストで一時的な実行構成を作成します。この構成を再利用するには、必要に応じて保存して編集します。
テスト用の実行構成を作成する
次のいずれかを実行して実行 / デバッグ構成ダイアログを開きます。
メインツールバーの構成スイッチャーから、
を選択します。に移動します。
Alt+Shift+F10 を押して、コンテキストメニューから構成の編集を選択します。
ツールバーの をクリックし、目的の構成タイプを選択します。
Jest。Jest および実行 / デバッグ構成: Jest を参照してください。
Karma。Karma および実行 / デバッグ構成: Karma を参照してください。
Mocha。Mocha および実行 / デバッグ構成: Mocha を参照してください。
Node.js テストランナー。組み込みの Node.js テストランナーを参照してください。
Dart をテストするための DartUnit、実行 / デバッグ構成: Dart テストを参照してください。
表示されたダイアログで、テストの実行前に実行するテストの範囲、構成パラメーター、アクティビティを指定します。変更を適用してダイアログを閉じます。
WebStorm がテストの実行を終了すると、その実行構成のタブ上の実行ツールウィンドウに結果が表示されます。テスト結果の分析の詳細については、「テスト結果を調べる」を参照してください。
右側のコンソールには、現在のテストセッションの出力が表示されます。テスト結果のリストの上にあるテスト結果ツールバーには、いくつかの便利なオプションがあります。
コミット後にテストを実行する
変更をプッシュする前に変更によってコードが壊れないことを確認したい場合は、コミットチェックとしてテストを実行することでそれを行うことができます。
テスト構成をセットアップする
テスト用の有効な実行 / デバッグ構成が少なくとも 1 つあることを確認してください。
Alt+0 を押してコミットツールウィンドウを開き、コミットオプションを表示 をクリックします。
「コミットチェック」メニューで、「テストの実行」オプションの横にある「構成の選択」をクリックし、実行する構成を選択します。
テスト構成をセットアップした後、コミットするたびに指定されたテストが実行されます。
テストを停止
実行構成のタブのテスト結果ツールバーで次のオプションを使用します。
をクリックするか、Ctrl+F2 を押してプロセスを直ちに終了します。
テストの再実行
1 つのテストを再実行
実行ツールウィンドウの実行構成のタブでテストを右クリックし、実行 'test name' を選択します。
セッションですべてのテストを再実行する
実行ツールバーの をクリックするか、Ctrl+F5 を押して、セッション内のすべてのテストを再実行します。
失敗したテストの再実行
失敗したテストのみを再実行するには、テスト結果ツールバーの をクリックします。
失敗したテストとともに、前回のテスト実行中に無視された、または開始されなかったテストをトリガーするように IDE を構成できます。実行ツールバーの をクリックし、再実行失敗に開始されていないテストを含めるオプションを有効にします。
テストを自動的に再実行する (--watch モード)
WebStorm では、自動テストのようなランナーを有効にすることができます。現在の実行構成のテストは、関連するソースコードを変更すると自動的に再起動します。
自動テストのようなランナーを有効にするには、テスト結果ツールバーで 自動的に再実行をクリックします。
失敗したテストをデバッグする
テストが失敗する理由がわからない場合は、デバッグできます。
エディターで、ブレークポイントを設定する行のガターをクリックします。
プログラムを中断したい場所に応じて、使用できるブレークポイントにはさまざまなタイプがあります。詳細については、ブレークポイントを参照してください。
失敗したテストの横にある ガターアイコンを右クリックし、デバッグ 'test name' を選択します。
テストはデバッグモードで再実行されます。その後、テストは一時停止され、現在の状態を確認できるようになります。
テストをステップ実行して、その実行を詳細に分析できます。
関連ページ:
コードカバレッジ
WebStorm を使用すると、コードのどの程度がテストでカバーされているかを監視することもできます。WebStorm は、専用のカバレッジツールウィンドウにこの統計を表示し、カバーされた行とカバーされていない行をエディターとプロジェクトツールウィンドウに視覚的にマークします。カバレッジ測定の結果はカバレッジスイートに保存されます。既存のスイートのいずれかとマージすることもできます。この場合、その行が少なくとも 1 回のテスト実行でカバーされていれば、そのラインはカバーされていると見なされます...
実行 / デバッグ構成
WebStorm は、実行 / デバッグ構成を使用して、コードを実行、デバッグ、テストします。各構成は、何を実行し、どのパラメーターと環境を使用するかを定義する、名前付きのスタートアッププロパティのセットです。実行 / デバッグ構成には 2 つのタイプがあります。一時的 — コンテキストメニューからを選択するたびに作成されます。コンテキストメニューを呼び出すには、オブジェクトまたは領域を右クリックします。永続的 — テンプレートから明示的に作成されるか、一時的な構成を保存することによって作成されま...
実行 / デバッグ構成ダイアログ
このダイアログを使用して、実行 / デバッグ構成を作成、編集、調整、削除したり、新しく作成されたすべての実行 / デバッグ構成に適用されるデフォルトのテンプレートを構成したりします。既存の実行 / デバッグ構成は、構成タイプごとにグループ化されています。新しい構成を作成するためのテンプレートは編集可能であり、ダイアログの左側のペインにある構成テンプレートの編集リンクから利用できます。共通設定:実行構成を編集するとき(ただし実行構成テンプレートは編集しないとき)、次のオプションを指定できます。名...
Jest
Jest は、特にクライアント側の JavaScript アプリケーションおよび React アプリケーション用のテストプラットフォームです。プラットフォームの詳細については、Jest の公式 Web サイトを参照してください。WebStorm の Jest でテストを実行し、デバッグすることができます。テスト結果はツリービューで確認でき、そこからテストソースに簡単に移動できます。テストのステータスは、エディターでテストの横に表示され、すぐに実行したりデバッグすることができます。始める前に:お使いのコ...
実行 / デバッグ構成: Jest
作成: このページでは、構成固有の項目と、すべての実行 / デバッグ構成に共通のオプションについて説明します。この構成の使用方法の詳細については、「Jest」を参照してください。このダイアログでは、Jest テストを実行するための構成を作成します。JavaScript および TypeScript コードの Vitest テストの作成の詳細については、Vitest 公式 Web サイトの Vitest の機能を参照してください。始める前に:お使いのコンピューターに Node.js がインストールされてい...
Karma
Karma は、クライアント側 JavaScript をテストするためのツールです。Karma は、実際のブラウザーで実行されているアプリケーションに対してテストを実行し、テスト結果の正確さと信頼性を保証します。WebStorm は Karma と統合されているため、IDE 内からテストの実行、デバッグ、カバレッジを監視できます。テスト結果はツリービューで確認でき、そこからテストソースに簡単に移動できます。テストのステータスは、エディターのテストの横に表示され、すぐに実行またはデバッグするオプショ...