What's 開發人員工具的新功能 (Chrome 97)

Jecelyn Yeen

預先發布版功能：新的錄音工具面板

使用全新的「錄音工具」面板，記錄、重播及評估使用者流程。

開啟「錄音工具」面板。按照畫面上的指示開始錄製。

舉例來說，您可以使用這個咖啡訂購試用版應用程式，記錄咖啡結帳程序。加入咖啡並填寫付款詳細資料後，您可以結束錄製、重播流程，或是按一下「Measure performance」按鈕，在「Performance」面板中評估使用者流程。

如要進一步瞭解，請參閱錄音器面板的說明文件，並透過逐步教學課程學習相關知識！

「錄音機」面板為預先發布版功能，我們的團隊仍在積極開發這項功能，歡迎提供意見回饋，協助我們進一步改善。

Chromium 問題：1257499

在裝置模式中重新整理裝置清單

啟用裝置工具列後，裝置清單中會新增更多新型裝置。選取要模擬的裝置尺寸。

Chromium 問題：1223525

使用「以 HTML 編輯」功能時，自動完成功能

「Edit as HTML」UI 現已支援自動完成和語法醒目顯示功能。在「元素」面板中，按一下元素並選取「以 HTML 格式編輯」。請嘗試輸入 DOM 屬性 (例如 id、aria)，自動完成功能應可協助您找到所需的屬性名稱。

Chromium 問題：1215072

改善程式碼偵錯體驗

控制台中的輸出錯誤現在會包含欄號。對於偵錯作業而言，能夠輕鬆存取資料欄編號至關重要，尤其是在處理經過精簡的 JavaScript 時。

Chromium 問題：1073064

[實驗功能] 跨裝置同步開發人員工具設定

開啟 Chrome 設定檔同步功能後，開發人員工具設定會預設在裝置間同步。您可以依序點選「設定」 >「同步」 >「啟用設定同步功能」，變更 DevTools 同步設定。

這項新設定可讓你更輕鬆地在不同裝置上工作。舉例來說，系統會同步下列外觀設定，讓您在各裝置上享有一致的體驗，不必重新定義相同的設定。如要進一步瞭解同步功能，請參閱開發人員工具自訂設定。

這項功能目前仍在實驗階段，團隊仍在積極開發中。如有任何意見回饋，請按這裡與我們分享。

Chromium 問題：1245541

下載預覽管道

建議您將 Chrome Canary、開發人員版或Beta 版設為預設開發人員版瀏覽器。這些預覽管道可讓您存取最新的 DevTools 功能，測試最新的網路平台 API，並在使用者發現問題前，協助您找出網站的問題！

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

請使用下列選項討論新功能、更新或任何與開發人員工具相關的內容。

• 請前往 crbug.com 提交意見回饋和功能要求。
• 在開發人員工具中，依序按一下「more_vert」more_vert更多選項 >「Help」 >「Report a DevTools issue」，即可回報開發人員工具的問題。
• 在 Twitter 上傳送訊息給 @ChromeDevTools。
• 在 YouTube 影片「What's new in DevTools」或「DevTools 提示」YouTube 影片中留言。

開發人員工具的新功能

這份清單列出「DevTools 最新消息」系列文章中涵蓋的所有內容。