移除了 Chrome 63 中的 ::shadow 和 /deep/

从 Chrome 63 开始,您无法使用阴影穿透选择器 ::shadow/deep/ 来设置影子根内的内容样式。

  • /deep/ 组合器将充当后代选择器。x-foo /deep/ div 的工作方式类似于 x-foo div
  • ::shadow 伪元素不会与任何元素匹配。

移除决定

Chrome 版本 45 中废弃了 ::shadow/deep/。这是由 2015 年 4 月的 Web 组件聚会的所有参与者决定的。

影子穿透选择器的主要问题是,它们违反封装并造成组件无法再更改其内部实现的情况。

作为阴影穿孔选择器的替代方案,我们将进一步完善 CSS 阴影部分规范。阴影部分可让组件作者以保留封装的方式公开命名元素,同时仍然允许页面作者同时设置多个属性的样式。

如果我的网站使用 ::shadow 和 /deep/?

::shadow/deep/ 选择器仅影响旧版 Shadow DOM v0 组件。如果您使用的是 Shadow DOM v1,则无需更改网站上的任何内容。

您可以使用 Chrome Canary 来验证您的网站不会因这些新更改而出现问题。如果您发现问题,请尝试并移除对 ::shadow/deep/ 的任何使用。如果难以移除这些选择器的使用,请考虑从原生 shadow DOM 切换到可疑的 DOM polyfill。只有当您的网站依赖于原生 shadow DOM v0 时,您才需要进行此更改。

更多信息

意图移除 | Chromestatus Tracker | Chromium 错误