Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
  • Loading branch information
anttijk authored and marcoscaceres committed Feb 23, 2024
1 parent 8d86e4f commit 71f528c
Showing 1 changed file with 19 additions and 0 deletions.
19 changes: 19 additions & 0 deletions css/css-contain/container-queries/container-name-tree-scoped.html
Original file line number Diff line number Diff line change
Expand Up @@ -52,6 +52,21 @@
#t2 { color: red; }
}
</style>

<div id="container-name-host-inner-container-rule">
<div id="t3host">
<template shadowrootmode="open">
<style>
:host { container-name: foo; }
#t3 { color: red; }
@container foo (width > 0px) {
#t3 { color: green; }
}
</style>
<div id="t3"></div>
</template>
</div>
</div>
</div>

<script>
Expand All @@ -70,4 +85,8 @@
assert_equals(getComputedStyle(t2).color, green);
}, "Outer scope query should not match container-name set by ::slotted rule in shadow tree");

test(() => {
assert_equals(getComputedStyle(t3host.shadowRoot.querySelector('#t3')).color, green);
}, "Inner scope query should match container-name set by :host rule in shadow tree");

</script>

0 comments on commit 71f528c

Please sign in to comment.