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

Jecelyn Yeen

預覽功能：新版錄音工具面板

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

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

舉例來說，您可以使用這個咖啡訂餐示範應用程式錄製咖啡結帳程序。新增咖啡並填寫付款資料後，您可以結束記錄、重播程序，或是按一下「評估成效」按鈕，評估「成效」面板中的使用者流程。

前往「錄音工具」面板說明文件，透過逐步教學課程瞭解更多資訊！

「錄音工具」面板是預先發布版功能，我們的團隊仍在積極改善這項功能，我們也想聽聽你的意見回饋，以便進一步改善這項功能。

錄音工具面板

Chromium 問題：1257499

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

啟用裝置工具列後，裝置清單現在會加入更多新型裝置。選取裝置即可模擬其尺寸。

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

Chromium 問題：1223525

自動完成功能搭配 HTML 編輯

「以 HTML 形式編輯」使用者介面現在支援自動完成和語法醒目顯示功能。在「Elements」面板中，在元素上按一下滑鼠右鍵，然後選取「Edit as HTML」。嘗試輸入 DOM 屬性 (例如 id、aria)，自動完成功能應可協助您找到所需的屬性名稱。

自動完成功能搭配 HTML 編輯

Chromium 問題：1215072

改善程式碼偵錯體驗

控制台的輸出錯誤現在會納入資料欄編號。以壓縮的 JavaScript 而言，更容易存取資料欄號碼是偵錯的關鍵。

輸出錯誤中的欄號

Chromium 問題：1073064

[實驗功能] 將開發人員工具設定同步到所有裝置

現在，當您開啟 Chrome 設定檔同步功能時，開發人員工具設定會在所有裝置上保持同步。如要變更開發人員工具同步處理設定，請依序點選「設定」>同步處理 >啟用設定同步功能。

開發人員工具同步處理設定

這項新設定方便您跨裝置使用。舉例來說，系統會自動同步處理下列外觀設定，因此您在所有裝置上都能享有一致的體驗，不必重新定義相同的設定。如要進一步瞭解同步處理功能，請參閱開發人員工具自訂功能。

外觀設定

這項功能目前還在實驗階段，相關團隊仍在積極開發中。如果你有任何意見，請按這裡與我們聯絡。

Chromium 問題：1245541

下載預覽頻道

建議您使用 Chrome Canary、Dev 或 Beta 版做為預設的開發瀏覽器。透過這些預覽版本，您可以存取開發人員工具中的最新功能、測試最先進的網路平台 API，以及找出網站的問題，以免使用者發現問題。

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

請使用下列選項，討論貼文中的新功能和異動，或與開發人員工具相關的其他事項。

  • 歡迎透過 crbug.com 提出建議或意見。
  • 使用「更多選項」更多 > 回報開發人員工具問題說明 >在開發人員工具中回報開發人員工具問題。
  • 前往 @ChromeDevTools 張貼 Tweet。
  • 歡迎在「開發人員工具」推出「最新消息」YouTube 影片或「開發人員工具秘訣」YouTube 影片留言。

開發人員工具新功能

「開發人員工具新功能」系列中的所有文章清單。