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

LibWeb: Ignore fragments with pointer-events: none in hit-testing

Browse source
This commit is contained in:
Jelle Raaijmakers 2025-01-31 11:17:46 +01:00 • committed by Andreas Kling
commit f204970052
Notes: github-actions[bot] 2025-01-31 12:38:07 +00:00
3 changed files with 9 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

2
Libraries/LibWeb/Painting/PaintableBox.cpp
View file

@ -1060,7 +1060,7 @@ TraversalDecision PaintableWithLines::hit_test(CSSPixelPoint position, HitTestTy
return TraversalDecision::Continue; return TraversalDecision::Continue;
for (auto const& fragment : fragments()) { for (auto const& fragment : fragments()) {
if (fragment.paintable().has_stacking_context()) if (fragment.paintable().has_stacking_context() || !fragment.paintable().visible_for_hit_testing())
continue; continue;
auto fragment_absolute_rect = fragment.absolute_rect(); auto fragment_absolute_rect = fragment.absolute_rect();
if (fragment_absolute_rect.contains(transformed_position_adjusted_by_scroll_offset)) { if (fragment_absolute_rect.contains(transformed_position_adjusted_by_scroll_offset)) {

3
Tests/LibWeb/Text/expected/hit_testing/pointer-events.txt
View file

@ -13,3 +13,6 @@
<DIV id="e2"> <DIV id="e2">
<BODY> <BODY>
--- ---
<A id="f1">
<BODY>
---

4
Tests/LibWeb/Text/input/hit_testing/pointer-events.html
View file

@ -23,6 +23,9 @@
<!-- div creates its own stacking context, #e2 must be hit instead of crashing --> <!-- div creates its own stacking context, #e2 must be hit instead of crashing -->
<div id="e1" style="position: fixed; width: 100px; height: 100px; pointer-events: none; background-color: red"></div> <div id="e1" style="position: fixed; width: 100px; height: 100px; pointer-events: none; background-color: red"></div>
<div id="e2" style="width: 100px; height: 100px; background-color: green"></div> <div id="e2" style="width: 100px; height: 100px; background-color: green"></div>
<!-- #f1 must be hit instead of #f2 -->
<a id="f1"><img id="f2" style="height: 30px; width: 30px; pointer-events: none"></a>
</body> </body>
<script> <script>
test(() => { test(() => {
@ -38,5 +41,6 @@
printHit(c1.offsetLeft + 50, c1.offsetTop + 50); printHit(c1.offsetLeft + 50, c1.offsetTop + 50);
printHit(d4.offsetLeft + 10, d4.offsetTop + 8); printHit(d4.offsetLeft + 10, d4.offsetTop + 8);
printHit(e1.offsetLeft + 50, e1.offsetTop + 50); printHit(e1.offsetLeft + 50, e1.offsetTop + 50);
printHit(f1.offsetLeft + 15, f1.offsetTop + 15);
}); });
</script> </script>