backdrop-tree-abiding-slotted.html (953B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <title>CSS Position Test: ::backdrop is tree abiding, allowed after ::slotted</title> 4 <link rel="help" href="https://drafts.csswg.org/css-position-4/#backdrop"> 5 <link rel="help" href="https://drafts.csswg.org/css-pseudo-4/#tree-abiding"> 6 <link rel="help" href="https://drafts.csswg.org/css-scoping/#slotted-pseudo"> 7 <script src="/resources/testharness.js"></script> 8 <script src="/resources/testharnessreport.js"></script> 9 <div> 10 <template shadowrootmode="open"> 11 <style> 12 ::slotted(dialog)::backdrop { 13 background-color: green; 14 } 15 </style> 16 <slot></slot> 17 </template> 18 <dialog id="target"></dialog> 19 </div> 20 <script> 21 const target = document.getElementById("target"); 22 target.showModal(); 23 24 test(() => { 25 assert_equals(getComputedStyle(target, "::backdrop").backgroundColor, "rgb(0, 128, 0)"); 26 }, "::backdrop is tree-abiding and should be allowed after ::slotted()"); 27 </script>