From 20de69693b109ab267305b5603963566778c9c02 Mon Sep 17 00:00:00 2001 From: Aliaksandr Kalenik Date: Mon, 29 Jan 2024 03:27:38 +0100 Subject: [PATCH] LibWeb: Fix hidden overflow clipping with nested CSS transforms This is a fix for regression introduced in 0bf82f748f44c961eb03c76a97620783fef69a32 All CSS transforms need to be removed from the clip rectangle before applying it. However, it is still necessary to calculate it with applied transforms to find the correct intersection of all clip rectangles in the containing block chain. --- Tests/LibWeb/Ref/overflow-hidden-6.html | 76 +++++++++++++++++++ .../Ref/reference/overflow-hidden-6-ref.html | 11 +++ .../LibWeb/Painting/PaintableBox.cpp | 8 +- 3 files changed, 90 insertions(+), 5 deletions(-) create mode 100644 Tests/LibWeb/Ref/overflow-hidden-6.html create mode 100644 Tests/LibWeb/Ref/reference/overflow-hidden-6-ref.html diff --git a/Tests/LibWeb/Ref/overflow-hidden-6.html b/Tests/LibWeb/Ref/overflow-hidden-6.html new file mode 100644 index 0000000000..174b5eb65d --- /dev/null +++ b/Tests/LibWeb/Ref/overflow-hidden-6.html @@ -0,0 +1,76 @@ + + + + +
+
+
+
+
+
+
+
+
+
+
diff --git a/Tests/LibWeb/Ref/reference/overflow-hidden-6-ref.html b/Tests/LibWeb/Ref/reference/overflow-hidden-6-ref.html new file mode 100644 index 0000000000..4bd36e8631 --- /dev/null +++ b/Tests/LibWeb/Ref/reference/overflow-hidden-6-ref.html @@ -0,0 +1,11 @@ + + + + +
diff --git a/Userland/Libraries/LibWeb/Painting/PaintableBox.cpp b/Userland/Libraries/LibWeb/Painting/PaintableBox.cpp index 3847717b70..04504fa47c 100644 --- a/Userland/Libraries/LibWeb/Painting/PaintableBox.cpp +++ b/Userland/Libraries/LibWeb/Painting/PaintableBox.cpp @@ -399,12 +399,10 @@ void PaintableBox::apply_clip_overflow_rect(PaintContext& context, PaintPhase ph for (auto const* ancestor = &this->layout_box(); ancestor; ancestor = ancestor->containing_block()) { auto affine_transform = Gfx::extract_2d_affine_transform(ancestor->paintable_box()->transform()); if (!affine_transform.is_identity()) { - // NOTE: Because the painting command executor applies CSS transform of the nearest stacking context - // and the m_clip_rect is determined considering CSS transforms, here transform of the nearest - // stacking context need to be compensated. - // This adjustment ensures the transform is accounted for just once. + // NOTE: Since the painting command executor applies a CSS transform and the clip rect is calculated + // with this transform in account, we need to remove the transform from the clip rect. + // Otherwise, the transform will be applied twice to the clip rect. overflow_clip_rect.translate_by(-affine_transform.translation().to_type()); - break; } }