Jecelyn Yeen
限制 WebSocket 请求
Network 面板现在支持限制 Web 套接字请求。以前，网络节流功能对 Web 套接字请求不起作用。
打开网络面板，点击 Web 套接字请求，然后打开消息标签页以观察消息传输情况。选择 Slow 3G 以限制速度。
Chromium 问题：423246
“Application”面板中的“New Reporting API”窗格
您可以使用新的 Reporting API 窗格监控在网页上生成的报告及其状态。
Reporting API 旨在帮助您监控网页的安全违规行为、已弃用的 API 调用等。
打开使用 Reporting API 的页面（例如演示页面）。在应用面板中，向下滚动到后台服务部分，然后选择 Reporting API 窗格。
报告部分会显示在网页上生成的报告及其状态的列表。点击该报告即可查看报告的详细信息。
端点部分可让您大致了解 Reporting-Endpoints 标头中配置的所有端点。
Chromium 问题：1205856
支持等待元素在“记录器”面板中可见/可点击
重放用户流记录时，Recorder 面板现在会等到相应元素在视口中可见或可点击，或者尝试将元素自动滚动到视口后再重放步骤。以前，重放会立即失败。
下例展示了屏幕外菜单在视口之外的位置，在激活后滑入。用户体验流程是切换菜单，然后点击菜单项。以前，重放会在最后一步失败，因为菜单项仍然处于滑入状态，在视口中不可见。此问题现已解决。
Chromium 问题：1257499
优化了控制台样式、格式和过滤功能
使用 ANSI 转义代码正确设置日志消息的样式
您现在可以使用 ANSI 转义序列正确设置控制台消息的样式。以前，开发者工具控制台对 ANSI 转义序列的支持非常有限（并且部分损坏）。
Node.js 开发者通常通过 ANSI 转义序列为日志消息着色，这通常要借助一些样式库（如 chalk、colors、ansi-colors、kleur 等）。
完成这些更改后，您现在可以使用开发者工具无缝调试 Node.js 应用，并提供适当的彩色控制台消息。您可以打开此演示自行查看！
如需详细了解如何使用开发者工具设置控制台消息的格式和样式，请参阅在控制台中设置消息格式和样式文档。
正确支持 %s、%d、%i 和 %f 格式说明符
控制台现在可以正确执行控制台标准中指定的 %s、%d、%i 和 %f 类型的转换。之前，对话结果不一致。
更直观的控制台组过滤器
过滤控制台消息时，如果控制台消息的内容与过滤条件匹配，或者群组（或祖先群组）的标题与过滤条件匹配，则会显示一条控制台消息。以前，尽管有过滤条件，控制台组标题仍会显示。
此外，如果显示控制台消息，系统现在也会显示其所属的群组（或祖先群组）。
Chromium 问题：1068788
源代码映射改进
使用源映射文件调试 Chrome 扩展程序
您现在可以使用源映射文件调试 Chrome 扩展程序。以前，开发者工具仅支持对 Chrome 扩展程序进行调试的内嵌源代码映射。
Chromium 问题：212374
改进了“Sources”面板中的源代码文件夹树
我们改进了来源面板中的源代码文件夹树，文件夹结构和命名方式更加井然有序（例如“../”“./”等）。从本质上讲，这是对源映射中的绝对源网址进行标准化的结果。
Chromium 问题：1284737
在“Sources”面板中显示工作器源文件
现在，具有相对 Source网址 的 Worker（例如 Web Worker、Service Worker）源文件会显示在 Source 面板中。以前，工作器源文件未得到正确处理。
Chromium 问题：1277002
Chrome 自动深色主题更新
现已简化自动深色主题模拟界面。现在是复选框，之前是下拉菜单。
除此之外，启用自动深色主题后，Emulaterefers-color-scheme 下拉菜单将被停用，并自动设为 prefers-color-scheme: dark。
Chrome 96 在 Android 设备上引入了自动深色主题的源试用。借助此功能，如果用户在操作系统中选择启用深色主题，浏览器就可以为浅色主题网站应用自动生成的深色主题。
Chromium 问题：1243309
易于触摸的颜色选择器和拆分窗格
现在，您可以在触摸屏设备上使用手指或触控笔在开发者工具中选择颜色以及调整抽屉式导航栏的大小。
以下是使用 Google Pixelbook 设备触摸屏拍摄的示例。
其他亮点
以下是此版本中一些值得注意的修复：
- 修复了 Cookie 窗格中的修改 Cookie 问题。(1290196)
- 使用
Shift+Tab选择命令菜单中的上一条命令。(1278743) - 在“问题”标签页中报告 CORS 预检请求问题。(1272445)。
- 在 Issues（问题）标签页中报告 User-Agent Client Hints 问题。(1219359)。
- 修复了
Shift+Delete和Page up/Page down“来源”和控制台<br">面板中中的行为。（1278461、1285662） - 在 Sources 面板中移除断点时关闭断点修改对话框。(922513)
- 在开发者工具中切换浅色/深色主题时，无需重新加载。(1278738)
下载预览渠道
您可以考虑将 Chrome Canary 版、Dev 版或 Beta 版用作默认开发浏览器。通过这些预览渠道，您可以使用最新的开发者工具功能，测试先进的网络平台 API，并在用户采取行动之前发现网站上的问题！
与 Chrome 开发者工具团队联系
使用以下选项讨论博文中的新功能和变化，或讨论与开发者工具有关的任何其他内容。
- 通过 crbug.com 提交建议或反馈。
- 使用开发者工具中的更多选项
> Help > Report a DevTools issues来报告开发者工具问题。 - 发推文：@ChromeDevTools。
- 请在 YouTube 视频或“开发者工具提示”YouTube 视频中留言说明“开发者工具的新变化”。
开发者工具的新变化
开发者工具的新变化系列中涵盖的所有内容的列表。
Chrome 123
- 寻找复活节彩蛋
- 元素面板更新
- 依次前往“元素”>“样式”模拟聚焦的页面
var()回退中的颜色选择器、角度时钟和加/减速编辑器- CSS 长度工具已弃用
- “Performance”>“Main track”中所选搜索结果的弹出式窗口
- 网络面板更新
- “网络”>“EventStream”标签页中的“清除”按钮和搜索过滤器
- “广告联盟”>“Cookies”中有关第三方 Cookie 豁免原因的提示
- 启用和停用“来源”中的所有断点
- 在适用于 Node.js 的开发者工具中查看已加载的脚本
- Lighthouse 11.5.0
- 无障碍功能改进
- 其他亮点内容
Chrome 122
- 录音机扩展程序官方系列已发布
- 网络改进
- “状态”列中的失败原因
- 改进的“复制”子菜单
- 性能提升
- 时间轴中的面包屑导航
- 主轨道中的事件发起者
- Node.js DevTools 的 JavaScript 虚拟机实例选择器菜单
- “来源”中新增了快捷方式和命令
- 元素改进
- 现在，可在“Styles”中修改 ::view-transition 伪元素
- 对块容器的 align-content 属性支持
- 针对模拟可折叠设备的折叠状态支持
- 动态主题
- “网络和应用”面板中的第三方 Cookie 逐步淘汰警告
- Lighthouse 11.4.0
- 无障碍功能改进
- 其他亮点内容
Chrome 121
- 元素改进
- “网络”面板中经过简化的过滤栏
@font-palette-values支持- 支持的情况：自定义属性作为另一个自定义属性的后备
- 改进了源代码映射支持
- 改进了“性能”面板
- “增强型互动”跟踪
- “Bottom-Up”“Call Tree”和“Event Log”标签页中的高级过滤
- “来源”面板中的缩进标记
- 关于“网络”面板中已替换标题和内容的实用提示
- 用于添加和移除请求屏蔽模式的新命令菜单选项
- CSP 违规行为实验已移除
- Lighthouse 11.3.0
- 无障碍功能改进
- 其他亮点内容
Chrome 120
- 第三方 Cookie 逐步淘汰
- 使用 Privacy Sandbox 分析工具分析网站的 Cookie
- 增强的忽略列表
- node_modules 的默认排除模式
- 现在，如果捕获的异常被捕获或通过未忽略的代码传递，则会停止执行
x_google_ignoreList在源代码映射中已重命名为ignoreList- 远程调试期间新增了输入模式切换开关
- “元素”面板现在会显示 #document 节点的网址
- “Application”面板中的有效内容安全政策
- 改进了动画调试
- Sources 和控制台中的 self XSS 警告中的“Do you trust this code?”对话框
- Web Worker 和 Worklet 中的事件监听器断点
<audio>和<video>的新媒体徽章- “预加载”已重命名为“推测加载”
- Lighthouse 11.2.0
- 无障碍功能改进
- 其他亮点内容
Chrome 119
- 改进了“元素”>“样式”中的 @property 部分
- 可修改的 @property 规则
- 系统会报告 @property 规则无效的问题
- 更新了要模拟的设备列表
- 在“Sources”的脚本标记内美观输出内嵌 JSON
- 在控制台中自动补全私密字段
- Lighthouse 11.1.0
- 无障碍功能改进
- Web SQL 弃用
- 在“应用”>“清单”中验证屏幕截图宽高比
- 其他亮点内容
Chrome 118
- 在“元素”>“样式”中新增了自定义属性部分
- 更多本地替换项改进
- 增强型搜索功能
- 经过改进的“来源”面板
- 简化了“Sources”面板中的工作区
- 对“Sources”中的窗格重新排序
- 支持更多脚本类型的语法突出显示和美观输出
- 模拟“首选降低透明度”的媒体功能
- Lighthouse 11
- 无障碍功能改进
- 其他亮点内容
Chrome 117
Chrome 116
- 改进了针对缺少样式表的调试功能
- “元素”>“样式”>“加/减速编辑器”中的线性时间支持
- 存储分区支持和元数据视图
- Lighthouse 10.3.0
- 无障碍功能：键盘命令和改进的屏幕阅读功能
- 其他亮点内容
Chrome 115
- 元素改进
- 全新 CSS subgrid 徽章
- 提示中的选择器特异性
- 提示中自定义 CSS 属性的值
- 来源改进
- CSS 语法突出显示
- 用于设置条件断点的快捷方式
- 应用 > 跳出跟踪缓解措施
- Lighthouse 10.2.0
- 默认忽略内容脚本
- 网络 > 响应改进
- 其他亮点内容
Chrome 114
- WebAssembly 调试支持
- 改进了 Wasm 应用中的步进行为
- 使用“元素”面板和“问题”标签页调试自动填充
- 录音机中的断言
- Lighthouse 10.1.1
- 性能提升
- performance.mark() 在“性能”>“计时”中显示悬停时间
- profile() 命令填充“Performance”>“Main”
- 有关用户互动缓慢的警告
- 网页指标更新
- JavaScript 性能分析器弃用：第三阶段
- 其他亮点内容
Chrome 113
- 替换网络响应标头
- Nuxt、Vite 和 Rollup 调试方面的改进
- “元素”>“样式”中的 CSS 改进
- CSS 属性和值无效
- 动画简写属性中指向关键帧的链接
- 新的控制台设置：按 Enter 键时自动补全
- 命令菜单重点显示已创建的文件
- JavaScript 性能分析器弃用：第二阶段
- 其他亮点内容
Chrome 浏览器 112
- 录音机更新
- 录音机重放扩展程序
- 使用穿孔选择器录音
- 使用 Lighthouse 分析功能将录制内容导出为 Puppeteer 脚本
- 获取“录音机”扩展程序
- 元素 > 样式更新
- “Styles”窗格中的 CSS 文档
- CSS 嵌套支持
- 在控制台中标记日志点和条件断点
- 在调试期间忽略不相关的脚本
- 开始弃用 JavaScript 性能分析器
- 模拟对比度下降
- Lighthouse 10
- 其他亮点内容
Chrome 111
Chrome 浏览器 110
- 重新加载时清除性能面板
- 录音机更新
- 在“录音机”中查看并突出显示用户流代码
- 自定义录音的选择器类型
- 在录制时修改用户体验流程
- 自动就地打印
- 改进了 Vue、SCSS 等项目的语法突出显示和内嵌预览功能
- 控制台中符合人体工学且一致的自动补全功能
- 其他亮点内容
Chrome 入门指南
- 录音机：作为步骤选项、页内重放、步骤的上下文菜单进行复制
- 在性能录制内容中显示实际函数名称
- “控制台和来源”面板中新增了键盘快捷键
- 改进的 JavaScript 调试功能
- 其他亮点内容
- [实验性] 增强管理断点的用户体验
- [实验性] 自动就地打印
Chrome 入门指南
Chrome 入门指南
- 在开发者工具中自定义键盘快捷键
- 使用键盘快捷键切换浅色和深色主题
- 在内存检查器中突出显示 C/C++ 对象
- 支持 HAR 导入的完整发起者信息
- 按
Enter后启动 DOM 搜索 - 为
align-contentCSS flexbox 属性显示start和end图标 - 其他亮点内容
Chrome 入门指南
- 在“Sources”面板中按“已编写”/“已部署”对文件进行分组
- 针对异步操作的关联堆栈轨迹
- 自动忽略已知的第三方脚本
- 改进了调试期间的调用堆栈
- 在“来源”面板中隐藏已列入忽略名单的来源
- 在命令菜单中隐藏已忽略列表的文件
- “效果”面板中的新互动跟踪
- “Performance Insights”面板中的 LCP 时间明细
- 在“记录器”面板中为录制内容自动生成默认名称
- 其他亮点内容
Chrome 入门指南
- “录音机”中的分步重放
- 在“记录器”面板中支持鼠标悬停事件
- “性能数据分析”面板中的 Largest Contentful Paint (LCP)
- 识别闪光灯（FOIT、FOUT）是导致布局偏移的潜在根本原因
- “Manifest”窗格中的协议处理程序
- “元素”面板中的顶层标志
- 在运行时附加 Wasm 调试信息
- 支持在调试期间进行实时编辑
- 在“样式”窗格中在规则中查看和修改 @scope
- 源代码映射改进
- 其他亮点内容
Chrome 入门指南
- 调试期间重启帧
- “Recorder”面板中的慢速重放选项
- 为“Recorder”面板构建扩展程序
- 在“Sources”面板中按“已编写”/“已部署”对文件进行分组
- “性能数据分析”面板中的“新用户计时”轨道
- 显示为元素分配的槽位
- 为性能记录模拟硬件并发
- 在自动填充 CSS 变量时预览非颜色值
- 在往返缓存窗格中识别阻塞帧
- 改进了针对 JavaScript 对象的自动补全建议
- 源代码映射改进
- 其他亮点内容
Chrome 入门指南
- 在“Recorder”面板中捕获双击和右键点击事件
- Lighthouse 面板中新的时间跨度和快照模式
- 改进了“性能数据分析”面板中的缩放控件
- 确认删除表演录音
- 在“元素”面板中对窗格重新排序
- 选择浏览器之外的颜色
- 改进了调试期间的内嵌值预览
- 支持为虚拟身份验证器使用大型 blob
- “来源”面板中的新键盘快捷键
- 源代码映射改进
Chrome 入门指南
- 预览版功能：新的“效果数据分析”面板
- 用于模拟浅色主题和深色主题的新快捷方式
- 提升了“网络预览”标签页的安全性
- 改进了在断点处的重新加载
- 管理中心更新
- 在开始时取消用户流记录
- 在“Styles”窗格中显示继承的突出显示伪元素
- 其他亮点内容
- [实验性] 复制 CSS 更改
- [实验性] 在浏览器之外选择颜色
Chrome 入门指南
- 以 JSON 文件的形式导入和导出记录的用户流
- 在“样式”窗格中查看级联层
- 支持
hwb()颜色函数 - 改进了私有属性的显示方式
- 其他亮点内容
- [实验性] Lighthouse 面板中新增了时间跨度和快照模式
Chrome 100
Chrome 99
- 限制 WebSocket 请求
- “Application”面板中的“New Reporting API”窗格
- 支持等待元素在“记录器”面板中可见/可点击
- 优化了控制台样式、格式和过滤功能
- 使用源映射文件调试 Chrome 扩展程序
- 改进了“Sources”面板中的源代码文件夹树
- 在“Sources”面板中显示工作器源文件
- Chrome 的自动深色主题更新
- 易于轻触的颜色选择器和拆分窗格
- 其他亮点内容
Chrome 98
- 预览功能：整页无障碍树
- “更改”标签页中的更改更精准
- 为用户体验流程记录设置较长的超时
- 使用“往返缓存”标签页确保您的网页可缓存
- 新建“属性”窗格过滤条件
- 模拟 CSS forced-colors 媒体功能
- 悬停命令时显示标尺
- 在 Flexbox 编辑器中支持
row-reverse和column-reverse - 新增了用于重放 XHR 和展开所有搜索结果的键盘快捷键
- Lighthouse 面板中的 Lighthouse 9
- 经过改进的“来源”面板
- 其他亮点内容
- [实验性] Reporting API 窗格中的端点
Chrome 97
Chrome 96
- 预览功能：新的“CSS 概览”面板
- 恢复并改进了 CSS 长度编辑和复制体验
- 模拟 CSS Preferencess-contrast 媒体功能
- 模拟 Chrome 的自动深色主题功能
- 在“Styles”窗格中以 JavaScript 形式复制声明
- Network 面板中的新载荷标签页
- 改进了“属性”窗格中的属性显示方式
- 可以在控制台中隐藏 CORS 错误
- 在控制台中预览和评估适当的
Intl对象 - 一致的异步堆栈轨迹
- 保留控制台边栏
- Application 面板中已废弃的 Application Cache 窗格
- [实验性] Application 面板中的 New Reporting API 窗格
Chrome 95
- 全新 CSS 长度制作工具
- 在“问题”标签页中隐藏问题
- 改进了属性显示
- Lighthouse 面板中的 Lighthouse 8.4
- 在“Sources”面板中对代码段进行排序
- 添加了指向翻译版版本说明和报告翻译 bug 的新链接
- 改进了开发者工具命令菜单的界面
Chrome 94
- 以您的首选语言使用开发者工具
- “设备”列表中的新 Nest Hub 设备
- “帧详情”视图中的源试用
- 全新“CSS 容器查询”徽章
- 用于反转网络过滤器的新复选框
- 即将弃用控制台边栏
- 在“Issues”（问题）标签页和“Network”（网络）面板中显示原始
Set-Cookies标头 - 在控制台中一致地将原生访问器显示为自己的属性
- 带有 #source网址 的内嵌脚本的适当错误堆栈轨迹
- 在“Computed”窗格中更改颜色格式
- 将自定义提示替换为原生 HTML 提示
- [实验性] 在“问题”标签页中隐藏问题
Chrome 93
- “样式”窗格中可修改的 CSS 容器查询
- “网络”面板中的 Web 软件包预览
- Attribution Reporting API 调试
- 改进了控制台中的字符串处理
- 改进的 CORS 调试
- Lighthouse 8.1
- 在“清单”窗格中新建备注网址
- 修复的 CSS 匹配选择器
- “网络”面板中的整齐打印 JSON 响应
Chrome 92
- CSS 网格编辑器
- 在控制台中支持
const重复声明 - Source Order Viewer
- 用于查看画面详细信息的新快捷方式
- 增强型 CORS 调试支持
- 将 XHR 标签重命名为 Fetch/XHR
- 在“网络”面板中过滤 Wasm 资源类型
- “网络状况”标签页中的设备用户代理客户端提示
- 在“问题”标签页中报告怪异模式问题
- 在“性能”面板中添加计算交集
- Lighthouse 面板中的 Lighthouse 7.5
- 废弃了调用堆栈中的“重启帧”上下文菜单
- [实验性] 协议监控器
- [实验性] 木偶演奏器
Chrome 91
- 网页指标信息弹出式窗口
- 新的内存检查器
- 直观呈现 CSS 滚动贴靠
- 新建徽章设置窗格
- 包含宽高比信息的增强型图片预览
- “新建网络条件”按钮，其中包含用于配置
Content-Encoding的选项 - 用于查看计算值的快捷方式
accent-color关键字- 使用颜色和图标对问题类型进行分类
- 删除信任令牌
- “帧详情”视图中被屏蔽的功能
- 在“实验”设置中过滤实验
- “Cache storage”窗格中新增了
Vary Header列 - 支持 JavaScript 自有品牌检查
- 增强了对断点调试的支持
- 支持使用
[]表示法的悬停预览 - 改进的 HTML 文件大纲
- 适用于 Wasm 调试的错误堆栈轨迹
Chrome 90
- 全新 CSS flexbox 调试工具
- 新增了 Core Web Vitals 叠加层
- 将问题数量移到了控制台状态栏
- 报告 Trusted Web Activity 问题
- 在控制台中将字符串的格式设置为（有效）JavaScript 字符串字面量
- “Application”面板中的“New Trust Tokens”窗格
- 模拟 CSS color-gamut 媒体功能
- 经过改进的渐进式 Web 应用工具
- 在“网络”面板中新增了
Remote Address Space列 - 性能提升
- 在“帧详情”视图中显示允许/禁止的功能
- 在“Cookies”窗格中新增了
SameParty列 - 已废弃的非标准
fn.displayName支持 - 弃用“设置”菜单中的
Don't show Chrome Data Saver warning - [实验性] 在“问题”标签页中自动报告低对比度问题
- [实验性] 元素面板中的完整无障碍功能树状视图
Chrome 89
- 针对“受信任类型”违规行为的调试支持
- 在视口以外截取节点屏幕截图
- 适用于网络请求的新“信任令牌”标签页
- Lighthouse 面板中的 Lighthouse 7
- 支持强制使用 CSS
:target状态 - 用于复制元素的新快捷方式
- 适用于自定义 CSS 属性的颜色选择器
- 用于复制 CSS 属性的新快捷键
- 用于显示经过网址解码的 Cookie 的新选项
- 仅清除可见的 Cookie
- 用于在“存储”窗格中清除第三方 Cookie 的新选项
- 修改自定义设备的用户代理客户端提示
- 保留“记录网络日志”设置
- 在“网络”面板中查看 WebTransport 连接
- “在线”已重命名为“无节流”
- “控制台”、“来源”面板和“样式”窗格中的新复制选项
- Frame 详情视图中的新 Service Worker 信息
- 在“帧详情”视图中测量内存信息
- 通过“问题”标签页提供反馈
- “性能”面板中的丢帧数
- 在 Device Mode 下模拟可折叠设备和双屏设备
- [实验性] 使用 Puppeteer 记录器自动执行浏览器测试
- [实验性]“样式”窗格中的字体编辑器
- [实验性] CSS flexbox 调试工具
- [实验性] 全新的 CSP 违规行为标签页
- [实验性] 新的色彩对比度计算 - 高级感知对比度算法 (APCA)
Chrome 88
- 开发者工具启动速度更快
- 全新 CSS 角度可视化工具
- 模拟不支持的图片类型
- 在“存储”窗格中模拟存储配额大小
- “性能”面板中新增了“网页指标”通道
- 在“网络”面板中报告 CORS 错误
- “帧详情”视图中的跨域隔离信息
- “框架详情”视图中的新 Web Worker 信息
- 显示已打开窗口的 Opener 框架详细信息
- 从“Service Workers”窗格打开“网络”面板
- 复制属性值
- 复制网络发起者的堆栈轨迹
- 在鼠标悬停时预览 Wasm 变量值
- 在控制台中评估 Wasm 变量
- 为文件/内存大小使用一致的测量单位
- 在“元素”面板中突出显示伪元素
- [实验性] CSS Flexbox 调试工具
- [实验性] 自定义和弦键盘快捷键
Chrome 87
- 新的 CSS 网格调试工具
- 新的 WebAuthn 标签页
- 在顶部和底部面板之间移动工具
- “样式”窗格中新的“已计算”边栏窗格
- 在“Computed”窗格中对 CSS 属性进行分组
- Lighthouse 面板中的 Lighthouse 6.3
- “计时”部分中的
performance.mark()个事件 - “Network”面板中新增了
resource-type和url过滤器 - 帧详情视图更新
- 废弃了“更多工具”菜单中的
Settings - [实验性] 在“CSS 概览”面板中查看并修正色彩对比度问题
- [实验性] 在开发者工具中自定义键盘快捷键
Chrome 86
- 新建“媒体”面板
- 使用“元素”面板上下文菜单截取节点屏幕截图
- “问题”标签页更新
- 模拟缺少的本地字体
- 模拟非活跃用户
- 模拟
prefers-reduced-data - 支持新的 JavaScript 功能
- Lighthouse 面板中的 Lighthouse 6.2
- 弃用了“Service Workers”窗格中列出的“其他源”
- 显示被滤除的项的覆盖率摘要
- “Application”面板中新增了框架详细信息视图
- “样式”窗格中的无障碍颜色建议
- 在“元素”面板中恢复 Properties 窗格
- “Network”面板中直观易懂的
X-Client-Data标头值 - 在“样式”窗格中自动填充自定义字体
- 在“网络”面板中始终显示资源类型
- “元素”和“网络”面板中的清除按钮
Chrome 85
- CSS-in-JS 框架的样式修改
- Lighthouse 面板中的 Lighthouse 6
- 废弃首次有效渲染时间 (FMP)
- 支持新的 JavaScript 功能
- “Manifest”窗格中的新应用快捷方式警告
- “时间”标签页中的 Service Worker
respondWith事件 - 一致显示“Computed”窗格
- WebAssembly 文件的字节码偏移量
- “Sources”面板中的逐行复制和剪切
- 管理中心设置更新
- 性能面板更新
- 断点、条件断点和日志点的新图标
Chrome 84
- 利用新的“问题”标签页解决网站问题
- 在“检查模式”提示中查看无障碍功能信息
- 性能面板更新
- 控制台中使用更准确的 promise 术语
- “样式”窗格更新
- 弃用“元素”面板中的属性窗格
- “Manifest”窗格中对应用快捷方式的支持
Chrome 83
- 模拟视觉缺陷
- 模拟语言区域
- 跨域嵌入器政策 (COEP) 调试
- 断点、条件断点和日志点的新图标
- 查看设置了特定 Cookie 的网络请求
- 从“命令”菜单固定到左侧
- 主菜单中的“设置”选项移动了
- “审核日志”面板现已更名为“Lighthouse”面板
- 删除文件夹中的所有本地覆盖设置
- 更新了长时间运行的任务界面
- “Manifest”窗格中支持可遮盖图标的图标
Chrome 82
Chrome 81
- 设备模式下支持 Moto G4
- 与 Cookie 相关的更新
- 更精确的 Web 应用清单图标
- 将鼠标悬停在 CSS
content属性上，可查看未转义的值 - 控制台中的源代码映射错误
- 用于停用滚动范围超出文件末尾的设置
Chrome 80
- 在控制台中支持
let和class重复声明 - 改进了 WebAssembly 调试
- “发起者”标签页中的请求发起者链
- 在“概览”中突出显示所选的网络请求
- “网络”面板中的网址列和路径列
- 已更新的用户代理字符串
- 新版 Audits 面板配置界面
- 按函数或按块代码覆盖模式
- 代码覆盖率现在必须通过页面重新加载启动
Chrome 79
- 调试 Cookie 被屏蔽的原因
- 查看 Cookie 值
- 模拟不同的首选配色方案和首选减少动作偏好设置
- 代码覆盖率更新
- 调试请求网络资源的原因
- “控制台”和“来源”面板再次遵循缩进偏好设置
- 光标导航的新快捷键
Chrome 78
- “ Audits”面板中的多客户端支持
- 付款处理程序调试
- “审核”面板中的 Lighthouse 5.2
- “Performance”面板中的 Largest Contentful Paint
- 通过主菜单提交开发者工具问题
Chrome 77
- 复制元素样式
- 直观呈现布局偏移
- “审核”面板中的 Lighthouse 5.1
- 操作系统主题同步
- 用于打开断点编辑器的键盘快捷键
- 在“网络”面板中预提取缓存
- 查看对象时的不公开属性
- “Application”面板中的通知和推送消息
Chrome 76
- 使用 CSS 值自动补全
- 广告联盟设置的新界面
- HAR 导出文件中的 WebSocket 消息
- HAR 导入和导出按钮
- 实时内存用量
- Service Worker 注册端口号
- 检查后台提取和后台同步事件
- 适用于 Firefox 的 Puppeteer
Chrome 75
- 自动填充 CSS 函数时的有意义的预设
- 通过命令菜单清除网站数据
- 查看所有 IndexedDB 数据库
- 悬停鼠标时查看资源的未压缩大小
- “Breakpoints”窗格中的内嵌断点
- IndexedDB 和缓存资源计数
- 用于停用详细检查提示的设置
- 在编辑器中切换制表符缩进的设置
Chrome 74
- 突出显示受 CSS 属性影响的所有节点
- “ Audits”面板中的 Lighthouse v4
- WebSocket 二进制消息查看器
- 在命令菜单中截取区域屏幕截图
- “网络”面板中的 Service Worker 过滤条件
- 性能面板更新
- “性能”面板录制内容中的耗时较长任务
- “时间”部分中的“First Paint”
- 额外提示：用于查看 RGB 和 HSL 颜色代码的快捷方式（视频）
Chrome 73
- 日志点
- 检查模式下的详细提示
- 导出代码覆盖率数据
- 使用键盘浏览控制台
- 颜色选择器中的 AAA 对比度线
- 保存自定义地理位置覆盖设置
- 代码折叠
- “帧”标签页已重命名为“消息”标签页
- 额外提示：按资源过滤“网络”面板（视频）
Chrome 72
- 在“效果”面板中直观呈现效果指标
- 突出显示 DOM 树中的文本节点
- 将 JS 路径复制到 DOM 节点
- “审核”面板更新，包括检测 JS 库的新审核以及用于通过命令菜单访问“审核”面板的新关键字
- 额外提示：使用 Device Mode 检查媒体查询（视频）
Chrome 71
- 将鼠标悬停在实时表达式结果上，突出显示 DOM 节点
- 将 DOM 节点存储为全局变量
- HAR 导入和导出现可显示发起方和优先级信息
- 从主菜单访问命令菜单
- 画中画断点
- 额外提示：使用
monitorEvents()在控制台中记录节点的触发事件（视频）
Chrome 70
- 控制台中的实时表达式
- 在 Eager 评估期间突出显示 DOM 节点
- 性能面板优化
- 更可靠的调试功能
- 通过命令菜单启用网络节流功能
- 自动补全条件断点
- 在 AudioContext 事件发生时中断
- 使用 ndb 调试 Node.js 应用
- 额外提示：使用 User Timing API 衡量实际的用户互动
Chrome 68
- Eager 评估
- 参数提示
- 函数自动补全
- ES2017 关键字
- “审核”面板中的 Lighthouse 3.0
- BigInt 支持
- 向“Watch”窗格添加属性路径
- “显示时间戳”已移至“设置”
- 额外提示：鲜为人知的控制台方法（视频）
Chrome 67
- 在所有广告网络标头中搜索
- CSS 变量值预览
- 以抓取方式复制
- 新审核、桌面配置选项和查看跟踪记录
- 停止无限循环
- “性能”标签页中的“用户计时”
- “内存”面板中明确列出的 JavaScript 虚拟机实例
- “网络”标签页已重命名为“网页”标签页
- 深色主题更新
- “安全性”面板中的证书透明度信息
- “性能”面板中的网站隔离功能
- 额外提示：“图层”面板 + 动画检查器（视频）
Chrome 66
- “网络”面板中的黑箱功能
- 在设备模式下自动调整缩放比例
- “预览”和“回复”标签页中的美观打印选项
- 在“预览”标签页中预览 HTML 内容
- 对 HTML 内样式的局部替换支持
- 额外提示：将框架脚本设置为黑箱，以使事件监听器断点更加有用
Chrome 65
- 本地替换
- 全新的无障碍工具
- “更改”标签页
- 新的搜索引擎优化 (SEO) 和性能审核
- “Performance”面板中的多个录制内容
- 通过异步代码中的 worker 实现可靠的代码单步调试
- 额外提示：使用 Puppeteer 自动执行开发者工具操作（视频）
Chrome 64
- 性能监视器
- 控制台边栏
- 将控制台中的类似消息归为一组
- 额外提示：切换悬停伪类（视频）
Chrome 63
Chrome 62
- 在管理中心中等待的顶级账号
- 新的屏幕截图工作流程
- CSS 网格突出显示
- 用于查询对象的全新 Console API
- 新的控制台过滤条件
- “网络”面板中的 HAR 导入
- 可预览的缓存资源
- 缓存调试更具可预测性
- 块级代码覆盖率
Chrome 61
Chrome 60
- 新版 Audits 面板
- 第三方徽章
- “继续前往此处”的新手势
- 进入异步模式
- 在控制台中预览信息更丰富的对象
- 在控制台中选择信息更丰富的上下文
- “索引涵盖范围”标签页中的实时动态资讯
- 更简单的网络节流选项
- 异步堆栈默认处于开启状态