DevTools の新機能 (Microsoft Edge 110)

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 110 の新機能

ビデオのサムネイル画像

メモリ ツールでのヒープ スナップショットの取得が高速になりました

以前のバージョンの Microsoft Edge では、 メモリ ツールで (1 GB を超える) 大きなヒープ スナップショットを生成するには、Web サイトまたはアプリのサイズとメモリに格納された要素の数に応じて、2 ~ 15 分かかる場合があります。

Microsoft Edge 110 では、 メモリ ツールはヒープ スナップショットの取得時に 70% から 86% 高速になりました。 ヒープ スナップショットのサイズを大きくすると、速度が最大に向上します。 ヒープ スナップショットの取得がはるかに高速であることに気付いた場合は、フィードバックをお寄せください [フィードバック] メモリ ツールでのヒープ スナップショットの作成が高速になりました #131

メモリ ツールでヒープ スナップショットを作成する

関連項目:

フォーカス モードでより簡単にアクティビティ バーとクイック ビューの間でツールを移動する

Microsoft Edge 110 には、DevTools のフォーカス モードのさまざまな機能強化が含まれています。 次の変更により、 アクティビティ バークイック ビュー パネルを簡単にカスタマイズして、現在関心のあるツールのみを表示できます。

ツールを移動すると、右クリック メニューに移動先ツール バーの現在の配置が表示されます

クイック ビュー パネルとアクティビティ バーの間でツールを移動するための右クリック メニュー コマンドが、次のような目的のツール バーの配置を示すようになりました。

  • 下のクイック ビューに移動する
  • サイド クイック ビューに移動する
  • 上部のアクティビティ バーに移動する
  • 左側のアクティビティ バーに移動する

[下のクイック ビューに移動] を表示する右クリック メニュー

ツール バーのツール のタブに右クリック メニューが表示されなくなりました

アクティビティ バークイック ビュー ツール バーの間でツールを移動するための右クリック メニューが、ツール バーのツール名を隠さなくなりました。

たとえば、クイック ビュー ツール バーでツールのタブを右クリックすると、[ネットワーク条件] ツール名が表示されたままになります。

クイック ビューの右クリック メニュー

別の例として、アクティビティ バーでツールのタブを右クリックすると、[ネットワーク] ツール名が表示されたままになります。

アクティビティ バーの右クリック メニュー

フォーカスは、ツール間を移動するときにアクティビティ バーまたはクイック ビューに保持されます

キーボード ショートカットと支援技術のユーザーの場合、現在選択されているツールを 1 つのツール バーから別のツール バーに移動するとき、またはツール バーからツールを削除するときに、 アクティビティ バー または クイック ビュー ツール バーにフォーカスが保持されます。

たとえば、ネットワーク ツールがクイック ビュー ツール バーに移動され、クイック ビュー ツール バーの [ネットワーク] タブを右クリックするとします。

クイック ビューでネットワーク ツールを右クリックする

その後、[ クイック ビューから削除] を選択した場合は、 クイック ビュー ツール バーにフォーカスが移動し、[ ネットワーク条件 ] ツールに移動します。これはクイック ビュー ツール バーの次のツールです。

フォーカスはクイック ビュー ツール バーに留り、クイック ビュー ツール バーの別のツールに移動します

テーマのアクセシビリティの向上、場所のカスタマイズ、その他のツール ボタン

次のアクセシビリティの問題が修正され、スクリーン リーダーやキーボード ショートカットなどの支援技術を DevTools で使用する方が簡単になりました。

[その他のツール] メニューが展開されたときにスクリーン リーダーが正しく報告する

以前のバージョンの Microsoft Edge では、[その他のツール] メニューが実際に展開されたときに、[その他のツール (プラス記号)] ボタンが折りたたまれたことがスクリーン リーダーから報告されていました。 Microsoft Edge 110 では、この問題は修正されました。

[ その他のツール ] (プラス記号アイコン) メニューが展開されたときに、スクリーン リーダーが正しく報告されるようになりました。

フォーカス モードの [その他のツール] メニュー

キーボードを使用してドックの場所とアクティビティ バーの場所を変更する

以前のバージョンの Microsoft Edge では、フォーカス モードでは、キーボードを使用して Dock の場所 または アクティビティ バーの場所 を変更できませんでした。 Microsoft Edge 110 では、この問題は修正されました。

フォーカス モードでは、方向キーを使用して、[DevTools のカスタマイズと制御] (省略記号アイコン) メニューから Dock の場所とアクティビティ バーの場所を変更できるようになりました。

方向キーを押してフォーカス モードで Dock の場所を変更する

スクリーン リーダーは、テーマをスクロールするときに現在選択されているテーマを読み上げる

以前のバージョンの Microsoft Edge では、DevTools のテーマの一覧をスクロールしたときに、スクリーン リーダーはテーマが選択されているかどうかを読み上げませんでした。 Microsoft Edge 110 では、この問題は修正されました。

スクリーン リーダーは、[ DevTools のカスタマイズと制御 ] (省略記号アイコン) メニューでテーマ間を移動するときに現在選択されているテーマを読み上げるようになりました。

フォーカス モードでのテーマ間の移動

関連項目:

ネットワーク、コンソール、問題、ソース の各ツールで、コントラスト テーマのサポートが強化されました

Microsoft Edge 110 の DevTools では、Windows コントラスト テーマのサポートが向上しました。 ネットワークコンソールイシューソースの各ツールがすべて改善され、コントラスト テーマでツールが正しくレンダリングされるようになりました。

問題ツールでは、Windows で砂漠のコントラスト テーマが適用され、特定の問題に焦点を当てると、問題の詳細が背景に表示され、テキストが読みにくくなりました。 Microsoft Edge 110 では、単色の背景ではなくアウトラインを使用して、これを修正しました。

砂漠のコントラスト テーマが適用されたイシュー ツール

ネットワーク ツールでは、Windows でデザート コントラスト テーマが適用され、特定の要求を選択すると、要求のテキストとアイコンが見えにくくなりました。 Microsoft Edge 110 では、次の問題が修正されました。

砂漠のコントラスト テーマが適用されたネットワーク ツール

関連項目:

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

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