开发者工具的新变化 - Chrome 140

Sofia Emelianova
Sofia Emelianova
GitHub

使用 Gemini 调试更多分析洞见

在效果 > 数据洞见中，您现在可以点击借助 AI 进行调试（之前为向 AI 提问），在 AI 辅助面板中与 Gemini 聊天并进行调试，从而获得更多效果分析：

  • 改进图片传送
  • 旧版 JavaScript
  • 重复的 JavaScript
  • 现代 HTTP

添加“使用 AI 进行调试”按钮之前和之后，可获取更多效果数据分析。

在“网络状况”中模拟“Save-Data”标头

在网络状况面板中，您现在可以模拟 Save-Data 请求标头的行为。此标头是一种网络客户端提示，用于指示客户端对减少数据使用量的偏好。您也可以通过 navigator.connection.saveData API 使用该功能。

添加“Save-Data”请求标头模拟功能之前和之后“网络状况”的对比。

Chromium 问题：40668980。

在 CSS 属性提示中查看基准状态

在元素 > 样式中，当您将鼠标悬停在任何 CSS 属性上时，现在可以在该属性的定义下方看到其在主要浏览器中的可用性，具体取决于其 Baseline 状态。

在 CSS 属性工具提示中添加 Baseline 状态之前和之后。

Chromium 问题：417749762。

替换用户代理客户端提示中的设备规格

在网络状况 > 用户代理客户端提示下拉菜单中，您现在可以选择替换设备规格，具体来说，就是 Sec-CH-UA-Form-Factors 请求标头的值。

添加了用于替换用户代理客户端提示的设备规格选项之前和之后。

Chromium 问题：422218341。

Lighthouse 12.8.0

Lighthouse 面板现在运行的是 Lighthouse 12.8.0。

在此版本中，Lighthouse 最值得关注的新增功能是添加了一份新报告：使用 Trusted Types 缓解基于 DOM 的 XSS 攻击。

另请参阅完整的变更列表。

如需了解有关在开发者工具中使用 Lighthouse 面板的基础知识，请参阅 Lighthouse：优化网站速度。

Chromium 问题：40543651。

其他亮点

以下是此版本中的一些重要修复和改进：

  • AI 辅助功能：
    • 现在，当您在设置中停用相应的 AI 功能时，系统会清除聊天记录。
    • 无障碍功能：屏幕阅读器现在会在答案开始流式传输时提前播报上下文标题和“正在加载答案”，并在答案完成时播报“答案已准备就绪”。
  • 元素：
    • “样式”标签页现在可以评估 sibling-index()、sibling-count() 和 env() CSS 函数（crbug.com/417128001、crbug.com/40196710）。
    • 添加了对 ::view-transition-group-children 伪元素的支持 (crbug.com/425901164)。
    • 添加了对 <summary> 元素中有关互动内容的无障碍功能问题的支持 (crbug.com/427172874)。
    • 现在，您可以在计算出的样式属性标签页中前往样式中的展开属性 (crbug.com/41486012)。
    • 缓动、颜色编辑器：您现在可以使用键盘与动画过渡的贝塞尔曲线色样和颜色色样进行互动 (crbug.com/401213421)。
  • 网络：HAR 文件导入现在还包括请求和响应 Cookie (crbug.com/432995868)。
  • 设备模式：将 Apple 设备的用户代理更新为最新的 Safari 18.5。

下载预览渠道

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

与 Chrome 开发者工具团队联系

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

开发者工具的新变化

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