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

Jecelyn Yeen

在開發人員工具中自訂鍵盤快速鍵

您現在可以在開發人員工具中，為喜愛的指令自訂鍵盤快速鍵。

依序前往「設定」 >「快速鍵」，將滑鼠游標懸停在指令上，然後點選「編輯」按鈕 (筆圖示)，自訂鍵盤快速鍵。你也可以建立和弦 (又稱多鍵按下快速鍵)。

在 DevTools 中自訂鍵盤快速鍵。

Chromium 問題：1335274、174309

使用鍵盤快速鍵切換淺色和深色主題

設定鍵盤快速鍵，方便切換淺色和深色主題。根據預設，這項動作不會對應任何鍵盤快速鍵。

使用鍵盤快速鍵切換淺色和深色主題。

Chromium 問題：1280398、1226363

在記憶體檢查工具中醒目顯示 C/C++ 物件

記憶體檢查器會醒目顯示 C/C++ 記憶體物件的所有位元組。

在周圍的 WebAssembly 記憶體中辨識物件的位元組是個難題。您必須知道物件的大小，並從物件的開頭開始計算位元組。

這項功能可協助您將記憶體區分開來。如要進一步瞭解異動內容，請參閱「擴充記憶體檢查器，用於 C/C++ 偵錯」。

在記憶體檢查工具中標示 C/C++ 物件。

Chromium 問題：1336568

支援 HAR 匯入作業的完整啟動程序資訊

您現在可以使用完整的發起者資訊來匯入 HAR。先前，Network 面板只會在匯入期間顯示部分啟動程序資訊。

啟動者資訊可協助開發人員追蹤網路要求的來源，並找出網路相關問題。

支援 HAR 匯入的完整啟動程序資訊。

Chromium 問題：1343185

按下 Enter 後開始 DOM 搜尋

您現在可以停用「即時搜尋」設定，讓系統在您按下 Enter 鍵後一律啟動 DOM 搜尋。

在「Elements」面板中，按住 Control 或 Command + F 鍵，切換搜尋列。在搜尋文字方塊中輸入查詢時，DOM 樹狀結構會跳至第一個相符的元素，並預設會加以醒目顯示。

對於使用者 (尤其是經常使用長篇幅搜尋查詢的測試人員) 而言，這項行為並不理想。當您輸入長的搜尋查詢 (例如 //div[@id="example"]) 時，DOM 樹狀結構可能會跳躍多次，這會造成不必要的動作。

DOM 搜尋。

依序前往「設定」 >「偏好設定」，然後停用「搜尋內容」。這項變更後，系統會在你按下 Enter 鍵後才開始搜尋。

即時搜尋設定。

Chromium 問題：1344526

針對 align-content CSS flexbox 屬性顯示 start 和 end 圖示

在「Styles」窗格中，使用 display: flex 或 display: inline-flex 編輯 CSS 類別中的 align-content 屬性。start 和 end 會在自動完成下拉式選單中顯示圖示。

align-content Flexbox 屬性。

Chromium 問題：1139945

其他精選內容

  • 在 主控台側欄中顯示正確的訊息數量。先前清除控制台訊息時，計數不會重新整理。(1343311)。

下載預覽管道

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

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

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

開發人員工具的新功能

DevTools 新功能系列文章中涵蓋的所有內容清單。