LibWeb: Set color filter value to 1 if omitted

Author: https://github.com/tcl3
Commit: 61f76c7ec5
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/4222
Reviewed-by: https://github.com/AtkinsSJ ✅

Libraries/LibWeb/CSS/Parser/PropertyParsing.cpp

@@ -4433,7 +4433,7 @@ RefPtr<CSSStyleValue> Parser::parse_filter_value_list_value(TokenStream<Componen
                 if (amount->is_number() && amount->number().value() < 0)
                     return {};
             }
-            return if_no_more_tokens_return(FilterOperation::Color { filter_token_to_operation(filter_token), amount });
+            return if_no_more_tokens_return(FilterOperation::Color { filter_token_to_operation(filter_token), amount.value_or(Number { Number::Type::Integer, 1 }) });
         }
     };
 

Libraries/LibWeb/CSS/StyleValues/FilterValueListStyleValue.cpp

@@ -32,23 +32,19 @@ float FilterOperation::HueRotate::angle_degrees(Layout::Node const& node) const
 
 float FilterOperation::Color::resolved_amount() const
 {
-    // Default value when omitted is 1.
+    if (amount.is_number())
-    if (!amount.has_value())
+        return amount.number().value();
-        return 1;
 
-    if (amount->is_number())
+    if (amount.is_percentage())
-        return amount->number().value();
+        return amount.percentage().as_fraction();
 
-    if (amount->is_percentage())
+    if (amount.is_calculated()) {
-        return amount->percentage().as_fraction();
-
-    if (amount->is_calculated()) {
         CalculationResolutionContext context {};
-        if (amount->calculated()->resolves_to_number())
+        if (amount.calculated()->resolves_to_number())
-            return amount->calculated()->resolve_number(context).value();
+            return amount.calculated()->resolve_number(context).value();
 
-        if (amount->calculated()->resolves_to_percentage())
+        if (amount.calculated()->resolves_to_percentage())
-            return amount->calculated()->resolve_percentage(context)->as_fraction();
+            return amount.calculated()->resolve_percentage(context)->as_fraction();
     }
 
     VERIFY_NOT_REACHED();
@@ -111,8 +107,8 @@ String FilterValueListStyleValue::to_string(SerializationMode) const
                             VERIFY_NOT_REACHED();
                         }
                     }());
-                if (color.amount.has_value())
+
-                    builder.append(color.amount->to_string());
+                builder.append(color.amount.to_string());
             });
         builder.append(')');
         first = false;

Libraries/LibWeb/CSS/StyleValues/FilterValueListStyleValue.h

@@ -46,7 +46,7 @@ struct HueRotate {
 
 struct Color {
     Gfx::ColorFilter::Type operation;
-    Optional<NumberPercentage> amount {};
+    NumberPercentage amount { Number { Number::Type::Integer, 1.0 } };
     float resolved_amount() const;
     bool operator==(Color const&) const = default;
 };

Tests/LibWeb/Text/expected/wpt-import/css/filter-effects/parsing/filter-computed.txt

@@ -2,39 +2,39 @@ Harness status: OK
 
 Found 34 tests
 
-9 Pass
+16 Pass
-25 Fail
+18 Fail
 Pass	Property filter value 'none'
 Pass	Property filter value 'blur(100px)'
 Fail	Property filter value 'blur()'
 Pass	Property filter value 'brightness(0)'
 Fail	Property filter value 'brightness(300%)'
-Fail	Property filter value 'brightness()'
+Pass	Property filter value 'brightness()'
 Pass	Property filter value 'contrast(0)'
 Fail	Property filter value 'contrast(300%)'
-Fail	Property filter value 'contrast()'
+Pass	Property filter value 'contrast()'
 Fail	Property filter value 'drop-shadow(1px 2px)'
 Pass	Property filter value 'drop-shadow(rgb(4, 5, 6) 1px 2px 0px)'
 Fail	Property filter value 'grayscale(50%)'
 Fail	Property filter value 'grayscale(calc(50%))'
 Fail	Property filter value 'grayscale(2)'
 Fail	Property filter value 'grayscale(calc(2))'
-Fail	Property filter value 'grayscale()'
+Pass	Property filter value 'grayscale()'
 Fail	Property filter value 'hue-rotate(90deg)'
 Fail	Property filter value 'hue-rotate()'
 Pass	Property filter value 'invert(0)'
 Fail	Property filter value 'invert(100%)'
 Fail	Property filter value 'invert(2)'
-Fail	Property filter value 'invert()'
+Pass	Property filter value 'invert()'
 Pass	Property filter value 'opacity(0)'
 Fail	Property filter value 'opacity(100%)'
 Fail	Property filter value 'opacity(2)'
-Fail	Property filter value 'opacity()'
+Pass	Property filter value 'opacity()'
 Pass	Property filter value 'saturate(0)'
 Fail	Property filter value 'saturate(300%)'
-Fail	Property filter value 'saturate()'
+Pass	Property filter value 'saturate()'
 Pass	Property filter value 'sepia(0)'
 Fail	Property filter value 'sepia(100%)'
 Fail	Property filter value 'sepia(2)'
-Fail	Property filter value 'sepia()'
+Pass	Property filter value 'sepia()'
 Fail	Property filter value 'blur(10px) url("https://www.example.com/picture.svg#f") contrast(20) brightness(30)'