Chrome 120 的新变化

Adriana Jara

以下是您需要知晓的相关信息：

• CloseWatcher API 可在处理关闭请求时提供一致的体验。
• 使用 <details> 元素轻松实现手风琴模式。
• 权限政策违规报告现已推出。
• 还有许多其他功能。

我是 Adriana Jara。我们来深入了解一下 Chrome 120 中面向开发者的新功能。

CloseWatcher API。

模态或弹出式窗口组件的一个重要功能是，它们易于关闭，并且采用一致的关闭机制。这些机制称为关闭请求，通常在桌面平台上为 ESC 键，在 Android 上为返回手势或按钮。

Web 开发者没办法为自己的组件处理关闭请求。在 Android 设备上，这一点尤其成问题，因为在这些设备上，为返回手势提供简单的关闭行为非常复杂。

Chrome 120 通过 CloseWatcher 提供了此解决方案，这是一个用于直接监听和响应关闭请求的新 API。它还包括对 <dialog> 和 popover="" 的升级，以使用新的关闭请求框架，以便它们响应 Android 返回按钮。

请参阅 CloseWatcher API 演示，试用一下。

<details> 名称属性

借助 <details> 元素的 name 属性，您可以轻松使用一系列 <details> HTML 元素实现折叠式布局。

具有相同 name 的多个 <details> 元素组成一个组。采用这种设置时，一次最多只能打开该组中的一项元素。

以下示例中，有一个共享名称 cookies 的组：

<details name="cookies">
  <summary>Chocolate chip</summary>
  Yum yum chocolate chip.
</details>
<details name="cookies">
  <summary>Snickerdoodle</summary>
   Yum yum snickerdoodle.
</details>
<details name="cookies">
  <summary>Maicenitas</summary>
   Yum yum maicenitas.
</details>
<details name="cookies">
  <summary>Sugar cookies</summary>
   Yum yum sugar cookies.
</details>

权限政策违规报告

权限政策违规报告现已推出，这些报告集成了 Permissions policy API，让开发者能够通过声明一组要由浏览器使用 Reporting API 强制执行的政策，来控制网页及其 iframe 和子资源可用的浏览器功能。Reporting API 提供了一种通用的报告机制，供 Web 应用根据多个平台功能生成报告。

通过此 Permissions Policy API 和 Reporting API 集成，Web 开发者可以配置端点，系统会将权限政策违规报告发送到该端点，以便网站所有者了解何时有用户请求在该领域使用被禁止的功能。

使用“权限”政策控制浏览器功能包含更多实现详情。

等等！

当然，还有许多其他功能。

• 放宽的 CSS 嵌套实现允许嵌套的样式规则以元素开头，而不是用 is() 封装或需要在前面加一个 ampersand。

• 借助 Media Session API 中的 enterpictureinpicture 操作，网站可以注册一个操作处理脚本，用于打开画中画或文档画中画窗口。

• 另请注意，Chrome 正在努力弃用第三方 Cookie。今年 1 月份，一项可能会影响您网站的实验开始，因此请务必查看为停用第三方 Cookie 做好准备，以执行审核和缓解步骤。

深入阅读

本文仅介绍了一些主要亮点。如需了解 Chrome 120 中的其他变更，请参阅以下链接。

• Chrome 开发者工具 (120) 中的新变化
• Chrome 120 弃用和移除的功能
• 针对 Chrome 120 的 ChromeStatus.com 更新
• Chromium 源代码库更改列表
• Chrome 发布日历

订阅

如需及时了解最新动态，请订阅 Chrome 开发者 YouTube 频道，这样每当我们发布新视频时，您就会收到电子邮件通知。

我是 Adriana Jara，我们团队祝您节日愉快！Chrome 121 发布后，我会立即向您介绍 Chrome 中的新变化！