From 48854a8e74c769774fa9232ef044b4f37952ab77 Mon Sep 17 00:00:00 2001 From: Sam Atkins Date: Thu, 13 Nov 2025 17:13:58 +0000 Subject: [PATCH] LibWeb/CSS: Resolve calc percentages as lengths in basic-shape functions 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. --- Libraries/LibWeb/CSS/Parser/ValueParsing.cpp | 8 +++ .../clip-path-interpolation-001.txt | 27 +++++----- .../clip-path-interpolation-xywh-rect.txt | 52 +++++++++---------- .../animation/shape-outside-interpolation.txt | 27 +++++----- .../circle-function-computed.txt | 6 +-- .../shape-functions/circle-function-valid.txt | 5 +- .../ellipse-function-computed.txt | 6 +-- .../ellipse-function-valid.txt | 5 +- .../shape-functions/inset-function-valid.txt | 6 +-- .../shape-functions/xywh-function-valid.txt | 6 +-- 10 files changed, 78 insertions(+), 70 deletions(-) diff --git a/Libraries/LibWeb/CSS/Parser/ValueParsing.cpp b/Libraries/LibWeb/CSS/Parser/ValueParsing.cpp index b1cff7ccc2a..b2bca64ebbe 100644 --- a/Libraries/LibWeb/CSS/Parser/ValueParsing.cpp +++ b/Libraries/LibWeb/CSS/Parser/ValueParsing.cpp @@ -3233,6 +3233,9 @@ RefPtr Parser::parse_url_value(TokenStream& // https://www.w3.org/TR/css-shapes-1/#typedef-shape-radius Optional Parser::parse_shape_radius(TokenStream& tokens) { + // FIXME: has been replaced 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 Parser::parse_basic_shape_value(TokenStream const& component_values) -> Optional { TokenStream tokens { component_values }; @@ -4213,6 +4217,10 @@ RefPtr 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 {}; }, diff --git a/Tests/LibWeb/Text/expected/wpt-import/css/css-masking/animations/clip-path-interpolation-001.txt b/Tests/LibWeb/Text/expected/wpt-import/css/css-masking/animations/clip-path-interpolation-001.txt index a1890da140f..86778712469 100644 --- a/Tests/LibWeb/Text/expected/wpt-import/css/css-masking/animations/clip-path-interpolation-001.txt +++ b/Tests/LibWeb/Text/expected/wpt-import/css/css-masking/animations/clip-path-interpolation-001.txt @@ -2,8 +2,7 @@ Harness status: OK Found 366 tests -354 Pass -12 Fail +366 Pass Pass CSS Transitions: property from neutral to [circle(40% at 20% 20%)] at (-0.3) should be [circle(66% at 7% 33%)] Pass CSS Transitions: property from neutral to [circle(40% at 20% 20%)] at (0) should be [circle(60% at 10% 30%)] Pass CSS Transitions: property 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 from [none] to [ellipse(100% 100% at 0 Pass Web Animations: property from [none] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)] Pass Web Animations: property from [none] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)] Pass Web Animations: property from [none] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)] -Fail CSS Transitions: property 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 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 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 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 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 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 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 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 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 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 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 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 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 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 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 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 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 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 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 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 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 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 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 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 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 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 from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0.3) should be [url(file:///.../clip-source)] diff --git a/Tests/LibWeb/Text/expected/wpt-import/css/css-masking/animations/clip-path-interpolation-xywh-rect.txt b/Tests/LibWeb/Text/expected/wpt-import/css/css-masking/animations/clip-path-interpolation-xywh-rect.txt index 00eeeb4bfc3..8bbe052a206 100644 --- a/Tests/LibWeb/Text/expected/wpt-import/css/css-masking/animations/clip-path-interpolation-xywh-rect.txt +++ b/Tests/LibWeb/Text/expected/wpt-import/css/css-masking/animations/clip-path-interpolation-xywh-rect.txt @@ -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 from [initial] to [xywh(10px 10px 100px 100px)] at (-0.3) should be [initial] Pass CSS Transitions with transition-behavior:allow-discrete: property from [initial] to [xywh(10px 10px 100px 100px)] at (0) should be [initial] Pass CSS Transitions with transition-behavior:allow-discrete: property 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 from neutral to Fail CSS Transitions with transition: all: property 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 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 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 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 from neutral to [xywh(20% 50px 70px 100%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))] -Pass CSS Animations: property 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 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 from neutral to [xywh(20% 50px 70px 100%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))] +Fail CSS Animations: property 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 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 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 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 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 from neutral to [xywh(20% 50px 70px 100%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))] -Pass Web Animations: property 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 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 from neutral to [xywh(20% 50px 70px 100%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))] +Fail Web Animations: property 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 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 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 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 from neutral to Fail CSS Transitions with transition: all: property 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 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 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 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 from neutral to [rect(50px 70px 80% 20%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))] -Pass CSS Animations: property 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 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 from neutral to [rect(50px 70px 80% 20%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))] +Fail CSS Animations: property 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 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 from neutral to [rect(50px 70px 80% 20%)] at (1) should be [inset(50px calc(100% - 70px) 20% 20%)] Fail CSS Animations: property 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 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 from neutral to [rect(50px 70px 80% 20%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))] -Pass Web Animations: property 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 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 from neutral to [rect(50px 70px 80% 20%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))] +Fail Web Animations: property 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 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 from neutral to [rect(50px 70px 80% 20%)] at (1) should be [inset(50px calc(100% - 70px) 20% 20%)] Fail Web Animations: property 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 from [inherit] t Fail CSS Transitions with transition: all: property 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 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 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 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 from [inherit] to [xywh(20% 50px 70px 100%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))] -Pass CSS Animations: property 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 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 from [inherit] to [xywh(20% 50px 70px 100%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))] +Fail CSS Animations: property 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 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 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 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 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 from [inherit] to [xywh(20% 50px 70px 100%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))] -Pass Web Animations: property 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 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 from [inherit] to [xywh(20% 50px 70px 100%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))] +Fail Web Animations: property 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 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 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 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 from [inherit] t Fail CSS Transitions with transition: all: property 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 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 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 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 from [inherit] to [rect(50px 70px 80% 20%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))] -Pass CSS Animations: property 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 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 from [inherit] to [rect(50px 70px 80% 20%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))] +Fail CSS Animations: property 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 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 from [inherit] to [rect(50px 70px 80% 20%)] at (1) should be [inset(50px calc(100% - 70px) 20% 20%)] Fail CSS Animations: property 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 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 from [inherit] to [rect(50px 70px 80% 20%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))] -Pass Web Animations: property 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 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 from [inherit] to [rect(50px 70px 80% 20%)] at (0) should be [inset(10px calc(0% + 10px) calc(0% + 10px))] +Fail Web Animations: property 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 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 from [inherit] to [rect(50px 70px 80% 20%)] at (1) should be [inset(50px calc(100% - 70px) 20% 20%)] Fail Web Animations: property from [inherit] to [rect(50px 70px 80% 20%)] at (2) should be [inset(90px calc(200% - 150px) calc(40% - 10px) calc(40% - 10px))] diff --git a/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/animation/shape-outside-interpolation.txt b/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/animation/shape-outside-interpolation.txt index 1a99c027aef..6ca26b8dc1d 100644 --- a/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/animation/shape-outside-interpolation.txt +++ b/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/animation/shape-outside-interpolation.txt @@ -2,8 +2,7 @@ Harness status: OK Found 324 tests -312 Pass -12 Fail +324 Pass Pass CSS Transitions: property from neutral to [circle(40% at 20% 20%)] at (-0.3) should be [circle(66% at 7% 33%)] Pass CSS Transitions: property from neutral to [circle(40% at 20% 20%)] at (0) should be [circle(60% at 10% 30%)] Pass CSS Transitions: property 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 from [none] to [ellipse(100% 100% Pass Web Animations: property from [none] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)] Pass Web Animations: property from [none] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)] Pass Web Animations: property from [none] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)] -Fail CSS Transitions: property 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 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 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 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 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 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 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 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 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 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 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 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%))] \ No newline at end of file +Pass CSS Transitions: property 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 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 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 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 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 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 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 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 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 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 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 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%))] \ No newline at end of file diff --git a/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/circle-function-computed.txt b/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/circle-function-computed.txt index 0780bf099fe..6a6dfdca80c 100644 --- a/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/circle-function-computed.txt +++ b/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/circle-function-computed.txt @@ -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)' diff --git a/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/circle-function-valid.txt b/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/circle-function-valid.txt index cd6e97617f9..0184d500ea1 100644 --- a/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/circle-function-valid.txt +++ b/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/circle-function-valid.txt @@ -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 diff --git a/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/ellipse-function-computed.txt b/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/ellipse-function-computed.txt index caa4f6a0ced..e69aaa5a127 100644 --- a/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/ellipse-function-computed.txt +++ b/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/ellipse-function-computed.txt @@ -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)' \ No newline at end of file diff --git a/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/ellipse-function-valid.txt b/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/ellipse-function-valid.txt index 14b79fef3ce..372b506e5b5 100644 --- a/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/ellipse-function-valid.txt +++ b/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/ellipse-function-valid.txt @@ -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 \ No newline at end of file diff --git a/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/inset-function-valid.txt b/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/inset-function-valid.txt index 0c710c269c2..6cdb5d9b245 100644 --- a/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/inset-function-valid.txt +++ b/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/inset-function-valid.txt @@ -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 diff --git a/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/xywh-function-valid.txt b/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/xywh-function-valid.txt index 494c394ea02..9806f6e2854 100644 --- a/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/xywh-function-valid.txt +++ b/Tests/LibWeb/Text/expected/wpt-import/css/css-shapes/shape-functions/xywh-function-valid.txt @@ -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