Interop 2024

Interop 2022Interop 2023 大获成功之后,我们很高兴能够有机会与所有主要浏览器供应商和其他相关方再次开展协作。我们的共同目标是增强网络平台之间的互操作性,从而简化开发者的工作并丰富互联网用户的整体体验。

Interop 本质是一系列全面的测试和基准,旨在根据我们对网络标准的共同承诺评估各个浏览器的合规性。 最终, Interop 致力于消除浏览器之间的不一致,并促成业界统一愿景。

对于 Interop 2024,我们通过了一项公开提案流程来获取功能的初始列表。 在该名单中,各方通力协作,共同制定了 2024 年的重点关注领域列表。 我们希望在今年年底前 100% 通过所选测试的领域。

2024 年所有重点领域

Interop 2024 包含 12 个新的重点领域,以及 2023 年沿用的 5 个方面,其中一些修复仍有待进行。这些领域包括:

  • 无障碍功能
  • CSS 嵌套
  • 自定义属性
  • 声明式 Shadow DOM
  • font-size-adjust
  • WebSocket 的 HTTPS 网址
  • IndexedDB
  • 布局
  • 指针和鼠标事件
  • 弹出式窗口
  • 相对颜色语法
  • requestVideoFrameCallback
  • 滚动条样式设置
  • @starting-style 和 transition-Behavior
  • 文本方向
  • 文本换行:余额
  • 网址

如需查看所有重点领域的详细信息,请访问 Interop 2024 信息中心。该信息中心显示了所需功能和工作的详细信息,以及每个浏览器的当前得分。在本文的其余部分,您将了解 Chrome 在哪些方面需要做出最大努力才能实现 100% 目标。

嵌套

CSS 嵌套模块定义了嵌套选择器的语法,让您能够使用相对于父规则的选择器的子规则的选择器将一条样式规则嵌套在另一条样式规则中。

CSS 嵌套与 CSS 预处理器(如 Sass)的不同之处在于,CSS 嵌套由浏览器解析,而不是由 CSS 预处理器进行预编译。

CSS 嵌套有助于提高 CSS 样式表的可读性、模块化和可维护性。 这还有望有助于缩减 CSS 文件的大小,从而减少用户下载的数据量。

虽然所有浏览器都支持 CSS 嵌套,但由于规范的变更,实现方面存在一些差异。在 Interop 2024 期间,我们的目标是确保所有浏览器都符合当前规范。

详细了解 CSS 嵌套,并探索支持裸元素标记名称嵌套的规范的重要更新。

文本换行:余额

CSS text-wrap 属性的平衡值会向浏览器表明,您希望它平衡各行的文本。它通常用在标题或其他简短文本部分中,以避免排版过多。

一个换成两行的标题,第二行包含两个字词。
不平衡的标题
拆分成两行的标题,每行均等。
均衡的标题

浏览器对于此属性的各种简写版本和简写版本的支持有所不同。在 Interop 2024 期间,我们的目标是让这些应用实现互操作性。

平衡标题和其他简短文本部分是开发者经常要求的一项功能。如需了解详情,请参阅 CSS text-wrap: balanceWeb 上的端到端排版窗口CSS Text Balancing with text-wrap: balance

WebSocket 的 HTTP(S) 网址

WebSocket 构造函数最初需要使用 ws:wss: 网址,这会阻止使用相对网址,因此会生成临时解决方案代码。

规范已更新为允许 http(s) 协议方案,因此是相对网址。这些规范被标准化为 ws:wss:。在 Interop 2024 期间,我们将更新我们的实现以支持 http(s) 方案。

相对颜色语法

相对颜色语法在 CSS 颜色 5 规范中定义,提供了一种在 CSS 中操纵颜色的方法。例如,调暗、调亮或降低色彩饱和度。

相对颜色语法大致可以互操作,但浏览器尚未实现 currentcolor 关键字;这些测试已包含在 Interop 2024 中。

请参阅 CSS 相对颜色语法,了解您可以使用此功能执行的所有操作。

Interop 2024 信息中心

与往年一样,实验性浏览器和稳定版浏览器的当前得分将在信息中心上发布,以便您了解得分的走势。

包含得分的信息中心屏幕截图 - 互操作性:65;调查结果:0;Chrome Canary 版:83;边缘开发:82;Firefox Nightly:80;Safari 技术预览:79。
自 2024 年 2 月 1 日起,实验性浏览器版本得分。

我们非常期待看到今年所有重点领域都能取得多大的改进。

详细了解 Interop 2024