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

发布时间:2026 年 3 月 10 日

Chrome 146 改进了“元素”面板中对已采用的样式表的支持,显著改进了控制台历史记录导航,并简化了隐私权调试工作流程,同时还包含各种其他小修复和更新。

DevTools MCP 服务器更新

开发者工具 MCP 服务器现已更新至 0.19.0 版,带来了强大的新工具、效率改进和专业的调试技能:

  • 集成式 Lighthouse 审核:您现在可以直接通过 MCP 运行 Lighthouse 审核,从而在代理工作流中自动执行性能和质量检查。
  • 精简模式:现在提供一种新的 --slim 模式,旨在优化工具说明和参数,以最大限度地节省 token。
  • 新的调试技能:添加了专门用于审核和调试无障碍功能以及调试和优化最大内容元素渲染时间 (LCP) 的技能。
  • 扩展的工具和功能:服务器现在支持存储隔离的浏览器上下文、实验性屏幕录制功能、新的 take_memory_snapshot 工具,以及 type_text 等高级互动功能。

如需查看完整的变更列表,请参阅 GitHub 上的公开更新日志

保留控制台历史记录修改

控制台中长期存在的摩擦点已得到解决。以前,如果您在修改从历史记录中提取的命令时离开(通过按向上键或向下键),所做的修改会丢失。

在 Chrome 146 中,开发者工具现在会在您浏览命令历史记录时保留您的编辑内容。您可以开始修改之前的命令、浏览其他命令,然后返回到草稿,而不会丢失您的工作。

此功能由社区贡献,感谢 @hjanuschka

Chromium 问题:355108929

改进了对已采用样式表的的支持

现在,调试 Web 组件和现代 CSS 架构变得更加轻松。 采用的样式表不再隐藏;现在,它们会分组显示在元素面板中 DOM 树内的专用 #adopted-style-sheets 节点下。

您可以像检查标准 <style> 标记一样检查这些样式表,甚至可以直接在样式窗格中修改其规则。这使得构造的样式表和声明式样式保持一致,从而简化了 Shadow DOM、Web 组件和共享设计系统的调试。

“元素”面板中采用的样式表,支持内嵌编辑。

Chromium 问题:47639919740802935

支持密集网格布局

样式窗格中的网格编辑器现在支持 dense 打包算法。在编辑 grid-auto-flow 时,您会看到一个用于 dense 关键字的新复选框,可让您直接从界面快速切换标准打包模式和紧凑打包模式。

网格编辑器中的新密集复选框。

感谢 @TheNourhan 的社区贡献!

Chromium 问题:40791512

简化了隐私权调试

之前的隐私与安全面板已重命名为安全,并经过整理,以减少界面杂乱程度并整合调试工作流程。现在,所有与隐私权相关的信息(例如第三方 Cookie 问题和检查潜在的破坏性更改)都会直接在控制台中报告。

此项更改意味着您不再需要在面板之间跳转来诊断隐私问题;隐私问题会与其他日志和错误一起显示,从而提供即时背景信息。

Chromium 问题:473796598

其他精彩集锦

  • 来源:对堆栈轨迹架构进行重大改进,解决了以下问题:延迟加载源映射导致界面意外跳转或切换文件。
  • 网络:启动器弹出式窗口现在使用改进的堆栈轨迹系统,以实现更可靠的请求链。

无障碍功能公告

此版本带来了以下无障碍功能改进:

  • 录音机:屏幕阅读器现在会在切换“显示代码”边栏时进行播报。
  • 应用:现在可以正确地将新的“共享存储空间”“往返缓存”和“反弹跟踪缓解”报告标题作为标题进行播报。
  • 设置:改进了对快捷方式项和颜色按钮的高对比度模式支持。
  • 常规:改进了各种界面元素(包括 CSS 概览面板和媒体播放器条目)的焦点可见性。

Chromium 问题:479882111478888141479250362