LibWeb: Allow having a linear-gradient() as a background-image

4 files changed, 11 insertions, 7 deletions

diff --git a/Userland/Libraries/LibWeb/CSS/ComputedValues.h b/Userland/Libraries/LibWeb/CSS/ComputedValues.h
index 5e5a8c4671..561c13dd18 100644
--- a/Userland/Libraries/LibWeb/CSS/ComputedValues.h
+++ b/Userland/Libraries/LibWeb/CSS/ComputedValues.h
@@ -60,7 +60,7 @@ public:
 };
 
 struct BackgroundLayerData {
-    RefPtr<CSS::ImageStyleValue> image { nullptr };
+    RefPtr<CSS::StyleValue> background_image { nullptr };
     CSS::BackgroundAttachment attachment { CSS::BackgroundAttachment::Scroll };
     CSS::BackgroundBox origin { CSS::BackgroundBox::PaddingBox };
     CSS::BackgroundBox clip { CSS::BackgroundBox::BorderBox };
diff --git a/Userland/Libraries/LibWeb/HTML/HTMLHtmlElement.cpp b/Userland/Libraries/LibWeb/HTML/HTMLHtmlElement.cpp
index db70fe4e33..179c4d0b9b 100644
--- a/Userland/Libraries/LibWeb/HTML/HTMLHtmlElement.cpp
+++ b/Userland/Libraries/LibWeb/HTML/HTMLHtmlElement.cpp
@@ -21,7 +21,7 @@ bool HTMLHtmlElement::should_use_body_background_properties() const
     auto const& background_layers = layout_node()->background_layers();
 
     for (auto& layer : background_layers) {
-        if (layer.image)
+        if (layer.background_image)
             return false;
     }
 
diff --git a/Userland/Libraries/LibWeb/Layout/Node.cpp b/Userland/Libraries/LibWeb/Layout/Node.cpp
index fc0b01b266..e255ba45ff 100644
--- a/Userland/Libraries/LibWeb/Layout/Node.cpp
+++ b/Userland/Libraries/LibWeb/Layout/Node.cpp
@@ -280,9 +280,13 @@ void NodeWithStyle::apply_style(const CSS::StyleProperties& computed_style)
         for (size_t layer_index = 0; layer_index < layer_count; layer_index++) {
             CSS::BackgroundLayerData layer;
 
-            if (auto image_value = value_for_layer(images, layer_index); image_value && image_value->is_image()) {
-                layer.image = image_value->as_image();
-                layer.image->load_bitmap(document());
+            if (auto image_value = value_for_layer(images, layer_index); image_value) {
+                if (image_value->is_image()) {
+                    image_value->as_image().load_bitmap(document());
+                    layer.background_image = image_value;
+                } else if (image_value->is_linear_gradient()) {
+                    layer.background_image = image_value;
+                }
             }
 
             if (auto attachment_value = value_for_layer(attachments, layer_index); attachment_value && attachment_value->has_identifier()) {
diff --git a/Userland/Libraries/LibWeb/Painting/BackgroundPainting.cpp b/Userland/Libraries/LibWeb/Painting/BackgroundPainting.cpp
index c2317ec65f..713b9044c3 100644
--- a/Userland/Libraries/LibWeb/Painting/BackgroundPainting.cpp
+++ b/Userland/Libraries/LibWeb/Painting/BackgroundPainting.cpp
@@ -60,7 +60,7 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet
         color_box = get_box(background_layers->last().clip);
 
     auto layer_is_paintable = [&](auto& layer) {
-        return layer.image && layer.image->bitmap();
+        return layer.background_image && layer.background_image->is_image() && layer.background_image->as_image().bitmap();
     };
 
     bool has_paintable_layers = false;
@@ -86,7 +86,6 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet
         if (!layer_is_paintable(layer))
             continue;
         Gfx::PainterStateSaver state { painter };
-        auto& image = *layer.image->bitmap();
 
         // Clip
         auto clip_box = get_box(layer.clip);
@@ -94,6 +93,7 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet
         painter.add_clip_rect(clip_rect);
         ScopedCornerRadiusClip corner_clip { painter, clip_rect, clip_box.radii };
 
+        auto& image = *layer.background_image->as_image().bitmap();
         Gfx::FloatRect background_positioning_area;
 
         // Attachment and Origin