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

發布日期:2026 年 6 月 2 日

Chrome 149 大幅升級了 AI 輔助功能,在「應用程式」面板中導入實驗性 WebMCP 偵錯工具,並將程式碼自動完成支援範圍擴展至 CSS。

服務專員適用的開發人員工具

代理程式適用的 Chrome 開發人員工具 MCP 伺服器和 CLI 現已正式推出穩定版!如要瞭解詳情,請參閱這篇公告

v1.1.1 版之前新增的主要功能和工具包括:

  • 自訂第三方網頁公開工具:網頁現在可以透過 JavaScript 定義自訂偵錯工具,供代理程式的開發人員工具探索及呼叫。
  • WebMCP 偵錯:代理的開發人員工具現在可以列出及執行 WebMCP 工具
  • 自訂 HTTP 標頭模擬:在模擬工具中新增對 HTTP 標頭的支援 (例如驗證權杖或自訂 User-Agent)。

第三方工具和 WebMCP 偵錯功能仍處於實驗階段,預設尚未啟用。如要瞭解如何使用這些工具,請參閱工具參考資料。這些功能準備好用於正式版後,我們會在 developer.chrome.com 提供更多說明文件。

如要瞭解代理程式開發人員工具的最新動態並做出貢獻,請前往 GitHub 存放區。如要開始使用,請參閱說明文件,或觀看 Google I/O 大會影片「Supercharge your AI coding workflow with Chrome 開發人員工具 for agents」,全面瞭解代理程式開發人員工具。

AI 輔助

「AI 輔助」面板已大幅更新使用者介面,並推出新工具,可提升對話體驗及提供更深入的網頁洞察資料:

  • 代理程式逐步解說:AI 輔助功能現在會直接在聊天介面中算繪小工具,而不是純文字 Markdown。這些小工具涵蓋核心網頁指標和相關洞察、最大內容繪製 (LCP) 元素、LCP 細目、由下而上的執行緒活動等。小工具內的「顯示」連結會將您帶往開發人員工具中這項資訊的來源。
  • 複製到程式碼編寫代理程式:對話結束時會顯示專用按鈕,方便您複製對話內容 (可選擇摘要或逐字稿),然後貼到所選的程式碼編寫代理程式。
  • 升級功能:AI 輔助功能現在可以存取 Lighthouse 和相關洞察資料,全面分析網頁並提供具體建議。
  • 更完善的回覆:AI 輔助功能採用 Gemini 3 模型,並經過改良,可提供更簡潔實用的回覆。
  • 更完善的瀏覽體驗:現在可以使用向上鍵向下鍵瀏覽先前的對話提示,快速且直覺地修正或重新執行先前的查詢。
AI 輔助功能,提示為「如何提升這個網頁的效能?」 在 Astro.js 示範網站 DevTools Times 上, 顯示代理程式逐步操作說明、小工具,以及複製到 Antigravity 編碼代理程式。

歡迎在專屬的意見回饋錯誤中留言,將你的想法告訴我們。為支援「複製到程式碼助理」功能,我們將在 Chrome 152 中,停止支援透過 AI 輔助自動修正樣式

WebMCP

這個版本在「應用程式」面板側邊欄中,導入實驗性 WebMCP 偵錯工具。WebMCP (Web Model Context Protocol) 可讓網頁註冊工具,供造訪的 LLM 代理程式使用。如要進一步瞭解建議標準,請參閱說明文件

開發人員可透過新的偵錯工具執行下列操作:

  • 檢查用戶端工具及其結構定義。
  • 使用自訂參數手動執行工具。
  • 追蹤及篩選進行中或待處理的工具呼叫事件。
  • 監控執行狀態並檢查傳回的酬載。

WebMCP 是早期預先發布的網路標準提案。如要開始實驗,請在 chrome://flags 啟用 #devtools-webmcp-support#enable-webmcp-testing 標記。

開發人員工具應用程式面板中的全新 WebMCP 偵錯工具。
新版 WebMCP 偵錯工具檢查示範網站「L'Atelier」, 顯示過去的工具呼叫、可用工具和篩選器選項。

Chromium 問題:494516094

CSS 程式碼補全

「樣式」分頁現在提供 Gemini CSS 程式碼補全功能,並以支援「控制台」和「來源」面板為基礎。如要啟用程式碼建議,請前往「設定」>「AI 創新」>「程式碼建議」

這樣一來,您就能盡情嘗試更複雜的 CSS 屬性組合 (例如漸層或方塊陰影),不必記住確切的語法。您也可以運用多個相關屬性,快速建構格線和彈性版面配置。

「樣式」分頁底部的工具列會透過載入旋轉圖示顯示狀態。建議會隨著輸入內容更新或清除,確保 AI 生成的文字與手動編輯內容保持相關。

APCA 顏色對比度指南升級為穩定版

進階感知對比演算法 (APCA) 對比計算機已正式結束實驗階段,現在可做為標準偏好設定使用。APCA 會取代舊版 AAA/AA 對比度指南,採用現代感知對比度模型,針對現代螢幕和文字算繪進行最佳化。

您現在可以勾選「設定」>「偏好設定」>「元素」>「啟用 APCA 對比度規範」下方的核取方塊,啟用或停用 APCA 規範。

開發人員工具設定中的 APCA 演算法切換鈕,以及「樣式」分頁中生效的新演算法。
開發人員工具設定中的 APCA 演算法切換鈕,以及「樣式」分頁中生效的新演算法。

動態裝置模式使用者代理程式

先前,回應式裝置模式會使用硬式編碼的使用者代理程式字串 (Android 6.0;Nexus 5)。這導致現代網站功能降級或觸發相容性模式,因為回報的 OS 遭系統認定為超過十年。

我們已將硬式編碼的使用者代理程式,替換為根據當前日曆年自動更新的動態啟發式方法,確保開發人員工具一律回報合理的新型環境,無須手動維護。

其他產品亮點

這個版本包含多項小幅改善和錯誤修正:

  • 控制台:在控制台面板工具列中新增「全部收合 / 展開」切換按鈕,可一次快速展開或收合所有有效的控制台群組和堆疊追蹤記錄。(427657550)
  • 應用程式:應用程式中繼資料檢視畫面中的儲存空間值區欄位,已將靜態文字替換為可點選的超連結。點選值區連結後,系統會自動前往並醒目顯示「儲存空間值區」側邊面板中的特定值區。(435311130)
  • 應用程式:解決當機迴歸問題後,重新啟用 Service Worker 的完整儲存空間檢查支援功能。(406991275466134219)
  • 應用程式:新增支援功能,可在「預先載入」面板中檢查 form_submission 預先算繪事件。(346555939488078903)
  • 應用程式:實作裝置綁定工作階段憑證 (DBSC) 管理功能,讓開發人員可透過內容選單或按下 DeleteBackspace 鍵,清除或刪除有效工作階段。(471017387)
  • 元素:現在,代表「問題」面板中隱藏問題的 DOM 節點會醒目顯示,並根據問題篩選器動作動態更新 (顯示或消失)。(40272723)
  • 網路:伺服器推送事件 (SSE) 現在會完整序列化並納入 HAR 匯出內容,方便您儲存持續進行的即時事件串流擷取作業,並重新匯入開發人員工具。(494294071)
  • 效能:修正「即時指標」檢視畫面中的網站體驗核心指標追蹤功能,將追蹤作業嚴格限制在主要影格執行環境中,避免動態 iframe 變動重設指標。(494350655)
  • 效能:升級 web-vitals 至 v5.2.0,導入原生上游修正,解決 INP 監控期間的記憶體洩漏問題。(484342204)