开发者工具中的新功能 (Chrome 107)

Jecelyn Yeen

在 DevTools 中自定义键盘快捷键

现在，您可以在开发者工具中为喜爱的命令自定义键盘快捷键。

依次前往设置 > 快捷键，将鼠标悬停在某个命令上，然后点击修改按钮（铅笔图标）以自定义键盘快捷键。您还可以创建和弦（也称为多按键快捷键）。

在 DevTools 中自定义键盘快捷键。

Chromium 问题：1335274、174309

使用键盘快捷键切换浅色主题和深色主题

配置键盘快捷键，以便轻松切换浅色主题和深色主题。默认情况下，此操作不会映射到任何键盘快捷键。

使用键盘快捷键切换浅色主题和深色主题。

Chromium 问题：1280398、1226363

在内存检查器中突出显示 C/C++ 对象

内存检查器会突出显示 C/C++ 内存对象的所有字节。

在周围的 WebAssembly 内存中识别对象的字节是一项难题。您必须知道对象的大小，并从对象的开头开始统计字节数。

借助此功能，您可以将它们与周围内存区分开来。如需详细了解这些变更，请参阅扩展 Memory Inspector 以进行 C/C++ 调试。

在内存检查器中突出显示 C/C++ 对象。

Chromium 问题：1336568

支持 HAR 导入的完整发起者信息

现在，HAR 导入功能支持完整的发起者信息。以前，网络面板在导入期间仅显示部分发起者信息。

发起者信息有助于开发者跟踪网络请求的来源并识别网络相关问题。

支持 HAR 导入的完整发起者信息。

Chromium 问题：1343185

按 Enter 后开始 DOM 搜索

现在，您可以停用即输即搜设置，以便在按 Enter 键后始终启动 DOM 搜索。

在元素面板中，使用 Ctrl 或 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 功能、测试尖端的 Web 平台 API，并帮助您在用户发现问题之前发现网站上的问题！

与 Chrome DevTools 团队联系

您可以使用以下选项讨论与 DevTools 相关的新功能、更新或任何其他内容。

开发者工具的新变化

DevTools 新变化系列中涵盖的所有内容的列表。