mirrors/ladybird
1
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-04-20 11:36:10 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

LibWeb: Clamp grayscale, invert, filter and opacity filter values to 1

Browse source
This commit is contained in:
Tim Ledbetter 2025-04-04 13:28:48 +01:00 • committed by Sam Atkins
parent e5f21b2f9c
commit e73438e82c
Notes: github-actions[bot] 2025-04-04 16:13:46 +00:00
3 changed files with 18 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
Libraries/LibWeb/CSS/Parser/PropertyParsing.cpp
View file

@ -4432,6 +4432,12 @@ RefPtr<CSSStyleValue> Parser::parse_filter_value_list_value(TokenStream<Componen
return {};
if (amount->is_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 }) });
}

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

@ -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)'

12
Tests/LibWeb/Text/expected/wpt-import/css/filter-effects/parsing/filter-parsing-valid.txt
View file

@ -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