Chrome 120 的新变化

以下是您有必要知道的信息:

我是 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> 元素形成一个组。使用此设置时,相应组中一次最多只能打开 1 个元素。

下面是一个名为 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>

权限政策违规报告

权限政策违规行为报告现已推出Reporting API 为网络应用提供了一种通用报告机制,用于根据若干平台功能提供报告。

利用 Permissions Policy API 和 Reporting API 的集成,网站开发者可以配置端点,将政策违规报告发送到哪些端点,让网站所有者了解何时会在字段中为他们的页面请求禁用功能。

使用权限政策控制浏览器功能介绍了更多实现详情。

还有更多其他奖励!

当然还有很多。

  • 放宽的 CSS 嵌套实现允许嵌套样式规则从元素开始,而无需用 is() 封装或在前面添加 & 符号。

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

  • 另外提醒一下,Chrome 正在努力弃用第三方 Cookie。1 月份开始的实验可能会影响您的网站,因此请务必查看为弃用第三方 Cookie 做好准备,以便进行审核和缓解步骤。

深入阅读

这里仅介绍一些重要的亮点。如需了解 Chrome 120 中的其他变化,请点击以下链接。

订阅

如需随时了解最新动态,请订阅 Chrome Developers YouTube 频道,每当我们发布新视频时,您都会收到电子邮件通知。

嗨,Adriana Jara,我们的团队祝您节日快乐!Chrome 121 发布之后,我会立即告诉您 Chrome 的新变化!