Chrome 142 版開發人員工具的新功能

Matthias Rohmer

Gemini 提供的程式碼建議

您現在可以在「控制台」和「來源」面板中，取得 AI 生成的自動完成建議。

「控制台」和「來源」面板中的程式碼建議功能

如要啟用這項功能，請依序前往「設定」 >「AI Innovations」，然後切換「Code suggestions」。

開發人員工具 MCP 伺服器強化功能

自 v0.2.1 版推出 DevTools MCP 伺服器的公開搶先版以來，我們已根據社群的貢獻進行多項改良，並發布 v0.9.0 版。

  • Node.js 支援範圍已擴大至 Node.js 20。
  • 網路要求和控制台訊息可以分頁顯示，以節省權杖，並根據要求類型 (例如指令碼、樣式表、圖片) 和訊息類型 (記錄、警告、錯誤) 進行篩選。
  • 螢幕截圖可以輸出至特定路徑，並採用各種格式。
  • 可設定的工具類別可讓您整理要公開的功能，減少不必要的干擾。
  • 您現在可以將啟動引數傳遞至 MCP 伺服器使用的 Chrome 執行個體。

如需完整的異動和錯誤修正清單，請參閱 GitHub 上的公開異動記錄，並參閱這篇公告網誌文章，進一步瞭解 DevTools MCP 伺服器。

快速存取 AI 輔助功能

開發人員工具現在包含更多可開啟 AI 輔助的連結。「詢問 AI」內容選單項目已重新命名為「使用 AI 偵錯」，並根據情境新增 AI 可協助您執行的直接動作。

開發人員工具右上角新增了按鈕，方便您從開發人員工具的任何位置開啟 AI 輔助功能。

開發人員工具中 AI 輔助功能的新進入點

使用 Gemini 偵錯完整的效能追蹤記錄

在「效能」面板中記錄追蹤記錄後，您現在可以與 Gemini 討論完整的追蹤記錄、相關的效能洞察資料和欄位資料，不必預先選取特定背景資訊，所有討論內容都會在同一個對話中進行。這樣您就能更全面地瞭解效能問題，再深入探究。

在 Gemini 的協助下找出潛在問題後，您可以順暢地選取更具體的內容項目 (例如追蹤事件或效能洞察)，以便仔細檢查並繼續進行同一項對話。

同樣地，您現在可以與 Gemini 對話，討論「成效」>「洞察」中的所有洞察資料。

切換導覽匣方向

現在也可以將抽屜移到側邊。 這樣一來，面板就會並排顯示，而非堆疊。在主要分頁列中，於面板名稱上按一下滑鼠右鍵，然後選取「移至抽屜」，即可將所選面板移至抽屜。

依序選取「⋮」 >「更多工具」，即可在抽屜中新增其他面板。

導覽匣中的新切換鈕，可變更方向

Google Developer Program

Google 開發人員計畫現已整合至開發人員工具，提供個人資料管理直接連結，以及可獲得的新徽章。

開發人員工具設定中的 Google 開發人員設定檔控制選項

徽章是選用功能。如要啟用徽章，請依序前往「設定」 >「偏好設定」 >「帳戶」，然後切換「獲得徽章」。

其他重點

這個版本包含許多重要修正和改良項目，以下列舉幾項：

  • 「應用程式」面板現在支援檢查所有工作站類型的儲存空間，包括 Service Worker、Shared Worker 和 Dedicated Worker。
  • :target-current 現在會顯示在「Styles」(樣式) 面板中。
  • 「網路」面板現在可以根據新的 Is ad-related 布林值篩選要求。

下載預覽版頻道

建議使用 Chrome Canary、開發人員版或 Beta 版做為預設開發瀏覽器。透過這些搶先體驗管道，您可以存取最新的開發人員工具功能、測試最先進的網頁平台 API，並在使用者發現問題前找出網站上的問題！

與 Chrome 開發人員工具團隊聯絡

如要討論開發人員工具的新功能、更新或其他相關事項，請使用下列選項。

開發人員工具新功能

「開發人員工具最新消息」系列涵蓋的所有主題清單。