开发者工具的新变化 (Chrome 97)

Jecelyn Yeen

预览版功能：新的“Recorder”面板

您可以使用新的 Recorder 面板录制、重放和衡量用户流。

打开 Recorder 面板。按照屏幕上的说明开始新录制。

例如，您可以使用此咖啡订购演示应用记录咖啡结账流程。添加咖啡并填写付款详情后，您可以结束录制、重放流程，也可以点击 Measure performance 按钮，在性能面板中衡量用户流。

前往记录器面板文档，通过分步教程了解详情！

录制器面板是一项预览版功能。我们的团队仍在积极完善此功能，期待您的反馈，以便进一步改进。

Chromium 问题：1257499

在设备模式下刷新设备列表

启用设备工具栏后，设备列表中现在会添加更多新式设备。选择一个设备以模拟其尺寸。

Chromium 问题：1223525

通过“以 HTML 格式修改”功能自动补全

以 HTML 格式修改界面现在支持自动填充和语法突出显示。在元素面板中，右键点击某个元素，然后选择以 HTML 形式修改。尝试输入 DOM 属性（例如 id、aria），自动补全功能应有助于您找到所需的属性名称。

Chromium 问题：1215072

改进了代码调试体验

现在，控制台中的输出错误会包含列号。轻松访问列号对于调试（尤其是使用精简的 JavaScript）至关重要。

Chromium 问题：1073064

[实验性] 在设备之间同步开发者工具设置

现在，当您启用 Chrome 个人资料同步功能时，DevTools 设置默认会在设备之间保持同步。您可以通过设置 > 同步 > 启用设置同步来更改开发者工具同步设置。

借助这项新设置，您可以更轻松地在不同设备上工作。例如，以下外观设置会进行同步，以便您在各个设备上获得一致的体验，而无需再次重新定义相同的设置。如需详细了解同步功能，请参阅开发者工具自定义。

此功能目前处于实验阶段，团队仍在积极开发。如果您有任何反馈，请点击此处与我们分享。

Chromium 问题：1245541

下载预览渠道

不妨考虑使用 Chrome Canary 版、开发者版或 Beta 版作为默认开发浏览器。通过这些预览渠道，您可以访问最新的 DevTools 功能，测试前沿的 Web 平台 API，并帮助您在用户之前发现网站上的问题！

与 Chrome 开发者工具团队联系

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

• 请前往 crbug.com 向我们提交反馈和功能请求。
• 在开发者工具中，依次点击 more_vert 更多选项 > 帮助 > 报告 DevTools 问题，报告开发者工具问题。
• 在 Twitter 上向 @ChromeDevTools 发送推文。
• 在 DevTools 新变化 YouTube 视频或 DevTools 提示 YouTube 视频中发表评论。

开发者工具的新变化

开发者工具的新变化系列中涵盖的所有内容的列表。