LibWeb: Allow <svg> to establish a stacking context

83b6bc4 went too far by forbidding SVGSVGElement from establishing a
stacking context. This element type does follow the behavior of CSS
boxes, unlike inner SVG elements like `<rect>`, `<circle>`, etc., which
are not supposed to be aware of concepts like stacking contexts,
overflow clipping, scroll offsets, etc.

This change allows us to delete overrides of `before_paint()` and
`after_paint()` in SVGPaintable and SVGSVGPaintable, because display
list recording code has been rearranged to take care of clipping and
scrolling before recursing into SVGSVGPaintable descendants.

`Screenshot/images/css-transform-box-ref.png` expectation is updated and
fixes a bug where a rectangle at the very bottom of the page was not
clipped correctly.
`Screenshot/images/svg-filters-lb-website-ref.png` has a more subtle
difference, but if you look closely, you’ll see it matches other
browsers more closely now.
This commit is contained in:
Aliaksandr Kalenik 2025-07-12 00:17:38 +02:00 committed by Jelle Raaijmakers
commit 910fd426a2
Notes: github-actions[bot] 2025-07-12 09:02:17 +00:00
10 changed files with 87 additions and 60 deletions

View file

@ -0,0 +1,32 @@
<!DOCTYPE html>
<style>
#container {
display: flow-root;
position: relative;
width: 200px;
background: #ffffe0;
}
#overlay {
position: absolute;
top: 0;
left: 0;
width: 200px;
height: 40px;
background: crimson;
z-index: 0;
}
#sc {
width: 100px;
height: 100px;
margin-top: 30px;
position: relative;
z-index: 1;
background: lightgreen;
}
</style>
<div id="container">
<div id="overlay"></div>
<div id="sc"></div>
</div>