RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-27 07:47:35 +00:00
Code Issues Activity Actions

LibWeb: Shift SVG paintable clip rectangle by scroll offset

Browse source 
Rectangles should be recorded using absolute coordinates, including
the scroll offset.
This commit is contained in:
Aliaksandr Kalenik 2024-02-06 11:14:32 +01:00 • committed by Andreas Kling
parent 677bcea771
commit d43dbe2842
3 changed files with 50 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

15
Tests/LibWeb/Ref/reference/svg-inside-scroll-container-ref.html Normal file
View file

@ -0,0 +1,15 @@
<!DOCTYPE html>
<style>
svg {
display: block;
}
</style>
<svg width="100" height="100">
<rect width="100" height="100" fill="green" />
</svg>
<svg width="100" height="100">
<rect width="100" height="100" fill="green" />
</svg>
<svg width="100" height="100">
<rect width="100" height="100" fill="green" />
</svg>

32
Tests/LibWeb/Ref/svg-inside-scroll-container.html Normal file
View file

@ -0,0 +1,32 @@
<!DOCTYPE html>
<link rel="match" href="reference/svg-inside-scroll-container-ref.html" />
<style>
#scrollable {
height: 300px;
overflow: scroll;
}
svg {
display: block;
}
</style>
<div id="scrollable">
<svg width="100" height="100">
<rect width="100" height="100" fill="green" />
</svg>
<svg width="100" height="100">
<rect width="100" height="100" fill="green" />
</svg>
<svg width="100" height="100">
<rect width="100" height="100" fill="green" />
</svg>
<svg width="100" height="100">
<rect width="100" height="100" fill="green" />
</svg>
<svg width="100" height="100">
<rect width="100" height="100" fill="green" />
</svg>
</div>
<script>
const scrollContainer = document.getElementById("scrollable");
scrollContainer.scrollTop = 100;
</script>

4
Userland/Libraries/LibWeb/Painting/SVGSVGPaintable.cpp
View file

@ -30,7 +30,9 @@ void SVGSVGPaintable::before_children_paint(PaintContext& context, PaintPhase ph
if (phase != PaintPhase::Foreground)
return;
context.recording_painter().save();
context.recording_painter().add_clip_rect(context.enclosing_device_rect(absolute_rect()).to_type<int>());
auto clip_rect = absolute_rect();
clip_rect.translate_by(enclosing_scroll_frame_offset().value_or({}));
context.recording_painter().add_clip_rect(context.enclosing_device_rect(clip_rect).to_type<int>());
}
void SVGSVGPaintable::after_children_paint(PaintContext& context, PaintPhase phase) const