mirrors/ladybird
0
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-09-21 08:48:57 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

LibWeb: Don't resolve calc'd opacity percentages at parse time

Browse source 
This behaviour should only apply to literal percentages as clarified
here: 4ee8429

We were also doing this wrong by converting the numeric type of the calc
to Length which was causing values to be defaulted to 1 instead (hence
the new passing tests for computed values as well)
This commit is contained in:
Callum Law 2025-09-07 23:32:06 +12:00 • committed by Tim Ledbetter
commit 246a1c41ff
Notes: github-actions[bot] 2025-09-08 10:07:16 +00:00
6 changed files with 29 additions and 42 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -3844,15 +3844,6 @@ RefPtr<StyleValue const> Parser::parse_opacity_value(PropertyID property_id, Tok
// Percentages map to the range [0,1] for opacity values
if (value->is_percentage())
value = NumberStyleValue::create(value->as_percentage().percentage().as_fraction());
if (value->is_calculated() && value->as_calculated().resolves_to_percentage()) {
auto maybe_percentage = value->as_calculated().resolve_percentage_deprecated({});
if (maybe_percentage.has_value()) {
auto resolved_percentage = maybe_percentage->as_fraction();
CalculationContext context {};
auto calc_node = NumericCalculationNode::create(Number { Number::Type::Number, resolved_percentage }, context);
value = CalculatedStyleValue::create(move(calc_node), NumericType { NumericType::BaseType::Length, 1 }, context);
}
}
return value;
}

4
Tests/LibWeb/Text/expected/css/calc-coverage.txt
View file

@ -138,8 +138,8 @@ ry: 'calc(2%)' -> '2%'
ry: 'calc(2% * var(--n))' -> '4%'
stop-opacity: 'calc(2)' -> '1'
stop-opacity: 'calc(2 * var(--n))' -> '1'
stroke-opacity: 'calc(2%)' -> '1'
stroke-opacity: 'calc(2% * var(--n))' -> '1'
stroke-opacity: 'calc(2%)' -> '0.02'
stroke-opacity: 'calc(2% * var(--n))' -> '0.04'
stroke-width: 'calc(2px)' -> '2px'
stroke-width: 'calc(2px * var(--n))' -> '4px'
tab-size: 'calc(2px)' -> '2px'

23
Tests/LibWeb/Text/expected/wpt-import/css/css-color/parsing/opacity-computed.txt
View file

@ -2,8 +2,7 @@ Harness status: OK
Found 30 tests
20 Pass
10 Fail
30 Pass
Pass Property opacity value '1'
Pass Property opacity value '0.5'
Pass Property opacity value '0'
@ -12,20 +11,20 @@ Pass Property opacity value '3'
Pass Property opacity value '-100%'
Pass Property opacity value '50%'
Pass Property opacity value '300%'
Fail Property opacity value 'calc(-50% - 50%)'
Fail Property opacity value 'calc(25% * 2)'
Pass Property opacity value 'calc(-50% - 50%)'
Pass Property opacity value 'calc(25% * 2)'
Pass Property opacity value 'calc(100% + 100%)'
Pass Property opacity value 'calc(-0.5 - 0.5)'
Pass Property opacity value 'calc(0.25 * 2)'
Pass Property opacity value 'calc(1 + 1)'
Fail Property opacity value 'clamp(50%, 0%, 70%)'
Fail Property opacity value 'clamp(50%, 80%, 70%)'
Fail Property opacity value 'clamp(50%, 60%, 70%)'
Fail Property opacity value 'min(50%, 0%)'
Fail Property opacity value 'min(0%, 50%)'
Fail Property opacity value 'max(50%, 0%)'
Fail Property opacity value 'max(0%, 50%)'
Fail Property opacity value 'min(-40%, 50%)'
Pass Property opacity value 'clamp(50%, 0%, 70%)'
Pass Property opacity value 'clamp(50%, 80%, 70%)'
Pass Property opacity value 'clamp(50%, 60%, 70%)'
Pass Property opacity value 'min(50%, 0%)'
Pass Property opacity value 'min(0%, 50%)'
Pass Property opacity value 'max(50%, 0%)'
Pass Property opacity value 'max(0%, 50%)'
Pass Property opacity value 'min(-40%, 50%)'
Pass Property opacity value 'clamp(0.5, 0, 0.7)'
Pass Property opacity value 'clamp(0.5, 0.8, 0.7)'
Pass Property opacity value 'clamp(0.5, 0.6, 0.7)'

25
Tests/LibWeb/Text/expected/wpt-import/css/css-color/parsing/opacity-valid.txt
View file

@ -2,8 +2,7 @@ Harness status: OK
Found 30 tests
19 Pass
11 Fail
30 Pass
Pass e.style['opacity'] = "1" should set the property value
Pass e.style['opacity'] = "0.5" should set the property value
Pass e.style['opacity'] = "0" should set the property value
@ -12,20 +11,20 @@ Pass e.style['opacity'] = "3" should set the property value
Pass e.style['opacity'] = "-100%" should set the property value
Pass e.style['opacity'] = "50%" should set the property value
Pass e.style['opacity'] = "300%" should set the property value
Fail e.style['opacity'] = "calc(-50% - 50%)" should set the property value
Fail e.style['opacity'] = "calc(25% * 2)" should set the property value
Fail e.style['opacity'] = "calc(100% + 100%)" should set the property value
Pass e.style['opacity'] = "calc(-50% - 50%)" should set the property value
Pass e.style['opacity'] = "calc(25% * 2)" should set the property value
Pass e.style['opacity'] = "calc(100% + 100%)" should set the property value
Pass e.style['opacity'] = "calc(-0.5 - 0.5)" should set the property value
Pass e.style['opacity'] = "calc(0.25 * 2)" should set the property value
Pass e.style['opacity'] = "calc(1 + 1)" should set the property value
Fail e.style['opacity'] = "clamp(50%, 0%, 70%)" should set the property value
Fail e.style['opacity'] = "clamp(50%, 80%, 70%)" should set the property value
Fail e.style['opacity'] = "clamp(50%, 60%, 70%)" should set the property value
Fail e.style['opacity'] = "min(50%, 0%)" should set the property value
Fail e.style['opacity'] = "min(0%, 50%)" should set the property value
Fail e.style['opacity'] = "max(50%, 0%)" should set the property value
Fail e.style['opacity'] = "max(0%, 50%)" should set the property value
Fail e.style['opacity'] = "min(-40%, 50%)" should set the property value
Pass e.style['opacity'] = "clamp(50%, 0%, 70%)" should set the property value
Pass e.style['opacity'] = "clamp(50%, 80%, 70%)" should set the property value
Pass e.style['opacity'] = "clamp(50%, 60%, 70%)" should set the property value
Pass e.style['opacity'] = "min(50%, 0%)" should set the property value
Pass e.style['opacity'] = "min(0%, 50%)" should set the property value
Pass e.style['opacity'] = "max(50%, 0%)" should set the property value
Pass e.style['opacity'] = "max(0%, 50%)" should set the property value
Pass e.style['opacity'] = "min(-40%, 50%)" should set the property value
Pass e.style['opacity'] = "clamp(0.5, 0, 0.7)" should set the property value
Pass e.style['opacity'] = "clamp(0.5, 0.8, 0.7)" should set the property value
Pass e.style['opacity'] = "clamp(0.5, 0.6, 0.7)" should set the property value

5
Tests/LibWeb/Text/expected/wpt-import/css/css-values/calc-numbers.txt
View file

@ -2,14 +2,13 @@ Harness status: OK
Found 12 tests
11 Pass
1 Fail
12 Pass
Pass testing tab-size: calc(2 * 3)
Pass testing tab-size: calc(2 * -4)
Pass testing opacity: calc(2 / 4)
Pass testing tab-size: calc(2 / 4)
Pass testing opacity: calc(2 / 4) * 1px
Fail testing opacity: calc(90%)
Pass testing opacity: calc(90%)
Pass testing tab-size: calc(1 + 1px)
Pass testing tab-size: calc(1 + 100%)
Pass testing tab-size: calc(100%)

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

@ -2,8 +2,7 @@ Harness status: OK
Found 8 tests
7 Pass
1 Fail
8 Pass
Pass Property flood-opacity value '-1'
Pass Property flood-opacity value '0.5'
Pass Property flood-opacity value '3'
@ -11,4 +10,4 @@ Pass Property flood-opacity value '-100%'
Pass Property flood-opacity value '50%'
Pass Property flood-opacity value '300%'
Pass Property flood-opacity value 'calc(0.5 * sign(10em - 1px))'
Fail Property flood-opacity value 'calc(50% * sign(10em - 1px))'
Pass Property flood-opacity value 'calc(50% * sign(10em - 1px))'