デバッグツールウィンドウ

セッション

複数のデバッグセッションを同時に実行すると、それらは デバッグ ツールウィンドウの上部にあるタブに分割されます。

インライン変数値や実行ポイントなど、エディター内のすべての情報は、選択したセッションタブに表示されます。 これは、同じクラスを使用する複数のデバッグセッションを並行して実行している場合に重要です。

タブを閉じると、対応するデバッグセッションが終了します。

タブ

デバッグ ツールウィンドウには、セッションごとに次のタブが表示されます。

• フレーム: マルチペイン Node.js アプリケーションまたはサービスワーカーのデバッグ時に、このペインを使用してコールスタック内を移動し、スレッド間を切り替えます。

  

• 変数: 現在のコンテキストで使用可能な変数を一覧表示し、プログラムの状態を分析および変更できます。

• ウォッチ: ウォッチを管理できます。 デフォルトでは、画面スペースをより効率的に使用するために、ウォッチは 変数 タブに表示されます。 ウォッチがたくさんある場合は、別のタブで表示することを検討してください。

• コンソール: プログラム出力を表示します。

  クライアントサイドアプリケーションでは、タブにコードですべてのログ（例えば、 console.* を使用）も表示され、さらに read-eval-print ループ （REPL ）として動作するため、JavaScript コードスニペットを実行してデバッグ中のページと対話できます。 対話型デバッガーコンソール から詳細をご覧ください

• プロセスコンソール: WebStorm は、Node.js アプリケーションをデバッグする際にこのタブを開きます。 このタブには、ノードプロセス自体の出力、つまり、 process.stdout(英語) および process.stderr(英語) に直接書き込まれるか、 console.*(英語) を使用してログに記録されるすべてのものが表示されます。 対話型デバッガーコンソールの使用 から詳細を参照してください。

  

• デバッガーコンソール: WebStorm は、Node.js アプリケーションをデバッグする際にこのタブを開きます。 ここでは、JavaScript コードスニペットを実行し、 console.*(英語) メッセージを表示できます。

  詳細は 対話型デバッガーコンソールの使用 をご覧ください。

• スクリプト: JavaScript デバッグセッション中、タブには、JavaScript コードの実行中に自動的にダウンロードされるすべての外部リソースが表示されます。 このタブを使用して、外部リソースのダウンロードを監視します。 エディターでリソースのコードを開くには、問題のアイテムをダブルクリックします。

• 要素: このタブには、実際の HTML ソースコードとアクティブなブラウザーページの HTML DOM 構造(英語)が表示されます。 タブを使用して、ブラウザーを介してページに加えられた変更を監視します。

  このタブは、クライアント側のコードをデバッグしているときにのみ使用できます。

ツールバー

デバッガーツールバーには、 デバッガーセッションの制御と ステップ実行に最もよく使用されるアクションが含まれています。

好みに応じて、ツールバーで使用できるアクションのリストを構成できます。