DevTools の新機能（Chrome 119）

Sofia Emelianova
Sofia Emelianova
GitHub

[要素] > [@property] セクションを改善スタイル

編集可能な @property ルール

[要素] の対応するセクションで @property CSS ルールでルールを編集できるようになりました >[スタイル] ペイン。

プロパティ ルールを編集可能にする前と後。

Chromium の問題: 1471123。

無効な @property ルールに関する問題が報告される

[問題] タブで、@property ルールの無効な宣言に関する問題が報告されるようになりました。

[問題] タブで報告された宿泊施設ルールに問題がある。

Chromium の問題: 1473283。

エミュレートするデバイスのリストを更新しました

設定] をタップします。 [設定] >ブラウザとオペレーティング システムの平均使用量を反映するように、[デバイス] が更新されました。デバイスモードで、より多くの最新のデバイスをエミュレートできるようになりました。

デバイスリストの更新前と更新後。

Chromium の問題: 1479733。

ソースのスクリプトタグ内にインライン JSON をプリティ プリント

[Sources] パネルで、デバッグを容易にするため、<script> HTML タグでの pretty 形式のインライン JSON がサポートされるようになりました。

スクリプトタグ内の プリティ プリントするインライン JSON の前後。

Chromium の問題: 406900、1473875。

コンソールでの非公開フィールドの予測入力

コンソールでクラススコープ外でプライベート クラス フィールドを評価するときに、予測入力機能を使用できるようになりました。

クラススコープ外のプライベート クラス フィールドの予測入力をサポートする前と後。

Chromium の問題: 1483848、1381806。

Lighthouse 11.1.0

[Lighthouse] パネルで Lighthouse 11.1.0 が実行されるようになりました。変更点の一覧をご覧ください。

DevTools の [Lighthouse] パネルの基本的な使用方法については、Lighthouse: ウェブサイトの速度を最適化するをご覧ください。

Chromium の問題: 772558。

ユーザー補助機能の改善

スクリーン リーダーは次の読み上げを読み上げます。

  • コンソールの警告とエラー。
  • [コンソール] または [ソース] にコードを貼り付ける際の [Do you trust this code] ダイアログのテキスト。

また、[アプリケーション] パネルで、高コントラスト モードでのリンクのコントラストの問題を修正しました。

Chromium の問題: 1485257、1486643、1485263。

Web SQL のサポート終了

アプリケーション >Web SQL Database API のメンテナンス終了に伴い、Web SQL セクションは Chrome 123 で削除されます。このバージョンでは、今後の削除に関する警告をセクションに追加しました。

Web SQL の非推奨に関する警告。

詳しくは、Web SQL のサポート終了と削除をご覧ください。

Chromium の問題: 1485966

[アプリ] > でのスクリーンショットのアスペクト比の検証マニフェスト

アプリケーション >[マニフェスト] セクションで、同じフォーム ファクタ（wide または narrow）のウェブアプリのスクリーンショットのアスペクト比が同じかどうかがチェックされるようになりました。

同じフォーム ファクタのスクリーンショットのアスペクト比が正しくないことに関する警告。

詳しくは、プログレッシブ ウェブアプリをデバッグするとウェブアプリ マニフェストを追加するをご覧ください。

DevTools チームは、Alexey Rodionov に感謝します。この変更の実施と、以前のバージョンでのマニフェスト警告のその他の改善に感謝します。

Chromium の問題: 1476656

その他のハイライト

このリリースにおける注目すべき修正と改善は次のとおりです。

  • 要素: <ph type="x-smartling-placeholder">
      </ph>
    • アニメーションのタイミング関数見本が、展開可能な省略形のプロパティの下に記述された CSS プロパティに表示されません（1149182）。
    • contain-intrinsic-* の予測入力で、誤った単一の auto 値が入力されなくなりました。これは、auto <length>（1480415）であるはずであるためです。
    • 非推奨の無効な -webkit-* プロパティのサポートが削除されました（1086089、1030765）。
  • ブレークポイント: ブレークポイント タイプが変更されたときにブレークポイント編集ダイアログが消えるバグを修正しました（1485782）。
  • パフォーマンス: <ph type="x-smartling-placeholder">
      </ph>
    • パフォーマンスの記録中の色解析エラーが修正されました（1480205）。
    • タイミング トラックに LCP が表示されないバグを修正しました（1487136）。
  • ネットワーク: [Set cookies] 列に、ブロックされている Cookie を除く、設定された正しい数が表示されるようになりました（1486903）。
  • DevTools 拡張機能が、ブロックされていないホストへのナビゲーション後に読み込まれるようになりました（1476264）。
  • 拡張機能のスクリプト実行コンテキストが正しくないバグを修正しました（1275331）。

プレビュー チャンネルをダウンロードする

デフォルトの開発ブラウザとして Chrome の Canary、Dev、または Beta を使用することを検討してください。これらのプレビュー チャンネルを使用すると、DevTools の最新機能にアクセスしたり、最先端のウェブ プラットフォーム API をテストしたり、ユーザーに先駆けてサイトの問題を検出したりできます。

Chrome DevTools チームへのお問い合わせ

以下のオプションを使用して、投稿の新機能や変更点、または DevTools に関連するその他のことについて話し合います。

  • ご提案やフィードバックは、crbug.com からお送りください。
  • DevTools の問題を報告するには、その他のオプション（もっと見る） >ヘルプ >DevTools で DevTools の問題を報告します。
  • @ChromeDevTools でツイートしてください。
  • DevTools の新機能に関する YouTube 動画または DevTools のヒントの YouTube 動画にコメントを残してください。

DevTools の新機能

「DevTools の新機能」シリーズで紹介されているすべてのリスト。