JSTestDriver
JetBrains Rider は JSTestDriver テストフレームワークとの統合をサポートします。
始める前に
設定で JavaScript and TypeScript プラグインが有効になっていることを確認します。 Ctrl+Alt+S を押して設定を開き、 を選択します。 インストール済み タブをクリックします。 検索フィールドに JavaScript and TypeScript と入力します。 プラグインの詳細については、 プラグイン管理を参照してください。
JetBrains マーケットプレイスからプラグインをインストールする説明に従って、 設定 | プラグイン ページの Marketplace タブに JSTestDriver プラグインをインストールして有効にします。
このプラグインを通じて、JetBrains Rider は JSTestDriver サーバーとアサーションフレームワークを提供します。 テストの作成中に、プラグインは単体テストフレームワークを検出し、 <テストフレームワーク> のサポートを追加するインテンションアクションを提案します。
プロジェクトでテストフレームワークを構成する
お好みのフレームワークをダウンロードし、 JetBrains Rider JavaScript ライブラリとして構成してください。
次のいずれかを実行します:
<テストフレームワーク> のサポートを追加するインテンションアクションを使用して、テスト作成中にオンザフライでフレームワークサポートを有効にします。
Jasmine を使用するには、構成ファイルに
jasmine-jstd-adapterを追加します。jsTestDriver.conf を開き、次のコードを入力します。
load: lib/jasmine/jasmine.js lib/jasmine-jstd-adapter/JasmineAdapter.js
テストランナー構成ファイルを手動で作成する
テストランナー構成ファイルは、ロード順序をロードするためのテストファイルと実動ファイルを定義します。 JetBrains Rider は拡張機能 .jstd または .conf を持つファイルをテストランナー構成ファイルとして扱います。
構成ファイルを作成するには
プロジェクト ツリーで、運用フォルダーとテストフォルダーの親フォルダーを選択し、コンテキストメニューから 新規 | ファイル を選択します。
開いた 新規ファイル ダイアログで、拡張子 .jstd または .conf が付いた構成ファイルの名前を入力します。
エディターで新しいファイルを開き、現在のフォルダーへのフルパスと、それに関連してロードするファイルへのパスを指定します。 ファイル名パターンにはワイルドカードを使用します。
YAML を使って構成ファイルを完成させ、 テストランナー構成ファイルの説明を参照してください。
テストを実行
JetBrains Rider を使えば、エディターから JSTestDriver テストをすぐに実行したり、実行/デバッグ構成を作成して一部またはすべてのテストを実行できます。
エディターから単一のテストを実行するには
左側のガターの
または
をクリックして、リストから 実行 <テスト名> を選択します。
ガターの テストステータスアイコン
および
により、エディターでテストが成功したか失敗したかを確認することもできます。
JSTestDriver 実行構成を作成するには
実行 / デバッグ構成ダイアログ (メインメニューの ) を開き、左側のペインで
をクリックし、リストから JSTestDriver を選択します。 「実行 / デバッグ構成: JSTestDriver 」ダイアログが開きます。
実行するテスト、構成ファイルへのパス、テスト実行前に実行するアクティビティを指定します。
WebStorm のデフォルト JSTestDriver テストサーバーを起動するには
プロジェクトに少なくとも 1 つの設定ファイルがあることを確認してください。
JSTestDriver サーバー ツールウィンドウ( )を開き、ツールバーの
をクリックします。
ユニットテストでサーバーを停止するには
ツールバーの
をクリックします。
ブラウザーをキャプチャーするには
JSTestDriver サーバーを起動するがまだ実行されていない場合は、 JSTestDriver サーバー ツールウィンドウに切り替えます。
JSTestDriver の リモートコンソール を使用してローカルブラウザーを起動するには、次のいずれかの操作を行います。
お好きなブラウザーを示すアイコンをクリックします。
ブラウザーがすでに開かれている場合は、 URL を使用してブラウザーをキャプチャーする 読み取り専用フィールドの内容をコピーし、URL をアドレスバーに貼り付けます。
いずれの場合も、選択したブラウザーを示すアイコンがアクティブになります。
JSTestDriver サーバー ツールウィンドウに切り替え、今開いたブラウザーを示すアイコンをクリックします。 JetBrains Rider は、テストを実行する準備ができていることを知らせるメッセージを表示します。
実行構成を介してテストを実行するには
構成のリストから JSTestDriver 実行 / デバッグ構成を選択し、リストまたはツールバーの
をクリックします。
実行 ツールウィンドウの テストランナー タブで、テストの実行を監視し、テスト結果を分析します。 詳細については、 テスト結果を調べるを参照してください。
ナビゲーション
JetBrains Rider を使用すると、ファイルと関連テストファイルの間、または テストランナータブのテスト結果からテストに移動できます。
テストとそのサブジェクト間、またはその逆に移動するには、エディターでファイルを開き、コンテキストメニューから または を選択するか、 Ctrl+Shift+T を押します。
テスト結果からテスト定義に移動するには、「テストランナー 」タブでテスト名を 2 回クリックするか、コンテキストメニューから「 」を選択するか、単に F4 を押します。 テストファイルがエディターで開き、テスト定義にキャレットが置かれます。
デバッグテスト
JSTestDriver テストのデバッグセッションは、実行 / デバッグ構成からのみ開始されます。
デバッグテストを開始するには
上記の説明に従って JSTestDriver 実行 / デバッグ構成を作成します。
構成のリストから JSTestDriver 実行 / デバッグ構成を選択し、リストまたはツールバーの
をクリックします。
デバッグウィンドウ が開いたら、通常どおり操作してください: プログラムをステップ実行し、 プログラムの実行を停止・再開し、 中断時に調査し、コールスタックや変数を確認し、ウォッチを設定して変数を評価し、 実際の HTML DOM を表示などができます。
コードカバレッジの監視
JetBrains Rider を使用すると、 Karma テストでコードがどの程度カバーされているかを監視することもできます。 JetBrains Rider は、専用の カバレッジ ツールウィンドウにこの統計情報を表示し、カバーされた行とカバーされていない行をエディターおよび エクスプローラー ツールウィンドウ (Alt+1) で視覚的にマークします。
カバレッジでテストを開始する
上記の説明に従って JSTestDriver 実行 / デバッグ構成を作成します。
JSTestDriver サーバーを起動すると ブラウザーをキャプチャーして 、テストを実行します。
構成のリストから JSTestDriver 実行 / デバッグ構成を選択し、リストまたはツールバーの
をクリックします。
カバレッジツールウィンドウでコードカバレッジを監視します。
カバレッジ分析からファイルを除外するには
上記の説明に従って JSTestDriver 実行 / デバッグ構成を作成します。
カバレッジ タブで、除外するファイルへのパスを指定します。