mirrors/ladybird
0
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-08-07 00:29:15 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

LibWeb: Make CSS :hover selector match shadow-inclusive ancestors

Browse source 
Before this change, :hover wouldn't match anything outside the shadow
boundary when hovering elements inside a shadow tree. This was most
noticeable when hovering the text inside an input element and hover
styles disappearing from the hosting input element itself.
This commit is contained in:
Andreas Kling 2024-08-25 10:14:24 +02:00 • committed by Andreas Kling
commit 84ab8bf797
Notes: github-actions[bot] 2024-08-25 10:53:57 +00:00
3 changed files with 25 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

1
Tests/LibWeb/Text/expected/ShadowDOM/css-hover-shadow-dom.txt Normal file
View file

@ -0,0 +1 @@
hovered bg: rgb(0, 128, 0)

23
Tests/LibWeb/Text/input/ShadowDOM/css-hover-shadow-dom.html Normal file
View file

@ -0,0 +1,23 @@
<style>
#myShadowHost:hover {
background: green;
}
#myShadowHost {
position: absolute;
width: 100px;
height: 100px;
}
</style>
<body><div id="myShadowHost"><template shadowrootmode="open"><div>hover me</div></template></div></body>
<script src="../include.js"></script>
<script>
test(() => {
if (window.internals && window.internals.movePointerTo)
internals.movePointerTo(50, 50);
let s = getComputedStyle(myShadowHost);
println("hovered bg: " + s.backgroundColor);
myShadowHost.remove();
});
</script>

2
Userland/Libraries/LibWeb/CSS/SelectorEngine.cpp
View file

@ -147,7 +147,7 @@ static inline bool matches_hover_pseudo_class(DOM::Element const& element)
return false; return false;
if (&element == hovered_node) if (&element == hovered_node)
return true; return true;
return element.is_ancestor_of(*hovered_node); return element.is_shadow_including_ancestor_of(*hovered_node);
} }
// https://html.spec.whatwg.org/multipage/semantics-other.html#selector-checked // https://html.spec.whatwg.org/multipage/semantics-other.html#selector-checked