Stowage/ladybird
2
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-12-08 06:09:58 +00:00
Code Issues Projects Releases Packages Wiki Activity

LibWeb/CSS: Resolve calc percentages as lengths in basic-shape functions

Browse source 
Fixes a crash on https://www.lego.com/en-gb/product/game-boy-72046 :^)

The apparent regressions in clip-path-interpolation-xywh-rect.html are
because of false positives. Something about the test was causing it to
compare two wrong values that happened to be the same. Now one of the
values is correct, they don't match.
This commit is contained in:
Sam Atkins 2025-11-13 17:13:58 +00:00
parent d98cc50736
commit 48854a8e74
Notes: github-actions[bot] 2025-11-14 11:33:55 +00:00
10 changed files with 78 additions and 70 deletions
Download patch file Download diff file Expand all files Collapse all files

8
Libraries/LibWeb/CSS/Parser/ValueParsing.cpp
View file

@ -3233,6 +3233,9 @@ RefPtr<URLStyleValue const> Parser::parse_url_value(TokenStream<ComponentValue>&
// https://www.w3.org/TR/css-shapes-1/#typedef-shape-radius
Optional<ShapeRadius> Parser::parse_shape_radius(TokenStream<ComponentValue>& tokens)
{
// FIXME: <shape-radius> has been replaced <radial-size> as defined in CSS Images:
// https://drafts.csswg.org/css-images-3/#typedef-radial-size
auto transaction = tokens.begin_transaction();
tokens.discard_whitespace();
auto maybe_radius = parse_length_percentage(tokens);
@ -3298,6 +3301,7 @@ RefPtr<StyleValue const> Parser::parse_basic_shape_value(TokenStream<ComponentVa
return nullptr;
auto function_name = component_value.function().name.bytes_as_string_view();
auto context_guard = push_temporary_value_parsing_context(FunctionContext { function_name });
auto parse_fill_rule_argument = [](Vector<ComponentValue> const& component_values) -> Optional<Gfx::WindingRule> {
TokenStream tokens { component_values };
@ -4213,6 +4217,10 @@ RefPtr<CalculatedStyleValue const> Parser::parse_calculated_value(ComponentValue
"color"sv)) {
return CalculationContext {};
}
if (function.name.is_one_of_ignoring_ascii_case(
"circle"sv, "ellipse"sv, "inset"sv, "polygon"sv, "rect"sv, "xywh"sv)) {
return CalculationContext { .percentages_resolve_as = ValueType::Length };
}
// FIXME: Add other functions that provide a context for resolving values
return {};
},

27
Tests/LibWeb/Text/expected/wpt-import/css/css-masking/animations/clip-path-interpolation-001.txt
View file

@ -2,8 +2,7 @@ Harness status: OK
Found 366 tests
354 Pass
12 Fail
366 Pass
Pass CSS Transitions: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (-0.3) should be [circle(66% at 7% 33%)]
Pass CSS Transitions: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (0) should be [circle(60% at 10% 30%)]
Pass CSS Transitions: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (0.3) should be [circle(54% at 13% 27%)]
@ -316,18 +315,18 @@ Pass Web Animations: property <clip-path> from [none] to [ellipse(100% 100% at 0
Pass Web Animations: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)]
Pass Web Animations: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
Pass Web Animations: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]
Fail CSS Transitions: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Fail CSS Transitions: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Fail CSS Transitions: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]
Fail CSS Transitions with transition: all: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Fail CSS Transitions with transition: all: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Fail CSS Transitions with transition: all: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]
Fail CSS Animations: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Fail CSS Animations: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Fail CSS Animations: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]
Fail Web Animations: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Fail Web Animations: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Fail Web Animations: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]
Pass CSS Transitions: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Pass CSS Transitions: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Pass CSS Transitions: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]
Pass CSS Transitions with transition: all: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Pass CSS Transitions with transition: all: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Pass CSS Transitions with transition: all: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]
Pass CSS Animations: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Pass CSS Animations: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Pass CSS Animations: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]
Pass Web Animations: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Pass Web Animations: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Pass Web Animations: property <clip-path> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]
Pass CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (-0.3) should be [url(file:///.../clip-source)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0) should be [url(file:///.../clip-source)]
Pass CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0.3) should be [url(file:///.../clip-source)]

52
Tests/LibWeb/Text/expected/wpt-import/css/css-masking/animations/clip-path-interpolation-xywh-rect.txt
View file

@ -2,8 +2,8 @@ Harness status: OK
Found 360 tests
240 Pass
120 Fail
216 Pass
144 Fail
Pass CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [initial] to [xywh(10px 10px 100px 100px)] at (-0.3) should be [initial]
Pass CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [initial] to [xywh(10px 10px 100px 100px)] at (0) should be [initial]
Pass CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [initial] to [xywh(10px 10px 100px 100px)] at (0.3) should be [initial]
@ -256,15 +256,15 @@ Fail CSS Transitions with transition: all: property <clip-path> from neutral to
Fail CSS Transitions with transition: all: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (0.875) should be [inset(45px calc(70% - 60px) calc(0% - 42.5px) calc(17.5% + 1.25px))]
Fail CSS Transitions with transition: all: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (1) should be [inset(50px calc(80% - 70px) calc(0% - 50px) 20%)]
Fail CSS Transitions with transition: all: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (2) should be [inset(90px calc(160% - 150px) calc(0% - 110px) calc(40% - 10px))]
Pass CSS Animations: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (-1) should be [inset(-30px calc(-80% + 90px) calc(0% + 70px) calc(-20% + 20px)]
Pass CSS Animations: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))]
Pass CSS Animations: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (0.125) should be [inset(15px 10% calc(0% + 2.5px) calc(2.5% + 8.75px))]
Fail CSS Animations: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (-1) should be [inset(-30px calc(-80% + 90px) calc(0% + 70px) calc(-20% + 20px)]
Fail CSS Animations: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))]
Fail CSS Animations: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (0.125) should be [inset(15px 10% calc(0% + 2.5px) calc(2.5% + 8.75px))]
Fail CSS Animations: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (0.875) should be [inset(45px calc(70% - 60px) calc(0% - 42.5px) calc(17.5% + 1.25px))]
Fail CSS Animations: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (1) should be [inset(50px calc(80% - 70px) calc(0% - 50px) 20%)]
Fail CSS Animations: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (2) should be [inset(90px calc(160% - 150px) calc(0% - 110px) calc(40% - 10px))]
Pass Web Animations: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (-1) should be [inset(-30px calc(-80% + 90px) calc(0% + 70px) calc(-20% + 20px)]
Pass Web Animations: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))]
Pass Web Animations: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (0.125) should be [inset(15px 10% calc(0% + 2.5px) calc(2.5% + 8.75px))]
Fail Web Animations: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (-1) should be [inset(-30px calc(-80% + 90px) calc(0% + 70px) calc(-20% + 20px)]
Fail Web Animations: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))]
Fail Web Animations: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (0.125) should be [inset(15px 10% calc(0% + 2.5px) calc(2.5% + 8.75px))]
Fail Web Animations: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (0.875) should be [inset(45px calc(70% - 60px) calc(0% - 42.5px) calc(17.5% + 1.25px))]
Fail Web Animations: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (1) should be [inset(50px calc(80% - 70px) calc(0% - 50px) 20%)]
Fail Web Animations: property <clip-path> from neutral to [xywh(20% 50px 70px 100%)] at (2) should be [inset(90px calc(160% - 150px) calc(0% - 110px) calc(40% - 10px))]
@ -280,15 +280,15 @@ Fail CSS Transitions with transition: all: property <clip-path> from neutral to
Fail CSS Transitions with transition: all: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (0.875) should be [inset(45px calc(87.5% - 60px) calc(17.5% + 1.25px) calc(17.5% + 1.25px))]
Fail CSS Transitions with transition: all: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (1) should be [inset(50px calc(100% - 70px) 20% 20%)]
Fail CSS Transitions with transition: all: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (2) should be [inset(90px calc(200% - 150px) calc(40% - 10px) calc(40% - 10px))]
Pass CSS Animations: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (-1) should be [inset(-30px calc(-100% + 90px) calc(-20% + 20px) calc(-20% + 20px)]
Pass CSS Animations: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))]
Pass CSS Animations: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (0.125) should be [inset(15px 12.5% calc(2.5% + 8.75px) calc(2.5% + 8.75px))]
Fail CSS Animations: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (-1) should be [inset(-30px calc(-100% + 90px) calc(-20% + 20px) calc(-20% + 20px)]
Fail CSS Animations: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))]
Fail CSS Animations: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (0.125) should be [inset(15px 12.5% calc(2.5% + 8.75px) calc(2.5% + 8.75px))]
Fail CSS Animations: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (0.875) should be [inset(45px calc(87.5% - 60px) calc(17.5% + 1.25px) calc(17.5% + 1.25px))]
Fail CSS Animations: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (1) should be [inset(50px calc(100% - 70px) 20% 20%)]
Fail CSS Animations: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (2) should be [inset(90px calc(200% - 150px) calc(40% - 10px) calc(40% - 10px))]
Pass Web Animations: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (-1) should be [inset(-30px calc(-100% + 90px) calc(-20% + 20px) calc(-20% + 20px)]
Pass Web Animations: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))]
Pass Web Animations: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (0.125) should be [inset(15px 12.5% calc(2.5% + 8.75px) calc(2.5% + 8.75px))]
Fail Web Animations: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (-1) should be [inset(-30px calc(-100% + 90px) calc(-20% + 20px) calc(-20% + 20px)]
Fail Web Animations: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))]
Fail Web Animations: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (0.125) should be [inset(15px 12.5% calc(2.5% + 8.75px) calc(2.5% + 8.75px))]
Fail Web Animations: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (0.875) should be [inset(45px calc(87.5% - 60px) calc(17.5% + 1.25px) calc(17.5% + 1.25px))]
Fail Web Animations: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (1) should be [inset(50px calc(100% - 70px) 20% 20%)]
Fail Web Animations: property <clip-path> from neutral to [rect(50px 70px 80% 20%)] at (2) should be [inset(90px calc(200% - 150px) calc(40% - 10px) calc(40% - 10px))]
@ -304,15 +304,15 @@ Fail CSS Transitions with transition: all: property <clip-path> from [inherit] t
Fail CSS Transitions with transition: all: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (0.875) should be [inset(45px calc(70% - 60px) calc(0% - 42.5px) calc(17.5% + 1.25px))]
Fail CSS Transitions with transition: all: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (1) should be [inset(50px calc(80% - 70px) calc(0% - 50px) 20%)]
Fail CSS Transitions with transition: all: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (2) should be [inset(90px calc(160% - 150px) calc(0% - 110px) calc(40% - 10px))]
Pass CSS Animations: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (-1) should be [inset(-30px calc(-80% + 90px) calc(0% + 70px) calc(-20% + 20px)]
Pass CSS Animations: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))]
Pass CSS Animations: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (0.125) should be [inset(15px 10% calc(0% + 2.5px) calc(2.5% + 8.75px))]
Fail CSS Animations: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (-1) should be [inset(-30px calc(-80% + 90px) calc(0% + 70px) calc(-20% + 20px)]
Fail CSS Animations: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))]
Fail CSS Animations: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (0.125) should be [inset(15px 10% calc(0% + 2.5px) calc(2.5% + 8.75px))]
Fail CSS Animations: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (0.875) should be [inset(45px calc(70% - 60px) calc(0% - 42.5px) calc(17.5% + 1.25px))]
Fail CSS Animations: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (1) should be [inset(50px calc(80% - 70px) calc(0% - 50px) 20%)]
Fail CSS Animations: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (2) should be [inset(90px calc(160% - 150px) calc(0% - 110px) calc(40% - 10px))]
Pass Web Animations: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (-1) should be [inset(-30px calc(-80% + 90px) calc(0% + 70px) calc(-20% + 20px)]
Pass Web Animations: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))]
Pass Web Animations: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (0.125) should be [inset(15px 10% calc(0% + 2.5px) calc(2.5% + 8.75px))]
Fail Web Animations: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (-1) should be [inset(-30px calc(-80% + 90px) calc(0% + 70px) calc(-20% + 20px)]
Fail Web Animations: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))]
Fail Web Animations: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (0.125) should be [inset(15px 10% calc(0% + 2.5px) calc(2.5% + 8.75px))]
Fail Web Animations: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (0.875) should be [inset(45px calc(70% - 60px) calc(0% - 42.5px) calc(17.5% + 1.25px))]
Fail Web Animations: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (1) should be [inset(50px calc(80% - 70px) calc(0% - 50px) 20%)]
Fail Web Animations: property <clip-path> from [inherit] to [xywh(20% 50px 70px 100%)] at (2) should be [inset(90px calc(160% - 150px) calc(0% - 110px) calc(40% - 10px))]
@ -328,15 +328,15 @@ Fail CSS Transitions with transition: all: property <clip-path> from [inherit] t
Fail CSS Transitions with transition: all: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (0.875) should be [inset(45px calc(87.5% - 60px) calc(17.5% + 1.25px) calc(17.5% + 1.25px))]
Fail CSS Transitions with transition: all: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (1) should be [inset(50px calc(100% - 70px) 20% 20%)]
Fail CSS Transitions with transition: all: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (2) should be [inset(90px calc(200% - 150px) calc(40% - 10px) calc(40% - 10px))]
Pass CSS Animations: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (-1) should be [inset(-30px calc(-100% + 90px) calc(-20% + 20px) calc(-20% + 20px)]
Pass CSS Animations: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))]
Pass CSS Animations: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (0.125) should be [inset(15px 12.5% calc(2.5% + 8.75px) calc(2.5% + 8.75px))]
Fail CSS Animations: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (-1) should be [inset(-30px calc(-100% + 90px) calc(-20% + 20px) calc(-20% + 20px)]
Fail CSS Animations: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))]
Fail CSS Animations: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (0.125) should be [inset(15px 12.5% calc(2.5% + 8.75px) calc(2.5% + 8.75px))]
Fail CSS Animations: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (0.875) should be [inset(45px calc(87.5% - 60px) calc(17.5% + 1.25px) calc(17.5% + 1.25px))]
Fail CSS Animations: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (1) should be [inset(50px calc(100% - 70px) 20% 20%)]
Fail CSS Animations: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (2) should be [inset(90px calc(200% - 150px) calc(40% - 10px) calc(40% - 10px))]
Pass Web Animations: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (-1) should be [inset(-30px calc(-100% + 90px) calc(-20% + 20px) calc(-20% + 20px)]
Pass Web Animations: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))]
Pass Web Animations: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (0.125) should be [inset(15px 12.5% calc(2.5% + 8.75px) calc(2.5% + 8.75px))]
Fail Web Animations: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (-1) should be [inset(-30px calc(-100% + 90px) calc(-20% + 20px) calc(-20% + 20px)]
Fail Web Animations: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))]
Fail Web Animations: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (0.125) should be [inset(15px 12.5% calc(2.5% + 8.75px) calc(2.5% + 8.75px))]
Fail Web Animations: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (0.875) should be [inset(45px calc(87.5% - 60px) calc(17.5% + 1.25px) calc(17.5% + 1.25px))]
Fail Web Animations: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (1) should be [inset(50px calc(100% - 70px) 20% 20%)]
Fail Web Animations: property <clip-path> from [inherit] to [rect(50px 70px 80% 20%)] at (2) should be [inset(90px calc(200% - 150px) calc(40% - 10px) calc(40% - 10px))]

27
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/animation/shape-outside-interpolation.txt
View file

@ -2,8 +2,7 @@ Harness status: OK
Found 324 tests
312 Pass
12 Fail
324 Pass
Pass CSS Transitions: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (-0.3) should be [circle(66% at 7% 33%)]
Pass CSS Transitions: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (0) should be [circle(60% at 10% 30%)]
Pass CSS Transitions: property <shape-outside> from neutral to [circle(40% at 20% 20%)] at (0.3) should be [circle(54% at 13% 27%)]
@ -316,15 +315,15 @@ Pass Web Animations: property <shape-outside> from [none] to [ellipse(100% 100%
Pass Web Animations: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)]
Pass Web Animations: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
Pass Web Animations: property <shape-outside> from [none] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]
Fail CSS Transitions: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Fail CSS Transitions: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Fail CSS Transitions: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]
Fail CSS Transitions with transition: all: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Fail CSS Transitions with transition: all: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Fail CSS Transitions with transition: all: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]
Fail CSS Animations: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Fail CSS Animations: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Fail CSS Animations: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]
Fail Web Animations: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Fail Web Animations: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Fail Web Animations: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]
Pass CSS Transitions: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Pass CSS Transitions: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Pass CSS Transitions: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]
Pass CSS Transitions with transition: all: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Pass CSS Transitions with transition: all: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Pass CSS Transitions with transition: all: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]
Pass CSS Animations: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Pass CSS Animations: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Pass CSS Animations: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]
Pass Web Animations: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.25) should be [circle(30% at 90% calc(-20px + 100%))]
Pass Web Animations: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.5) should be [circle(35% at 85% calc(-25px + 100%))]
Pass Web Animations: property <shape-outside> from [circle(25% at right 5% bottom 15px)] to [circle(45% at right 25% bottom 35px)] at (0.75) should be [circle(40% at 80% calc(-30px + 100%))]

6
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/circle-function-computed.txt
View file

@ -2,14 +2,14 @@ Harness status: OK
Found 14 tests
4 Pass
10 Fail
5 Pass
9 Fail
Fail Property shape-outside value 'circle()'
Fail Property shape-outside value 'circle(1px)'
Pass Property shape-outside value 'circle(20px at center)'
Fail Property shape-outside value 'circle(at 10% 20%)'
Pass Property shape-outside value 'circle(4% at top right)'
Fail Property shape-outside value 'circle(calc(100% - 20px) at calc(100% - 20px) calc(100% / 4))'
Pass Property shape-outside value 'circle(calc(100% - 20px) at calc(100% - 20px) calc(100% / 4))'
Fail Property shape-outside value 'circle(closest-corner at center)'
Fail Property shape-outside value 'circle(closest-corner at 20px 50px)'
Fail Property shape-outside value 'circle(closest-side at center)'

5
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/circle-function-valid.txt
View file

@ -2,13 +2,14 @@ Harness status: OK
Found 14 tests
14 Fail
1 Pass
13 Fail
Fail e.style['shape-outside'] = "circle()" should set the property value
Fail e.style['shape-outside'] = "circle(1px)" should set the property value
Fail e.style['shape-outside'] = "circle(20px at center)" should set the property value
Fail e.style['shape-outside'] = "circle(at 10% 20%)" should set the property value
Fail e.style['shape-outside'] = "circle(4% at top right)" should set the property value
Fail e.style['shape-outside'] = "circle(calc(100% - 20px) at calc(100% - 20px) calc(100% / 4))" should set the property value
Pass e.style['shape-outside'] = "circle(calc(100% - 20px) at calc(100% - 20px) calc(100% / 4))" should set the property value
Fail e.style['shape-outside'] = "circle(closest-corner at center)" should set the property value
Fail e.style['shape-outside'] = "circle(closest-corner at 20px 50px)" should set the property value
Fail e.style['shape-outside'] = "circle(closest-side at center)" should set the property value

6
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/ellipse-function-computed.txt
View file

@ -2,8 +2,8 @@ Harness status: OK
Found 14 tests
5 Pass
9 Fail
6 Pass
8 Fail
Fail Property shape-outside value 'ellipse()'
Fail Property shape-outside value 'ellipse(1px 2px)'
Pass Property shape-outside value 'ellipse(20px 40px at center)'
@ -14,7 +14,7 @@ Fail Property shape-outside value 'ellipse(farthest-corner 20%)'
Fail Property shape-outside value 'ellipse(at 10% 20%)'
Fail Property shape-outside value 'ellipse(at -10px -20%)'
Pass Property shape-outside value 'ellipse(4% 20% at top right)'
Fail Property shape-outside value 'ellipse(calc(100% - 20px) calc(80% - 10px) at calc(100% - 20px) calc(100% / 4))'
Pass Property shape-outside value 'ellipse(calc(100% - 20px) calc(80% - 10px) at calc(100% - 20px) calc(100% / 4))'
Pass Property shape-outside value 'ellipse(10px closest-side at top right)'
Pass Property shape-outside value 'ellipse(farthest-side 20px at center top)'
Pass Property shape-outside value 'ellipse(farthest-side farthest-side at top right)'

5
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/ellipse-function-valid.txt
View file

@ -2,7 +2,8 @@ Harness status: OK
Found 14 tests
14 Fail
1 Pass
13 Fail
Fail e.style['shape-outside'] = "ellipse()" should set the property value
Fail e.style['shape-outside'] = "ellipse(1px 2px)" should set the property value
Fail e.style['shape-outside'] = "ellipse(20px 40px at center)" should set the property value
@ -13,7 +14,7 @@ Fail e.style['shape-outside'] = "ellipse(farthest-corner 20%)" should set the pr
Fail e.style['shape-outside'] = "ellipse(at 10% 20%)" should set the property value
Fail e.style['shape-outside'] = "ellipse(at -10px -20%)" should set the property value
Fail e.style['shape-outside'] = "ellipse(4% 20% at top right)" should set the property value
Fail e.style['shape-outside'] = "ellipse(calc(100% - 20px) calc(80% - 10px) at calc(100% - 20px) calc(100% / 4))" should set the property value
Pass e.style['shape-outside'] = "ellipse(calc(100% - 20px) calc(80% - 10px) at calc(100% - 20px) calc(100% / 4))" should set the property value
Fail e.style['shape-outside'] = "ellipse(10px closest-side at top right)" should set the property value
Fail e.style['shape-outside'] = "ellipse(farthest-side 20px at center top)" should set the property value
Fail e.style['shape-outside'] = "ellipse(farthest-side farthest-side at top right)" should set the property value

6
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/inset-function-valid.txt
View file

@ -2,14 +2,14 @@ Harness status: OK
Found 11 tests
1 Pass
10 Fail
2 Pass
9 Fail
Fail e.style['shape-outside'] = "inset(100%)" should set the property value
Fail e.style['shape-outside'] = "inset(0 1px)" should set the property value
Fail e.style['shape-outside'] = "inset(0px 1px 2%)" should set the property value
Fail e.style['shape-outside'] = "inset(-20px -20px 2%)" should set the property value
Pass e.style['shape-outside'] = "inset(0px 1px 2% 3em)" should set the property value
Fail e.style['shape-outside'] = "inset(0px calc(100% - 20px) 2% 3em)" should set the property value
Pass e.style['shape-outside'] = "inset(0px calc(100% - 20px) 2% 3em)" should set the property value
Fail e.style['shape-outside'] = "inset(0px round 100%)" should set the property value
Fail e.style['shape-outside'] = "inset(0px round 0 1px)" should set the property value
Fail e.style['shape-outside'] = "inset(0px round 0px 1px 2%)" should set the property value

6
Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/xywh-function-valid.txt
View file

@ -2,10 +2,10 @@ Harness status: OK
Found 7 tests
1 Pass
6 Fail
2 Pass
5 Fail
Pass e.style['shape-outside'] = "xywh(0px 1px 2% 3em)" should set the property value
Fail e.style['shape-outside'] = "xywh(0px calc(100% - 20px) 2% 3em)" should set the property value
Pass e.style['shape-outside'] = "xywh(0px calc(100% - 20px) 2% 3em)" should set the property value
Fail e.style['shape-outside'] = "xywh(10px 20px 30px 25px round 100%)" should set the property value
Fail e.style['shape-outside'] = "xywh(10px 20px 30px 25px round 0 1px)" should set the property value
Fail e.style['shape-outside'] = "xywh(10px 20px 30px 25px round 0px 1px 2%)" should set the property value