LibWeb: Parse border-style correctly

3 files changed, 41 insertions, 13 deletions

diff --git a/Userland/Libraries/LibWeb/CSS/Parser/DeprecatedCSSParser.cpp b/Userland/Libraries/LibWeb/CSS/Parser/DeprecatedCSSParser.cpp
index f231f2a2b4..a007c6eb4a 100644
--- a/Userland/Libraries/LibWeb/CSS/Parser/DeprecatedCSSParser.cpp
+++ b/Userland/Libraries/LibWeb/CSS/Parser/DeprecatedCSSParser.cpp
@@ -285,23 +285,31 @@ RefPtr<CSS::ColorStyleValue> parse_color(const CSS::ParsingContext& context, con
     return nullptr;
 }
 
-RefPtr<CSS::StringStyleValue> parse_line_style(const CSS::ParsingContext& context, const StringView& part)
+RefPtr<CSS::IdentifierStyleValue> parse_line_style(const CSS::ParsingContext& context, const StringView& part)
 {
     auto parsed_value = parse_css_value(context, part);
-    if (!parsed_value || !parsed_value->is_string())
+    if (!parsed_value || parsed_value->type() != CSS::StyleValue::Type::Identifier)
         return nullptr;
-    auto value = static_ptr_cast<CSS::StringStyleValue>(parsed_value);
-    if (value->to_string() == "dotted")
+    auto value = static_ptr_cast<CSS::IdentifierStyleValue>(parsed_value);
+    if (value->id() == CSS::ValueID::Dotted)
         return value;
-    if (value->to_string() == "dashed")
+    if (value->id() == CSS::ValueID::Dashed)
         return value;
-    if (value->to_string() == "solid")
+    if (value->id() == CSS::ValueID::Solid)
         return value;
-    if (value->to_string() == "double")
+    if (value->id() == CSS::ValueID::Double)
         return value;
-    if (value->to_string() == "groove")
+    if (value->id() == CSS::ValueID::Groove)
         return value;
-    if (value->to_string() == "ridge")
+    if (value->id() == CSS::ValueID::Ridge)
+        return value;
+    if (value->id() == CSS::ValueID::None)
+        return value;
+    if (value->id() == CSS::ValueID::Hidden)
+        return value;
+    if (value->id() == CSS::ValueID::Inset)
+        return value;
+    if (value->id() == CSS::ValueID::Outset)
         return value;
     return nullptr;
 }
diff --git a/Userland/Libraries/LibWeb/CSS/Parser/DeprecatedCSSParser.h b/Userland/Libraries/LibWeb/CSS/Parser/DeprecatedCSSParser.h
index e03c83ba59..e47956f267 100644
--- a/Userland/Libraries/LibWeb/CSS/Parser/DeprecatedCSSParser.h
+++ b/Userland/Libraries/LibWeb/CSS/Parser/DeprecatedCSSParser.h
@@ -55,7 +55,7 @@ Optional<CSS::Selector> parse_selector(const CSS::ParsingContext&, const StringV
 
 RefPtr<CSS::LengthStyleValue> parse_line_width(const CSS::ParsingContext&, const StringView&);
 RefPtr<CSS::ColorStyleValue> parse_color(const CSS::ParsingContext&, const StringView&);
-RefPtr<CSS::StringStyleValue> parse_line_style(const CSS::ParsingContext&, const StringView&);
+RefPtr<CSS::IdentifierStyleValue> parse_line_style(const CSS::ParsingContext&, const StringView&);
 
 RefPtr<CSS::StyleValue> parse_html_length(const DOM::Document&, const StringView&);
 
diff --git a/Userland/Libraries/LibWeb/CSS/StyleResolver.cpp b/Userland/Libraries/LibWeb/CSS/StyleResolver.cpp
index fb090d345c..c101a1ad40 100644
--- a/Userland/Libraries/LibWeb/CSS/StyleResolver.cpp
+++ b/Userland/Libraries/LibWeb/CSS/StyleResolver.cpp
@@ -218,7 +218,7 @@ static inline void set_property_border_color(StyleProperties& style, const Style
 
 static inline void set_property_border_style(StyleProperties& style, const StyleValue& value, Edge edge)
 {
-    VERIFY(value.is_string());
+    VERIFY(value.type() == CSS::StyleValue::Type::Identifier);
     if (contains(Edge::Top, edge))
         style.set_property(CSS::PropertyID::BorderTopStyle, value);
     if (contains(Edge::Right, edge))
@@ -330,7 +330,7 @@ static void set_property_expanding_shorthands(StyleProperties& style, CSS::Prope
 
             RefPtr<LengthStyleValue> line_width_value;
             RefPtr<ColorStyleValue> color_value;
-            RefPtr<StringStyleValue> line_style_value;
+            RefPtr<IdentifierStyleValue> line_style_value;
 
             for (auto& part : parts) {
                 if (auto value = parse_line_width(context, part)) {
@@ -367,7 +367,18 @@ static void set_property_expanding_shorthands(StyleProperties& style, CSS::Prope
 
     if (property_id == CSS::PropertyID::BorderStyle) {
         auto parts = split_on_whitespace(value.to_string());
-        if (value.is_string() && parts.size() == 3) {
+        if (value.is_string() && parts.size() == 4) {
+            auto top = parse_css_value(context, parts[0]);
+            auto right = parse_css_value(context, parts[1]);
+            auto bottom = parse_css_value(context, parts[2]);
+            auto left = parse_css_value(context, parts[3]);
+            if (top && right && bottom && left) {
+                style.set_property(CSS::PropertyID::BorderTopStyle, *top);
+                style.set_property(CSS::PropertyID::BorderRightStyle, *right);
+                style.set_property(CSS::PropertyID::BorderBottomStyle, *bottom);
+                style.set_property(CSS::PropertyID::BorderLeftStyle, *left);
+            }
+        } else if (value.is_string() && parts.size() == 3) {
             auto top = parse_css_value(context, parts[0]);
             auto right = parse_css_value(context, parts[1]);
             auto bottom = parse_css_value(context, parts[2]);
@@ -378,6 +389,15 @@ static void set_property_expanding_shorthands(StyleProperties& style, CSS::Prope
                 style.set_property(CSS::PropertyID::BorderBottomStyle, *bottom);
                 style.set_property(CSS::PropertyID::BorderLeftStyle, *left);
             }
+        } else if (value.is_string() && parts.size() == 2) {
+            auto vertical = parse_css_value(context, parts[0]);
+            auto horizontal = parse_css_value(context, parts[1]);
+            if (vertical && horizontal) {
+                style.set_property(CSS::PropertyID::BorderTopStyle, *vertical);
+                style.set_property(CSS::PropertyID::BorderRightStyle, *horizontal);
+                style.set_property(CSS::PropertyID::BorderBottomStyle, *vertical);
+                style.set_property(CSS::PropertyID::BorderLeftStyle, *horizontal);
+            }
         } else {
             style.set_property(CSS::PropertyID::BorderTopStyle, value);
             style.set_property(CSS::PropertyID::BorderRightStyle, value);