開發人員工具的新功能 (Chrome 147)

發布日期:2026 年 4 月 7 日

Chrome 147 推出 AI 輔助的自動內容選取功能、將程式碼建議升級為完整程式碼自動完成功能、採用新版裝置模式工具列、自動解碼壓縮的網路主體,以及其他多項強化功能。

在 AI 輔助功能中自動選取脈絡

更新後的 AI 輔助面板開始畫面。

使用者最希望 AI 輔助功能提供更多開放式問題。現在,您可以使用新的情境選取代理程式提問,不必事先選取情境,例如:

  • 「這個網頁上最慢的網路要求是什麼?」先前您必須選取特定網路要求,因此無法執行這項操作。
  • 「網頁上有哪些效能問題?」開發人員工具現在會自動使用所選設定記錄追蹤記錄,以回答這個問題。
  • 「如何使用動畫面板?」或「開發人員工具中的高對比設定在哪裡?」,直接提供開發人員工具相關協助。

為配合這項異動,AI 輔助功能現在也會自動切換情境。 如果對話空白,系統會根據您的動作智慧更新背景資訊;對話開始後,系統會尊重您的手動選取項目。

代理程式專用的開發人員工具

Chrome 開發人員工具 MCP 伺服器和 CLI 已更新至 0.21.0 版, 大幅改善多代理工作流程、透過 Lighthouse 提供新的稽核功能, 並強化技能組合。

自上次更新以來新增的主要功能包括:

  • 整合式 Lighthouse 稽核:現在你可以直接透過 MCP 執行 Lighthouse 稽核,在代理功能工作流程中自動檢查成效和品質。
  • 記憶體洩漏偵測技能:新增一項技能,可使用 take_memory_snapshot 工具偵測記憶體洩漏。
  • 無障礙功能技能改善:無障礙功能偵錯技能經過改良,可更有效地運用 Lighthouse,並提供更可靠的輸出內容。
  • 一般使用技能:專門介紹如何使用 Chrome 開發人員工具 MCP 伺服器或 CLI,以及如何排解安裝問題,協助代理程式充分運用代理程式專用的開發人員工具。
  • 支援多代理工作流程:導入 pageId 路由後,多個代理可以並行精確鎖定特定瀏覽器網頁並與之互動。

如要開始使用這些功能,請參閱 GitHub 存放區的詳細版本資訊。

程式碼生成

我們在 Chrome 142 中推出了控制台和來源面板的 Gemini 程式碼建議。 Chrome 147 將這項功能升級為完整程式碼生成功能。

如要生成程式碼,請輸入自然語言註解來描述所需邏輯 (例如 // Loop to check all img elements for valid alt attributes),然後按下 Cmd+I 鍵 (Mac) 或 Ctrl+I 鍵 (Windows/Linux) 開始生成。

重新整理裝置模式工具列

我們更新了「裝置模式」工具列,提供更一致且簡化的體驗:

  • 標準化控制項:裝置選取、縮放比例和裝置像素比例 (DPR) 現在使用標準的開發人員工具 UI 元件,提升可用性。
  • 簡化縮放功能:縮放選單現在更簡潔,「配合視窗大小調整縮放比例」選項已直接整合至百分比清單。「自動調整縮放比例」已移至專屬的工具列按鈕。
  • 支援螢幕方向鎖定:開發人員工具現在會在裝置模擬中處理 screen.orientation.lock() API。如果網頁鎖定螢幕方向,模擬裝置會自動旋轉,配合鎖定的方向,且鎖定啟用時,手動旋轉按鈕會停用。

Chromium 問題:40807290

已解碼的壓縮主體

現在可以更輕鬆地診斷壓縮資源的問題。先前,如果 HTTP 要求使用 Content-Encoding: gzipdeflate「網路」面板中的「酬載」檢視畫面會顯示亂碼二進位資料,而非解碼內容。

在 Chrome 147 中,開發人員工具會自動解碼這些壓縮主體,並直接在「Payload」(酬載) 下方顯示可讀取的內容。

此外,要求清單現在會顯示「傳輸大小」資訊,讓您更清楚瞭解透過網路傳輸的數據用量,AI 助理也會利用這項詳細資料,更妥善地選取要求。

Chromium 問題:356158096

樣式的規則運算式篩選器

「樣式」面板中的新規則運算式篩選器。

您現在可以在「樣式」、「已計算」和「屬性」面板的篩選器列中使用規則運算式。按一下新的「規則運算式」切換按鈕 (.*) 即可啟用。然後輸入 padding|border,即可醒目顯示所有 paddingborder 屬性。

Chromium 問題:40706727

推測載入項目強化功能

應用程式 >「預測載入」面板的新功能,可讓您更輕鬆地偵錯預先載入:

  • 文字篩選:現在可以使用任意文字或鍵入篩選條件 (例如 url:action:status:),篩選規則和嘗試清單,並支援多個條件之間的 AND 邏輯。
  • 清除按鈕:新的清除按鈕可重設預先載入模型,並清除顯示的規則和嘗試。
  • HTTP 狀態碼:如果預先擷取失敗,開發人員工具現在會在狀態欄和詳細資料窗格中顯示實際的 HTTP 狀態碼 (例如 404),而不是一般失敗訊息。

Chromium 問題:47952424640926909

其他

這個版本的重要修正項目和功能包括:

  • 控制台:如果錯誤的所有內嵌堆疊框架都已加入忽略清單,但呼叫堆疊包含未忽略的框架,現在會顯示切換按鈕,協助您專注於可執行的程式碼,同時隱藏雜亂的程式庫追蹤記錄 (379788109)。
  • 效能:側欄狀態 (開啟/關閉) 現在會保留;如果關閉側欄,後續錄製的內容都會維持關閉狀態 (437340219)。
  • 設定:現在切換特定實驗性設定時,開發人員工具會透過資訊列提示您重新啟動瀏覽器。
  • 物件檢查:物件檢視畫面中的新「顯示全部」右鍵選單選項,可讓您切換空值 (nullundefined) 屬性的顯示設定 (41187256)。
  • 元素:「廣告」提示不再僅限於 iframe,現在可顯示後端標記為廣告相關的任意元素 (485493202)。
  • 指令節點:處理指令節點 (例如 <?xml-stylesheet ... ?>) 現在會顯示在 DOM 樹狀結構中,且可編輯 (484891675)

無障礙設定

這個版本進行了多項無障礙功能改良:

  • 成效:成效指標資訊卡中的標題說明按鈕現在一律會顯示,且可透過鍵盤存取,不會只在滑鼠懸停時顯示 (487613506)。
  • 來源:現在可以使用空格鍵勾選或取消勾選事件監聽器中斷點 (478890182)。
  • 設定:現在可使用 Home 和 End 鍵,前往快速鍵清單的第一個和最後一個項目 (481747256)。
  • Lighthouse:改善類別群組核取方塊的螢幕閱讀器播報內容 (477643909)。