[selectors] :visited and ::backdrop #8240

Loirooriol · 2022-12-16T15:05:45Z

https://software.hixie.ch/utilities/js/live-dom-viewer/saved/11114

<!DOCTYPE html>
<style>
dialog, dialog::backdrop {
  border: solid red;
}
:visited dialog, :visited dialog::backdrop {
  border-color: green;
}
</style>
<a href=""><dialog></dialog></a>
<script>
document.querySelector("dialog").showModal();
</script>

https://drafts.csswg.org/selectors-4/#visited-pseudo
https://fullscreen.spec.whatwg.org/#::backdrop-pseudo-element
https://drafts.csswg.org/css-position-4/#backdrop

I expected that both the dialog and the backdrop would have a green border.
However, the backdrop gets a red border in Gecko, Blink and WebKit.
Seems like a bug to me, but there is interoperability.

The top layer has been added to the CSS spec, and this patch moves the top layer references from the fullscreen spec to the CSS spec and uses new algorithms to add and remove from the top layer defined in the CSS spec. Moving the top layer to the CSS spec has been discussed in these issues: w3c/csswg-drafts#4998 w3c/csswg-drafts#6939 w3c/csswg-drafts#7845 w3c/csswg-drafts#8240

This change moves the top layer references from Fullscreen to CSS and uses the new algorithms to add and remove from the top layer. Moving the top layer concept to CSS has been discussed in these issues: * w3c/csswg-drafts#4998 * w3c/csswg-drafts#6939 * w3c/csswg-drafts#7845 * w3c/csswg-drafts#8240 Tests: web-platform-tests/wpt#39828.

Loirooriol · 2023-11-06T17:09:10Z

Fixed in Firefox as a side-effect of https://bugzilla.mozilla.org/show_bug.cgi?id=1855668
Fixed in Blink as a side-effect of https://chromium-review.googlesource.com/c/chromium/src/+/4295376 (it used to also work in the past, broke in https://chromium-review.googlesource.com/c/chromium/src/+/2476214)

Loirooriol added the selectors-3 label Dec 16, 2022

annevk mentioned this issue Dec 21, 2022

The Popover API (previously Popup) w3ctag/design-reviews#743

Closed

1 task

josepharhar mentioned this issue Mar 30, 2023

Use CSS spec for top layer whatwg/html#9093

Merged

4 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[selectors] :visited and ::backdrop #8240

[selectors] :visited and ::backdrop #8240

Loirooriol commented Dec 16, 2022 •

edited

Loading

This comment was marked as spam.

This comment was marked as spam.

Loirooriol commented Nov 6, 2023 •

edited

Loading

[selectors] :visited and ::backdrop #8240

[selectors] :visited and ::backdrop #8240

Comments

Loirooriol commented Dec 16, 2022 • edited Loading

This comment was marked as spam.

This comment was marked as spam.

Loirooriol commented Nov 6, 2023 • edited Loading

Loirooriol commented Dec 16, 2022 •

edited

Loading

Loirooriol commented Nov 6, 2023 •

edited

Loading