Safari 16.1 中的 WebKit 功能

2022 年 10 月 24 日

作者：Jen Simmons

今天，Safari 16 适用于 macOS Ventura 和 iPadOS 16。此版本编号为 Safari 16.1，也适用于 iOS 16、macOS Monterey 和 macOS Big Sur。

要在 macOS Monterey 或 macOS Big Sur 上更新到 Safari 16.1，请前往“系统偏好设置”→“软件更新”→“更多信息”。要将您的 Mac 更新到 macOS Ventura，请前往“系统设置”→“软件更新”。要在 iPad 和 iPhone 上更新到 Safari 16.1，请在“设置”→“通用”→“软件更新”中更新 iPadOS 16 和 iOS 16。

9 月份发布的 Safari 16.0 中包含的功能包括容器查询、子网格、Web 检查器扩展、Flexbox 检查器、偏移路径、滚动行为、共享工作器、Shadow Realms、resolution 媒体查询、:has(:target)、text-align-last、animation-composition、离散动画、display: contents 的辅助功能改进、VoiceOver 性能改进、额外的 Apple Pay 支持、新的 Web 扩展 API、Manifest 版本 3 支持等等。Safari 16.1 将所有这些功能带到 iPadOS 16 和 macOS Ventura。

现在，让我们来看看随 Safari 16.1 而来的新功能和修复。

适用于 macOS Ventura 的网页推送

a push notification on macOS

适用于 macOS Ventura 的 Safari 16.1 为 Safari 带来了网页推送支持。网站和 Web 应用现在可以使用其他浏览器支持的相同标准远程发送通知——推送 API 和 通知 API，以及 Service Workers——甚至在 Safari 未运行时也能发送这些通知。

在 Safari 中，您的网站或 Web 应用的用户首先通过用户手势（例如点击按钮）表达兴趣来选择接收通知。然后系统会提示他们授予您的网站或应用发送通知的权限。用户可以在通知中心查看和管理通知。他们还可以在通知设置中为每个网站自定义样式和关闭通知。

如果您已经使用行业最佳实践为您的 Web 应用或网站实施了网页推送，它将在 Safari 中自动工作。您无需成为 Apple Developer Program 会员。但是，如果您通过浏览器检测排除了 Safari，则需要切换到功能检测才能使其工作。Safari 中的网页推送使用与为所有 Apple 设备上的原生推送提供动力的 Apple Push Notification 服务相同的服务。如果您严格管理服务器上的推送端点，请确保允许来自 push.apple.com 任何子域的 URL。

要了解更多信息，请观看 WWDC 会话 《了解适用于 Safari 的网页推送》（15 分钟视频），或阅读 webkit.org 上的文章 《了解网页推送》。

动态 AVIF

Safari 16.0 为 iOS 16 带来了对 AVIF 静态图像的支持。Safari 16.1 添加了对 AVIF 动态图像序列的支持。现在，保存在 AVIF 格式中的静态和动态图像都支持在 iOS 16、iPadOS 16 和 macOS Ventura 上使用。

通行密钥

9 月份，iOS 16 推出了通行密钥。现在，借助 Safari 16.1，通行密钥在所有支持 Safari 16 的地方都受支持——包括 iPadOS 16、macOS Monterey、macOS Big Sur 和 macOS Ventura，以及 iOS 16。通行密钥为用户提供了一种极其简单的登录方式，同时带来了显着的安全提升。

使通行密钥成为可能的技术定义在 FIDO 联盟和 W3C 的开放标准中，包括 WebAuthn 标准，该标准已在浏览器中广泛支持。通行密钥是一项全行业范围的努力，“通行密钥”是一个通用名词，任何人都可以使用。您可以将通行密钥与现有身份验证选项一起提供。首先，教导您的后端存储公钥并发出身份验证挑战。然后，在您的网站或 Web 应用上，通过采用用于创建新通行密钥和允许用户使用其通行密钥登录的 API，向用户提供通行密钥。如果您的网站或 Web 应用已经支持使用 WebAuthn 的平台验证器，那么在添加对通行密钥的支持时，有几点需要注意。确保您没有将登录限制在保存通行密钥的设备上；也就是说，不要使用 cookie 来“记住”用户在特定设备上设置了密钥。此外，通过采用“条件中介”，确保您现有登录表单中的用户名字段与自动填充兼容。最后，开始提及通行密钥，并将其视为一种主要的登录方式。

要了解更多信息，请观看 WWDC22 会话 《了解通行密钥》（27 分钟视频）或阅读《支持通行密钥》。

iPadOS 上的新视口大小

Three Safari browser windows, layered over one another, floating in space. One tall and very narrow. One medium and square. One bigger and wide.

iPadOS 16 引入了全新的多任务处理体验“台前调度”。这意味着 iPadOS 上的浏览器窗口可以调整为许多不同的视口大小和宽高比。响应式网页设计技术，包括使用 CSS 媒体查询和容器查询，是关键。布局从来没有一个单一的“平板电脑尺寸”，现在这一点比以往任何时候都更加真实。

使用 Apple Pencil 在 iPadOS 上悬停

新款 iPad Pro 支持使用 Apple Pencil 进行悬停操作。在网络浏览器中，用户可以看到链接、动画等的悬停状态。iPadOS 上的悬停是另一个例子，说明如何使用功能检测而不是设备或用户代理检测来构建代码，有助于网站和 Web 应用的未来兼容性。

滚动到文本片段

Safari 16.1 添加了对滚动到文本片段的支持，使得可以在 URL 中包含一个用于查找文本片段的文本指令。当用户导航到包含此类指令的 URL 时，浏览器会将文本片段滚动到视图中并用持久高亮显示标记它。

屏幕捕获改进

screenshot of dialog message asking Allow webkit.org to share your screen?

在 macOS Ventura 上，Safari 16.1 添加了对使用 getDisplayMedia() 捕获特定 Safari 窗口的支持。在响应用户操作时调用 getDisplayMedia 将向用户显示一个提示，请求允许共享其屏幕或应用程序的特定窗口（包括 Safari 窗口）。getDisplayMedia 提供的 MediaStream 包含屏幕或窗口的视频流，可以录制或用作 WebRTC 会话的一部分。

更多内容

Safari 16.1 添加了对通过 SKAdNetwork 进行 Web 到 App Store 广告的支持。它还添加了对 WebDriver Wheel 输入源和操作的支持。Safari Web 检查器添加了对颜色选择器的支持，可以从屏幕上的任何像素选择颜色。

修复和优化

Safari 16.1 还包含错误修复和功能优化。其中许多修复提高了 Safari 的 Interop 2022 分数。Safari 16.1 的测试通过率为 93.3%。这是从总分 90 分中的 84.3 分计算得出的。剩余的 10 分是联合“调查项目”。

辅助功能

  • 修复了 display:contents 按钮无法暴露其可访问名称的问题。

CSS

  • 修复了动态视口高度单位 (dvh) 与实际视口高度不匹配的问题。
  • 修复了在 <body> 上设置的滚动吸附属性停止传播到视口的问题。
  • 修复了逻辑视口单位未能正确解析 font-size 的问题。
  • 修复了包含块的非可见溢出错误地剪裁 position: fixed 后代的问题。
  • 修复了表格用户代理样式使用 box-sizing: border-box 的问题。
  • 修复了带有 contain: size 的 <select> 元素的问题。
  • 修复了布局和绘制包含的处理问题。
  • 修复了处理 font-variant: normal 和 font-variant: none 简写以重置 font-variant-numeric 和 font-variant-alternates 的问题。
  • 修复了小写字母处理，如果字体中任何字符支持小写字母，则防止合成。

表单

  • 修复了 <select> 元素上被忽略的 CSS color 属性的问题。
  • 修复了在设置 appearance: textfield 时隐藏 <input type="search"> 上的图标的问题。
  • 修复了将只读属性应用于正确的 <input> 类型和 <textarea> 元素的问题。
  • 修复了 <input type="search"> 的内容宽度不包含装饰的问题。
  • 修复了输入类型状态更改，以正确处理缺失或空字符串值属性的问题。
  • 修复了 form.submit() 同时向多个帧提交单个表单的问题。
  • 修复了克隆 <textarea> 时不在文本内容末尾设置初始选择的问题。
  • 修复了在设置选择范围导致选择没有变化时不触发选择事件的问题。

媒体

  • 修复了某些 AVIF 图像因其容器格式而无法渲染的问题。

渲染

  • 修复了阻止 <html> 在任何包含情况下背景传播的问题。

安全

  • 修复了 COOP same-origin 在回退导航后破坏表单的问题。
  • 修复了 Workers 中的 script-src-elem CSP 问题。

Web API

  • 修复了 shadow DOM 和 <dialog> 元素的焦点行为以符合规范。

反馈

我们期待您的反馈。请向 @webkit、@jensimmons 或 @jonathandavis 发送推文，分享您对 Safari 16.1 的看法。如果您遇到任何问题，欢迎您就 Safari UI 提供反馈，或提交关于 Web 技术或 Web 检查器的WebKit 错误报告。提交问题确实会带来改变。

下载最新的 Safari 技术预览版，以保持在 Web 平台的最前沿并使用最新的 Web 检查器功能。您还可以使用 WebKit 功能状态页面来关注您最感兴趣的 Web 功能的新信息。

要了解有关 Safari 16.1 中为 Web 开发人员提供的更多信息，请阅读 Safari 16.1 发布说明。