LibWeb: Clip overflowing inline children when overflow != "visible"

We now apply a paint-time clip to the padding rect of a BlockBox before
painting its inline-level children. This covers some of the behavior
we want from "overflow: hidden" etc but is far from a complete solution.

2 files changed, 17 insertions, 0 deletions

diff --git a/Userland/Libraries/LibWeb/Layout/BlockBox.cpp b/Userland/Libraries/LibWeb/Layout/BlockBox.cpp
index 59584ada80..c0a05cae33 100644
--- a/Userland/Libraries/LibWeb/Layout/BlockBox.cpp
+++ b/Userland/Libraries/LibWeb/Layout/BlockBox.cpp
@@ -49,6 +49,11 @@ BlockBox::~BlockBox()
 {
 }
 
+bool BlockBox::should_clip_overflow() const
+{
+    return computed_values().overflow_x() != CSS::Overflow::Visible && computed_values().overflow_y() != CSS::Overflow::Visible;
+}
+
 void BlockBox::paint(PaintContext& context, PaintPhase phase)
 {
     if (!is_visible())
@@ -59,6 +64,12 @@ void BlockBox::paint(PaintContext& context, PaintPhase phase)
     if (!children_are_inline())
         return;
 
+    if (should_clip_overflow()) {
+        context.painter().save();
+        // FIXME: Handle overflow-x and overflow-y being different values.
+        context.painter().add_clip_rect(enclosing_int_rect(padded_rect()));
+    }
+
     for (auto& line_box : m_line_boxes) {
         for (auto& fragment : line_box.fragments()) {
             if (context.should_show_line_box_borders())
@@ -67,6 +78,10 @@ void BlockBox::paint(PaintContext& context, PaintPhase phase)
         }
     }
 
+    if (should_clip_overflow()) {
+        context.painter().restore();
+    }
+
     // FIXME: Merge this loop with the above somehow..
     if (phase == PaintPhase::FocusOutline) {
         for (auto& line_box : m_line_boxes) {
diff --git a/Userland/Libraries/LibWeb/Layout/BlockBox.h b/Userland/Libraries/LibWeb/Layout/BlockBox.h
index 48639ed557..d2ffbb8a88 100644
--- a/Userland/Libraries/LibWeb/Layout/BlockBox.h
+++ b/Userland/Libraries/LibWeb/Layout/BlockBox.h
@@ -55,6 +55,8 @@ public:
 
 private:
     virtual bool is_block_box() const final { return true; }
+
+    bool should_clip_overflow() const;
 };
 
 template<>