此页面由 Cloud Translation API 翻译。

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

Kayce Basques

Cookie 的新功能

调试 Cookie 被屏蔽的原因

记录网络活动后，选择网络资源，然后导航到更新后的 Cookie 标签页，以了解屏蔽相应资源的请求或响应 Cookie 的原因。请参阅更改了不使用 SameSite 时的默认行为，以了解为什么您可能会看到更多结果 Chrome 76 及更高版本中屏蔽的 Cookie。

“Cookies”标签页。

Cookie 标签页。

黄色的请求 Cookie 没有通过网络发送。这些内容默认处于隐藏状态。点击显示过滤的请求 Cookie 中显示它们。
黄色响应 Cookie 通过网络发送，但未存储。
将鼠标悬停在更多信息上，了解 Cookie 的已被屏蔽。
“请求 Cookie”和“响应 Cookie”表中的大部分数据来自资源的 HTTP 标头。Domain、Path 和 Expiration/Max-Age 数据均来自 Chrome 开发者工具协议。

Chromium 问题 #856777、#993843

查看 Cookie 值

点击 Cookies 窗格中的某一行即可查看该 Cookie 的值。

查看 Cookie 的值。

Chromium 问题 #462370

模拟不同的 preferreds-color-scheme 和 preferreds-reduced-motion 偏好设置

利用 prefers-color-scheme 媒体查询，即可将网站样式与用户样式相匹配偏好设置。例如，如果 prefers-color-scheme: dark 媒体查询为 true，则表示：您的用户将其操作系统设为深色模式，并更喜欢深色模式界面。

打开命令菜单，运行 Show Rendering 命令，然后设置模拟 CSS 媒体功能 Preferencess-color-scheme 下拉菜单，用于调试 prefers-color-scheme: dark 和 prefers-color-scheme: light 样式。

首选配色方案：深色

设置 prefers-color-scheme: dark 后（中间框），“Styles”窗格（右侧框）会显示当该媒体查询为 true 且视口显示深色模式样式（左侧框）时应用。

您还可以使用模拟 CSS 媒体功能来模拟 prefers-reduced-motion: reduce 模拟 CSS 媒体功能优先选项旁边的 Preferreds-reduced-motion下拉菜单下拉菜单。

Chromium 问题 #1004246

时区模拟

现在，“传感器”标签页不仅可以替换地理定位，还可以模拟任意时区，并测试这对您的 Web 应用的影响。可能令人惊讶的是，这个新功能地理定位模拟的可靠性：以前，网络应用可以通过将位置与用户的本地时区进行匹配。现在，地理定位和时区模拟之后，这种不匹配的情况就会被排除。

代码覆盖率更新

“覆盖率”标签页可以帮助您查找未使用的 JavaScript 和 CSS。

“覆盖率”标签页现在使用新的颜色来表示已使用和未使用的代码。这个颜色组合事实证明，色觉障碍人士更容易理解。左侧的红色条右边的蓝条表示未使用的代码。

新的覆盖率类型过滤器文本框可让您按类型过滤覆盖率信息：仅显示 JavaScript 覆盖率、仅显示 CSS 或显示所有类型的覆盖率。

“覆盖率”标签页。

“来源”面板会显示代码覆盖率数据（如果有）。点击红色或蓝色标记可打开“覆盖率”标签页并突出显示该文件。

“来源”面板中的覆盖率数据。

“来源”面板中的覆盖率数据。第 8 行是未使用的代码示例。第 11 行是使用的代码

Chromium 问题 #1003671、#1004185

调试请求网络资源的原因

记录网络活动后，选择网络资源，然后找到启动器 以了解请求资源的原因。请求调用堆栈部分介绍了导致网络请求的 JavaScript 调用堆栈。

“Initiator”（发起者）标签页。

Initiator 标签页。

Chromium 问题 963183、842488

Console 面板和 Sources 面板再次遵循缩进偏好设置

很长时间以来，DevTools 都有一项设置，可以将缩进偏好设置自定义为 2 个空格，4 个空格空格、8 个空格或制表符。最近，该设置本质上没用来源面板会忽略此设置。此错误现已修复。

转到设置 >偏好设置 >来源 >默认缩进来设置偏好设置。

Chromium 问题 #977394

用于光标导航的新快捷键

在“控制台”或“来源”面板中按 Ctrl+P，将光标移至上述一行。新闻媒体按 Ctrl+N 可将光标移至下一行。

Chromium 问题 #983874

下载预览渠道

请考虑将 Chrome Canary、开发者版或 Beta 版用作您的默认开发浏览器。通过这些预览渠道，您可以访问最新的开发者工具功能，测试先进的网络平台 API，并在用户之前发现您网站上的问题！

与 Chrome 开发者工具团队联系

使用以下选项讨论博文中的新功能和变更，或与开发者工具相关的任何其他内容。

请通过 crbug.com 提交建议或反馈。
使用更多选项报告开发者工具问题 >帮助 >在开发者工具中报告开发者工具问题。
请发送电子邮件至 @ChromeDevTools。
请对我们的开发者工具新功能 YouTube 视频或开发者工具提示 YouTube 视频发表评论。