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

发布时间:2026 年 6 月 2 日

Chrome 149 对 AI 辅助功能进行了重大升级,在“应用”面板中引入了实验性 WebMCP 调试工具,并将代码补全支持范围扩展到了 CSS。

面向智能体的开发者工具

面向智能体的 Chrome 开发者工具的 MCP 服务器和 CLI 现已正式稳定版!点击此处阅读完整公告。

截至 v1.1.1 版本,添加的主要功能和新工具包括:

  • 自定义的面向网页的第三方工具:网页现在可以通过 JavaScript 定义自定义调试工具,供智能体通过开发者工具发现和调用。
  • WebMCP 调试:智能体专用 DevTools 现在可以列出并执行 WebMCP 工具
  • 自定义 HTTP 标头模拟:向模拟工具添加对 HTTP 标头(例如身份验证令牌或自定义 User-Agent)的支持。

第三方工具和 WebMCP 调试仍处于实验阶段,尚未默认启用。如需了解如何使用这些工具,请参阅工具参考文档。当这些功能可用于正式版时,我们会在 developer.chrome.com 上提供更多文档。

如需了解有关代理的开发者工具的最新动态并做出贡献,请访问 GitHub 代码库。您可以参阅我们的文档开始使用,也可以观看全面的 Google I/O 视频会议利用 Chrome 开发者工具为代理打造超强 AI 编码工作流程,快速了解相关信息。

AI 辅助

AI 辅助面板已进行重大界面更新,并新增了一些工具,以改善对话式体验并提供更深入的网页数据分析:

  • 智能体演练:AI 辅助功能现在可以直接在聊天界面中渲染 widget,而不是纯文本 Markdown。这些 widget 涵盖核心 Web 指标和相关数据洞见、LCP 元素、LCP 分解、自下而上的线程活动等。微件中的显示链接可将您带到开发者工具中相应信息的来源。
  • 复制到编码代理:对话现在以专用按钮结束,可将对话复制为提示(总结)或逐字逐句的对话,以便您将其粘贴到所选的编码代理中。
  • 升级后的功能:AI 辅助工具现在可以访问 Lighthouse 和相关数据分析,从而能够全面分析您的网页并提供有针对性的建议。
  • 更出色的回答:AI 辅助功能在后台使用 Gemini 3,并改进了前导语,可提供更简洁、更实用的回答。
  • 改进的导航功能:您现在可以使用向上键向下键浏览之前的对话提示,从而快速直观地优化或重新运行之前的查询。
AI 辅助功能,提示为“如何提升此网页的性能?” 在 Astro.js 演示网站 DevTools Times 上, 显示了代理演练、微件和“复制到 Antigravity 中的编码代理”。

欢迎通过评论专用反馈 bug,将您的想法告诉我们。为了支持“复制到编码智能体”,我们将从 Chrome 152 开始弃用通过 AI 辅助功能自动修复样式

WebMCP

此版本在应用面板边栏中引入了实验性 WebMCP 调试工具。WebMCP(Web Model Context Protocol)允许网页注册供访问 LLM 代理使用的工具。如需详细了解此提议的标准,请参阅我们的文档

借助新的调试工具,开发者可以:

  • 检查客户端工具及其架构。
  • 使用自定义参数手动运行工具执行。
  • 跟踪和过滤有效或待处理的工具调用事件。
  • 监控执行状态并检查返回载荷。

WebMCP 是一项处于早期预览版阶段的提议 Web 标准。在 chrome://flags 上启用 #devtools-webmcp-support#enable-webmcp-testing 标志即可开始实验。

开发者工具“应用”面板中的新 WebMCP 调试工具。
新的 WebMCP 调试工具正在检查演示网站 L'Atelier, 显示了之前的工具调用、可用工具和过滤选项。

Chromium 问题:494516094

CSS 代码补全

样式标签页现在支持使用 Gemini 进行 CSS 代码补全,这是在支持控制台和“来源”面板的基础上实现的。 在“设置”>“AI 创新功能”>“代码建议”中启用代码建议。

这有助于您尝试更复杂的 CSS 属性组合(例如渐变或框阴影),而无需记住其确切的语法。或者,您也可以快速构建网格和 flex 布局,并依赖多个相关属性。

样式标签页底部的工具栏会通过加载旋转图标显示状态。建议会随着您的输入而更新或清除,确保 AI 生成的文本始终与您的手动修改相关。

APCA 色彩对比度指南已升级为稳定版

高级感知对比度算法 (APCA) 对比度计算器已正式结束实验阶段,现在可作为标准偏好设置使用。APCA 使用针对现代显示屏和文本渲染进行优化的现代感知对比度模型,取代了旧版 AAA/AA 对比度准则。

您现在可以使用位于设置 > 偏好设置 > 元素 > 启用 APCA 对比度指南下的复选框来启用或停用 APCA 指南。

开发者工具设置中的 APCA 算法切换开关,以及“样式”标签页中生效的新算法。
开发者工具设置中的 APCA 算法切换开关以及“样式”标签页中生效的新算法。

动态设备模式用户代理

之前,自适应设备模式使用硬编码的用户代理字符串 (Android 6.0; Nexus 5)。这会导致现代网站降低功能或触发兼容模式,因为报告的操作系统被识别为已有十多年历史。

硬编码的用户代理已替换为基于当前日历年自动更新的动态启发式方法,确保开发者工具始终报告合理的新式环境,而无需手动维护。

其他亮点

此版本包含多项细微改进和 bug 修复:

  • 控制台:在控制台面板工具栏中添加了全部收起 / 展开切换按钮,以便快速展开或收起所有有效的控制台组和堆栈轨迹。(427657550)
  • 应用:在应用元数据视图中,存储分区字段的可点击超链接已取代静态文本。点击存储分区链接会自动前往并突出显示存储分区边栏面板中的相应存储分区。 (435311130)
  • 应用:在解决崩溃回归问题后,重新为 Service Worker 启用了完整存储空间检查支持。(406991275466134219)
  • 应用:在“预加载”面板中添加了对检查 form_submission 预渲染事件的支持。(346555939488078903
  • 应用:实现了设备绑定会话凭证 (DBSC) 管理,允许开发者通过上下文菜单或按 DeleteBackspace 键清除或删除有效会话。(471017387)
  • 元素:现在,问题面板中突出显示的 DOM 节点(表示隐藏的问题)会根据问题过滤操作动态更新(显示或消失)。 (40272723)
  • 网络:服务器发送的事件 (SSE) 现在已完全序列化并包含在 HAR 导出中,从而能够保存正在进行的直播活动流捕获并将其重新导入到 DevTools 中。(494294071)
  • 性能:修复了实时指标视图中的核心 Web 指标跟踪功能,以将跟踪严格限定在主框架执行上下文中,防止动态 iframe 抖动重置指标。(494350655)
  • 性能:将 web-vitals 升级到了 v5.2.0,引入了针对 INP 监控期间内存泄漏的本地上游修复。(484342204)