DevTools の新機能 (Microsoft Edge 105)

Microsoft Edge DevTools の最新機能と Microsoft Visual Studio Code および Visual Studio 用の Microsoft Edge DevTools 拡張機能を確認するには、これらのお知らせをお読みください。

最新の状態を維持し、最新の DevTools 機能を入手するには、Insiders プレビュー バージョンの Microsoft Edge をダウンロードしてください。 Windows、Linux、macOS のいずれを使用している場合でも、既定の開発ブラウザーとして Canary (または別のプレビュー チャネル) を使用することを検討してください。 Microsoft Edge のベータ版、開発版、カナリア版は、Microsoft Edge の安定したリリースバージョンと並べて、個別のアプリとして実行されます。 「Microsoft Edge Insider Channels」を参照してください。

最新のお知らせについては、 Twitter の Microsoft Edge チームに従ってください。 DevTools に関する問題を報告したり、新機能を要求したりするには、 MicrosoftEdge/DevTools リポジトリに問題を提出します。

ビデオ: DevTools 105 の新機能

ビデオのサムネイル画像

アプリケーション ツールから PWA のプロトコル ハンドラーをテストする

Microsoft Edge 105 では、 アプリケーション ツールでプロトコル ハンドラーのテストがサポートされるようになりました。 Microsoft Edge 96 以降、プログレッシブ Web アプリ (PWA) のアプリケーション マニフェストでプロトコル ハンドラーを定義できました。 これで、PWA がインストールされている場合は、DevTools の アプリケーション ツール自体からこれらのプロトコルをテストできます。

PWA に対して DevTools が開いている場合:

  1. アプリケーション ツールを開きます。
  2. 左側で、[ アプリケーション>Manifest>Protocol Handlers] を展開して選択します。
  3. [ プロトコル ハンドラー] ページの [ プロトコル ハンドラー ] ドロップダウン リストで、テストするプロトコルを選択します。
  4. テキスト ボックスに、テストする URL またはエンドポイントを入力します。
  5. [ プロトコルのテスト ] ボタンをクリックします。

アプリケーション ツールは、指定したプロトコルと URL を使用して PWA の起動を試みます。 ブラウザーは、アプリケーションを開くアクセス許可を求め、起動するプロトコルとアプリを処理することを確認するように求められます。 アクセス許可を付与すると、指定したコンテンツでアプリが開きます。

プロトコル ハンドラー

関連項目:

ネットワーク コンソール ツールでネットワーク要求の編集と再送信をより確実に行う

以前の Microsoft Edge では、ネットワーク ツールからネットワーク要求の 編集と再送信 を選択しても、 ネットワーク コンソール ツールが確実に開かず、要求の値が事前に設定されている可能性があります。

Microsoft Edge 105 では、この問題は従来の DevTools UI で修正されています。 この問題は、今後のリリースでフォーカス モード DevTools UI でも修正される予定です。 [編集と再送信 ] で、再送信するネットワーク要求の値が ネットワーク コンソール ツールに事前設定されるようになりました。 ネットワーク コンソール ツールから要求を送信する前に、引き続きこれらの値を変更できます。 この問題に関するフィードバックをお寄せいただきありがとうございます。

変更して再送信するネットワーク要求を右クリックし、[編集] と [ 再送信] を選択します。

編集と再送信

ネットワーク コンソールで、ネットワーク要求情報を編集し、[送信] ボタンをクリックします。

ネットワーク コンソールの編集と送信

関連項目:

フォーカス モード: DevTools、アクティビティ バー、クイック ビューの場所コントロールが改善されました

Microsoft Edge 105 では、 クイック ビュー パネルの向きを変更するための新しいオプションなど、場所コントロールにいくつかの機能強化が行われています。

DevTools のカスタマイズと制御 (...) メニューに、サブメニューを開く必要なく、DevTools のドッキング場所を設定するボタンが直接含まれるようになりました。 [Dock location]\(場所のドッキング\) アイコンのコントラストが向上し、現在選択されている [場所のドッキング] ボタンが強調表示されるようになりました。

このメニューには、サブメニューを使用するのではなく、 アクティビティ バー が表示される場所を設定して示すボタンも直接含まれるようになりました。

以前のバージョンの Microsoft Edge でのフォーカス モードでのドッキング場所の選択:

前に場所のメニュー アイコンをドッキングする

Microsoft Edge 105 のフォーカス モードでのドッキング場所の選択:

後にドッキング場所のメニュー アイコン

クイック ビュー ツール バーとパネルの向きも変更できるようになりました。 [クイック ビュー] パネルを水平方向ではなく垂直方向に表示するには、[クイック ビューを右にドッキング] ボタンをクリックします。

右側にクイック ビューをドッキングする

クイック ビュー ツール バーとパネルを水平方向に戻すには、[クイック ビューを下にドッキング] ボタンをクリックします。

クイック ビューを一番下にドッキングする

いずれかの方向で クイック ビュー パネルを最小化するには、[ クイック ビューの折りたたみ ] ボタンをクリックするか、 Esc キーを押します。

クイック ビューの最小化

修正: [ソース] ツールと [ネットワーク] ツールでの検索がフォーカス モードで想定どおりに動作するようになりました

以前のバージョンの Microsoft Edge では、フォーカス モードの実験では、ネットワーク ツールの検索機能、[ソース] ツールのすべてのファイルの検索機能が適切に表示されませんでした。 Microsoft Edge 105 では、これらの問題が修正されました。

[検索] アイコンを使用して ネットワーク ツールで 検索 できるようになりました。

ネットワーク検索

[ソース] ツールのすべてのファイルを検索するには、[ページ] セクションで上部のウィンドウまたは任意のドメインを右クリックし、[すべてのファイルで検索] を選択します。

ネットワーク検索すべて

関連項目:

イシュー ツールの信頼性の向上

以前のバージョンの Microsoft Edge では、 問題ツールに 問題が表示されないバグが発生していました。 このバグは、Microsoft Edge 105 で修正されました。

関連項目:

Chromium プロジェクトからのお知らせ

Microsoft Edge 105 には、Chromium プロジェクトからの次の更新プログラムも含まれています。