Libweb: Map `marquee` attributes to dimension properties

Tests/LibWeb/Text/expected/HTML/dimension-attributes.txt

@@ -1,3 +1,21 @@
 Test hr.width = "100" maps to width: 100px
 Test hr.width = " 00110 " maps to width: 110px
 Test hr.width = "120." maps to width: 120px
+Test marquee.hspace = "100" maps to marginLeft: 100px
+Test marquee.hspace = " 00110 " maps to marginLeft: 110px
+Test marquee.hspace = "120." maps to marginLeft: 120px
+Test marquee.hspace = "100" maps to marginRight: 100px
+Test marquee.hspace = " 00110 " maps to marginRight: 110px
+Test marquee.hspace = "120." maps to marginRight: 120px
+Test marquee.vspace = "100" maps to marginTop: 100px
+Test marquee.vspace = " 00110 " maps to marginTop: 110px
+Test marquee.vspace = "120." maps to marginTop: 120px
+Test marquee.vspace = "100" maps to marginBottom: 100px
+Test marquee.vspace = " 00110 " maps to marginBottom: 110px
+Test marquee.vspace = "120." maps to marginBottom: 120px
+Test marquee.width = "100" maps to width: 100px
+Test marquee.width = " 00110 " maps to width: 110px
+Test marquee.width = "120." maps to width: 120px
+Test marquee.height = "100" maps to height: 100px
+Test marquee.height = " 00110 " maps to height: 110px
+Test marquee.height = "120." maps to height: 120px

Tests/LibWeb/Text/input/HTML/dimension-attributes.html

@@ -4,6 +4,12 @@
     test(() => {
         const tests = [
             { elementName: "hr", attribute: "width", mappedProperty: "width" },
+            { elementName: "marquee", attribute: "hspace", mappedProperty: "marginLeft" },
+            { elementName: "marquee", attribute: "hspace", mappedProperty: "marginRight" },
+            { elementName: "marquee", attribute: "vspace", mappedProperty: "marginTop" },
+            { elementName: "marquee", attribute: "vspace", mappedProperty: "marginBottom" },
+            { elementName: "marquee", attribute: "width", mappedProperty: "width" },
+            { elementName: "marquee", attribute: "height", mappedProperty: "height" },
         ];
         const values = ["100", " 00110 ", "120."];
 

Userland/Libraries/LibWeb/HTML/HTMLMarqueeElement.cpp

@@ -39,6 +39,25 @@ void HTMLMarqueeElement::apply_presentational_hints(CSS::StyleProperties& style)
             auto color = parse_legacy_color_value(value);
             if (color.has_value())
                 style.set_property(CSS::PropertyID::BackgroundColor, CSS::CSSColorValue::create_from_color(color.value()));
+        } else if (name == HTML::AttributeNames::height) {
+            // https://html.spec.whatwg.org/multipage/rendering.html#the-marquee-element-2:maps-to-the-dimension-property
+            if (auto parsed_value = parse_dimension_value(value)) {
+                style.set_property(CSS::PropertyID::Height, *parsed_value);
+            }
+        } else if (name == HTML::AttributeNames::hspace) {
+            if (auto parsed_value = parse_dimension_value(value)) {
+                style.set_property(CSS::PropertyID::MarginLeft, *parsed_value);
+                style.set_property(CSS::PropertyID::MarginRight, *parsed_value);
+            }
+        } else if (name == HTML::AttributeNames::vspace) {
+            if (auto parsed_value = parse_dimension_value(value)) {
+                style.set_property(CSS::PropertyID::MarginTop, *parsed_value);
+                style.set_property(CSS::PropertyID::MarginBottom, *parsed_value);
+            }
+        } else if (name == HTML::AttributeNames::width) {
+            if (auto parsed_value = parse_dimension_value(value)) {
+                style.set_property(CSS::PropertyID::Width, *parsed_value);
+            }
         }
     });
 }