diff --git a/Libraries/LibWeb/CSS/Parser/PropertyParsing.cpp b/Libraries/LibWeb/CSS/Parser/PropertyParsing.cpp index 14595851dcc..e72e741ef61 100644 --- a/Libraries/LibWeb/CSS/Parser/PropertyParsing.cpp +++ b/Libraries/LibWeb/CSS/Parser/PropertyParsing.cpp @@ -4432,6 +4432,12 @@ RefPtr Parser::parse_filter_value_list_value(TokenStreamis_number() && amount->number().value() < 0) return {}; + if (first_is_one_of(filter_token, FilterToken::Grayscale, FilterToken::Invert, FilterToken::Opacity, FilterToken::Sepia)) { + if (amount->is_percentage() && amount->percentage().value() > 100) + amount = Percentage { 100 }; + if (amount->is_number() && amount->number().value() > 1) + amount = Number { Number::Type::Integer, 1.0 }; + } } return if_no_more_tokens_return(FilterOperation::Color { filter_token_to_operation(filter_token), amount.value_or(Number { Number::Type::Integer, 1 }) }); } diff --git a/Tests/LibWeb/Text/expected/wpt-import/css/filter-effects/parsing/filter-computed.txt b/Tests/LibWeb/Text/expected/wpt-import/css/filter-effects/parsing/filter-computed.txt index e3a4fbc47e9..eb035c5d33a 100644 --- a/Tests/LibWeb/Text/expected/wpt-import/css/filter-effects/parsing/filter-computed.txt +++ b/Tests/LibWeb/Text/expected/wpt-import/css/filter-effects/parsing/filter-computed.txt @@ -2,8 +2,8 @@ Harness status: OK Found 34 tests -18 Pass -16 Fail +22 Pass +12 Fail Pass Property filter value 'none' Pass Property filter value 'blur(100px)' Pass Property filter value 'blur()' @@ -17,24 +17,24 @@ 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)' +Pass Property filter value 'grayscale(2)' Fail Property filter value 'grayscale(calc(2))' Pass Property filter value 'grayscale()' Fail Property filter value 'hue-rotate(90deg)' Pass Property filter value 'hue-rotate()' Pass Property filter value 'invert(0)' Fail Property filter value 'invert(100%)' -Fail Property filter value 'invert(2)' +Pass Property filter value 'invert(2)' Pass Property filter value 'invert()' Pass Property filter value 'opacity(0)' Fail Property filter value 'opacity(100%)' -Fail Property filter value 'opacity(2)' +Pass Property filter value 'opacity(2)' Pass Property filter value 'opacity()' Pass Property filter value 'saturate(0)' Fail Property filter value 'saturate(300%)' Pass Property filter value 'saturate()' Pass Property filter value 'sepia(0)' Fail Property filter value 'sepia(100%)' -Fail Property filter value 'sepia(2)' +Pass Property filter value 'sepia(2)' Pass Property filter value 'sepia()' Fail Property filter value 'blur(10px) url("https://www.example.com/picture.svg#f") contrast(20) brightness(30)' \ No newline at end of file diff --git a/Tests/LibWeb/Text/expected/wpt-import/css/filter-effects/parsing/filter-parsing-valid.txt b/Tests/LibWeb/Text/expected/wpt-import/css/filter-effects/parsing/filter-parsing-valid.txt index 88a86a4b900..3ba423c03ad 100644 --- a/Tests/LibWeb/Text/expected/wpt-import/css/filter-effects/parsing/filter-parsing-valid.txt +++ b/Tests/LibWeb/Text/expected/wpt-import/css/filter-effects/parsing/filter-parsing-valid.txt @@ -2,8 +2,8 @@ Harness status: OK Found 39 tests -31 Pass -8 Fail +35 Pass +4 Fail Pass e.style['filter'] = "none" should set the property value Pass e.style['filter'] = "blur(100px)" should set the property value Pass e.style['filter'] = "blur(0)" should set the property value @@ -21,7 +21,7 @@ Pass e.style['filter'] = "drop-shadow(rgb(4, 5, 6) 1px 2px)" should set the prop Pass e.style['filter'] = "drop-shadow(1px 2px rgb(4, 5, 6))" should set the property value Pass e.style['filter'] = "drop-shadow(rgba(4, 5, 6, 0.75) 1px 2px 3px)" should set the property value Pass e.style['filter'] = "grayscale(0)" should set the property value -Fail e.style['filter'] = "grayscale(300%)" should set the property value +Pass e.style['filter'] = "grayscale(300%)" should set the property value Pass e.style['filter'] = "grayscale(calc(300%))" should set the property value Pass e.style['filter'] = "grayscale(calc(101% * sign(1em - 1px)))" should set the property value Pass e.style['filter'] = "grayscale()" should set the property value @@ -29,16 +29,16 @@ Fail e.style['filter'] = "hue-rotate(90deg)" should set the property value Pass e.style['filter'] = "hue-rotate(0)" should set the property value Pass e.style['filter'] = "hue-rotate()" should set the property value Pass e.style['filter'] = "invert(0)" should set the property value -Fail e.style['filter'] = "invert(300%)" should set the property value +Pass e.style['filter'] = "invert(300%)" should set the property value Pass e.style['filter'] = "invert()" should set the property value Pass e.style['filter'] = "opacity(0)" should set the property value -Fail e.style['filter'] = "opacity(300%)" should set the property value +Pass e.style['filter'] = "opacity(300%)" should set the property value Pass e.style['filter'] = "opacity()" should set the property value Pass e.style['filter'] = "saturate(0)" should set the property value Pass e.style['filter'] = "saturate(300%)" should set the property value Pass e.style['filter'] = "saturate()" should set the property value Pass e.style['filter'] = "sepia(0)" should set the property value -Fail e.style['filter'] = "sepia(300%)" should set the property value +Pass e.style['filter'] = "sepia(300%)" should set the property value Pass e.style['filter'] = "sepia()" should set the property value Fail e.style['filter'] = "url(picture.svg#f)" should set the property value Fail e.style['filter'] = "url(\"https://www.example.com/picture.svg#f\")" should set the property value