CSS的:is、:where伪类是否会自动折叠重复选择器？

这是Chrome 90~94版本中关于:where()、:is()伪类的已知解析bug。

正常匹配逻辑 #

按照W3C选择器规范，你给出的CSS：

div :where(div p, .whatever) { color: red; }

等价于（仅特异性更低）：

div div p, div .whatever { color: red; }

只会选中两层及以上<div>嵌套下的<p>元素，也就是示例中的「text the second」段落。

该版本Chrome的异常原因 #

你测试的Chrome 92版本错误解析了:where()内部带后代组合器的选择器：它没有完整拼接div [后代] (div p)的完整选择器链，反而错误地仅取了内部选择器的最后一个单元p和前面的div拼接，最终把选择器解析成了div p，因此外层<div>下的第一个<p>也被命中，两段文本都变成红色。

这个解析bug在Chrome 95及之后的正式版本已经被修复，升级浏览器后即可得到符合规范的渲染结果。

内容的提问来源于stack exchange，提问作者Erics