Google Chrome 59.0.3043.0 (Official Build) canary (64-bit)
Revision fe785a58e31217e1ef0e1c8946a4e853829371f8-refs/heads/master@{#457297}
OS Mac OS X
bool HTMLElement::matchesReadWritePseudoClass() const {
if (fastHasAttribute(contenteditableAttr)) {
...
}
return parentElement() && hasEditableStyle(*parentElement());
}
There's two problems in this code:
1) It's using parentElement() instead of the composed tree to look up style of an ancestor, which is wrong for shadow dom.
2) This is using hasEditableStyle inside selector matching to figure out if the pseudos match, but that violates the requirement that selectors must not use style information as that's a backwards data flow in the system:
Selectors -> Style -> Rebuild layout tree -> Compute geometry.
Indeed this produces very strange behavior, for example:
<script>
var e = document.createElement("div");
document.body.appendChild(e);
document.body.style.webkitUserModify = "read-write";
console.log(document.querySelector(":read-write")); // prints null
e.offsetTop;
console.log(document.querySelector(":read-write")); // prints <div>
</script>
Where computing style changes which selectors match.
Firefox implements these selectors too, but does not consult the style when matching the pseudo classes.
Comment 1 by tkent@chromium.org
, Mar 17 2017