mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-07-03 07:32:00 +00:00
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.
23 lines
573 B
HTML
23 lines
573 B
HTML
<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>
|