Microsoft Edge DevTools の試験的機能

Microsoft Edge DevTools は、まだ開発中の試験的な機能にアクセスできます。 この記事では、次のいずれかの試験的な機能の一覧と説明を行います。

  • Microsoft Edge の Canary プレビュー チャネルの最新バージョン。
  • Microsoft Edge の安定版リリースの最新バージョン。

Microsoft Edge のすべてのチャネルには、試験的な機能があります。 Microsoft Edge Canary チャネルを使用して、最新の試験的な機能を取得できます。 Microsoft Edge のバージョンで使用できる実験の完全な一覧を表示するには、DevTools の [設定>Experiments ] ページを参照してください。

これらの実験は不安定または信頼性が低く、DevTools の再起動が必要になる場合があります。

実験のオンとオフを切り替える

試験的な機能は常に更新され、パフォーマンスの問題を引き起こす可能性があります。 これは、実験をオフにしたい理由の 1 つです。

Microsoft Edge で実験を有効または無効にするには:

  1. DevTools を開く場合は、Web ページを右クリックし、[検査] を選択します。 または、Ctrl + Shift + I (Windows、Linux) または Command + Option + I (macOS) を押します。 DevTools が開きます。

  2. DevTools のメイン ツール バーで、[ DevTools のカスタマイズと制御 ] ([DevToolsのカスタマイズと制御] アイコン) ボタンをクリックし、[ 設定 ] ([設定] アイコン) ボタンをクリックします。 または、 Shift キーを押しながら?キーを押します。

  3. [設定] パネルの左側で、[実験] ページ選択します。

    [設定] の [実験] ページ

  4. 実験のチェック ボックスをオンまたはオフにします。 既定では、一部の実験が選択されています。

  5. DevTools 設定の右上にある [閉じる] (DevTools >設定の [閉じる] アイコン ) をクリックします

  6. [ DevTools の再読み込み ] ボタンをクリックします。

実験が選択されている既定値の復元

試験的な機能がオンになっている既定の設定を復元するには:

  1. DevTools を開く場合は、Web ページを右クリックし、[検査] を選択します。 または、Ctrl + Shift + I (Windows、Linux) または Command + Option + I (macOS) を押します。 DevTools が開きます。

  2. DevTools のメイン ツール バーで、[ 設定] ([設定 ] アイコン) ボタンをクリックします。 または、 Shift キーを押しながら?キーを押します。 [設定] パネルが開き、[基本設定] ページが選択されています。

  3. [基本設定] ページの下部にある [既定値と更新の復元] ボタンをクリックし、[閉じる] (DevTools > [設定] の [閉じる] アイコン) をクリックします。

実験のフィルター処理

タイトルに含まれるテキストで試験的な機能をフィルター処理できます。

  1. DevTools を開く場合は、Web ページを右クリックし、[検査] を選択します。 または、Ctrl + Shift + I (Windows、Linux) または Command + Option + I (macOS) を押します。 DevTools が開きます。

  2. DevTools のメイン ツール バーで、[ 設定] ([設定 ] アイコン) ボタンをクリックします。 または、 Shift キーを押しながら?キーを押します。 [設定] パネルが開き、[基本設定] ページが選択されています。

  3. [設定] パネルの左側にある [実験] ページ選択します。

  4. [フィルター] テキスト ボックスをクリックし、タイムラインなどのテキスト入力します。 入力すると、一致するチェック ボックスのみが [実験 ] ページに表示されます。

  5. フィルター処理を終了するには、[ フィルター ] テキスト ボックスをオフにします。

実験に関するフィードバックの提供

試験的な機能に関するフィードバックをお寄せください。 Microsoft とフィードバックを共有するには、 Microsoft Edge DevTools チームにお問い合わせください

実験の一覧

Microsoft Edge の Canary プレビュー チャネルの最新バージョンに表示される実験チェック ボックスを次に示します。 Canary のチェックボックスの追加または削除の背後に続いて、安定したリリースも確認できます。

AI Explain コンソール エラー

Explain コンソール機能がオンかオフかを制御します。 Explain コンソール機能がオンの場合、Copilot アイコンをクリックするとサイドバー チャットが開き、エラーが説明されます。

関連項目:

状態:

  • このチェック ボックスは、Microsoft Edge Canary 153 に存在します。
  • このチェック ボックスは、Microsoft Edge Stable 151 に存在します。

永続的なメッセージ

Durable Messages 実験は、ネットワーク ツールのログ保持機能の機能強化です。

[Durable Messages]\( 永続メッセージ \) チェック ボックスをオンにすると、DevTools は、要求と応答本文がプロセス間ナビゲーションを存続できるように、レンダラー プロセスの外部でネットワーク応答本文をバッファーするようにブラウザーに指示します。 この機能は、ネットワーク ツールで [ログの保持] 設定が有効になっている場合にのみ有効になります。

[Durable Messages]\( 永続メッセージ \) チェック ボックスがオフの場合、既定の動作は、応答本文がレンダラー プロセスに存在し、クロスプロセス ナビゲーションの後に失われます。

関連項目:

状態:

  • このチェック ボックスは、Microsoft Edge Canary 153 に存在します。
  • このチェック ボックスは、Microsoft Edge Stable 151 に存在します。

CSS Copilot を有効にする

Microsoft Edge サイドバーで Copilot を使用して HTML 要素と CSS スタイルを説明し、 要素ツールに 表示される特定の要素またはスタイル ルールをよりよく理解できるようにします。 要素またはスタイルルールについて Copilot に質問するには、その横にある [Copilot ] ボタンをクリックし、フォローアップの質問をします。

要素ツールの Copilot アイコン

この実験は、サイドバーがオフになっている場合は使用できません。

関連項目:

状態:

  • このチェック ボックスは、Microsoft Edge Canary 153 に存在します。
  • このチェック ボックスは、Microsoft Edge Stable 151 に存在します。

シンボル サーバー拡張機能のサポートを有効にする

このチェック ボックスをオンにすると、 Edge DevTools シンボル サーバー拡張テスト 拡張機能がサポートされ、拡張機能で シンボル サーバー の新しいエクスペリエンスが提供されます。 この拡張機能はまだベータ版/テスト版です。

このチェック ボックスをオフにした場合は、DevTools >Settings>Symbol Server ページを使用します

関連項目:

状態:

  • このチェック ボックスは、Microsoft Edge Canary 153 に存在します。
  • このチェック ボックスは、Microsoft Edge Stable 151 には存在しません。

インストルメンテーション ブレークポイント

テスト ブレークポイントで停止するかどうか。 この実験により、ブレークポイントの信頼性が高くなります。

関連項目:

状態:

  • このチェック ボックスは、Microsoft Edge Canary 153 に存在します。
  • このチェック ボックスは、Microsoft Edge Stable 151 に存在します。

JPEG XL のサポート

このチェック ボックスをオンにすると、[ レンダリング ツール] の [ JPEG XL イメージ形式を無効にする ] チェック ボックスがオンになります。

状態:

  • このチェック ボックスは、Microsoft Edge Canary 153 に存在します。
  • このチェック ボックスは、Microsoft Edge Stable 151 に存在します。

DevTools のキャッチされない例外をコンソールに記録する

コンソール ツールで DevTools のキャッチされない例外をログに記録するかどうかを制御 します

関連項目:

状態:

  • このチェック ボックスは、Microsoft Edge Canary 153 に存在します。
  • このチェック ボックスは、Microsoft Edge Stable 151 に存在します。

Visual Studio Code でソース ファイルを開く

Visual Studio Code のオープン ソース ファイル実験では、ローカル ファイルを編集するために、ソース ツールのコード エディターが Visual Studio Code に置き換えられます。 この実験を有効にすると、ローカル ファイルを編集するときに開発者ツールによって検出され、ワークスペースとして使用するフォルダーを選択するように求められます。

ワークスペースとして使用するフォルダーを選択すると、DevTools でファイルへのリンクを選択すると、Visual Studio Code でファイルが開きます。 以前のバージョンの Microsoft Edge では、このアクションにより、DevTools の Sources ツールのコード エディターでファイルが開かれました。

スタイル ツールでファイル リンクを選択すると、Visual Studio Code でファイルが開きます

DevTools で行った編集によって、ハード ドライブ上のファイルが変更され、Visual Studio Code とライブ同期されるようになりました。

関連項目:

状態:

  • このチェック ボックスは、Microsoft Edge Canary 153 に存在します。
  • このチェック ボックスは、Microsoft Edge Stable 151 に存在します。

プロトコル モニター

DevTools でプロトコル モニター ツールを使用できるようにします。

プロトコル モニター ツールは、DevTools によって送受信されたメッセージを表示して、検査されたページをデバッグします。 DevTools は、Chrome DevTools Protocol (CDP) を使用して検査されたページと通信します。

このチェック ボックスをオンにし、 プロトコル モニター ツールを開くには:

  1. 上記の「実験のオンとオフを切り替える」の説明に従って、この [プロトコル モニター] チェック ボックスをオンにします。

  2. DevTools の下部にある クイック ビュー で、[ その他のツール (+)] ボタンをクリックし、[ プロトコル モニター] を選択します。

    または、Ctrl + Shift + P (Windows/Linux) または Command + Shift + P (macOS) を押すなどしてコマンド メニューを開き、テキスト ボックスに「protocol」と入力します。 次に、[ Show Protocol monitor]\(プロトコル モニターの表示\) を選択します。

    プロトコル モニター ツールは、DevTools の下部にある [クイック ビュー] パネルに表示されます。

関連項目:

状態:

  • このチェック ボックスは、Microsoft Edge Canary 153 に存在します。
  • このチェック ボックスは、Microsoft Edge Stable 151 に存在します。

関連項目