LibWeb: Interpolate inset() function by computed value

Author: https://github.com/tcl3
Commit: be94c8d456
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/6183
Reviewed-by: https://github.com/AtkinsSJ ✅

Libraries/LibWeb/CSS/Interpolation.cpp

@@ -1194,6 +1194,41 @@ static RefPtr<StyleValue const> interpolate_value_impl(DOM::Element& element, Ca
             interpolated_left.release_nonnull(),
             from_border_image_slice.fill());
     }
+    case StyleValue::Type::BasicShape: {
+        // https://drafts.csswg.org/css-shapes-1/#basic-shape-interpolation
+        auto& from_shape = from.as_basic_shape().basic_shape();
+        auto& to_shape = to.as_basic_shape().basic_shape();
+        if (from_shape.index() != to_shape.index())
+            return {};
+
+        auto interpolate_length_box = [](CalculationContext const& calculation_context, LengthBox const& from, LengthBox const& to, float delta) -> Optional<LengthBox> {
+            auto interpolated_top = interpolate_length_percentage_or_auto(calculation_context, from.top(), to.top(), delta);
+            auto interpolated_right = interpolate_length_percentage_or_auto(calculation_context, from.right(), to.right(), delta);
+            auto interpolated_bottom = interpolate_length_percentage_or_auto(calculation_context, from.bottom(), to.bottom(), delta);
+            auto interpolated_left = interpolate_length_percentage_or_auto(calculation_context, from.left(), to.left(), delta);
+            if (!interpolated_top.has_value() || !interpolated_right.has_value() || !interpolated_bottom.has_value() || !interpolated_left.has_value())
+                return {};
+            return LengthBox { *interpolated_top, *interpolated_right, *interpolated_bottom, *interpolated_left };
+        };
+
+        auto interpolated_shape = from_shape.visit(
+            [&](Inset const& from_inset) -> Optional<BasicShape> {
+                // If both shapes are of type inset(), interpolate between each value in the shape functions.
+                auto& to_inset = to_shape.get<Inset>();
+                auto interpolated_inset_box = interpolate_length_box(calculation_context, from_inset.inset_box, to_inset.inset_box, delta);
+                if (!interpolated_inset_box.has_value())
+                    return {};
+                return Inset { *interpolated_inset_box };
+            },
+            [](auto&) -> Optional<BasicShape> {
+                return {};
+            });
+
+        if (!interpolated_shape.has_value())
+            return {};
+
+        return BasicShapeStyleValue::create(*interpolated_shape);
+    }
     case StyleValue::Type::BorderRadius: {
         auto const& from_horizontal_radius = from.as_border_radius().horizontal_radius();
         auto const& to_horizontal_radius = to.as_border_radius().horizontal_radius();

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

@@ -0,0 +1,372 @@
+Harness status: OK
+
+Found 366 tests
+
+264 Pass
+102 Fail
+Fail	CSS Transitions: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (-0.3) should be [circle(66% at 7% 33%)]
+Fail	CSS Transitions: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (0) should be [circle(60% at 10% 30%)]
+Fail	CSS Transitions: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (0.3) should be [circle(54% at 13% 27%)]
+Fail	CSS Transitions: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (0.6) should be [circle(48% at 16% 24%)]
+Pass	CSS Transitions: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Fail	CSS Transitions: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (1.5) should be [circle(30% at 25% 15%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (-0.3) should be [circle(66% at 7% 33%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (0) should be [circle(60% at 10% 30%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (0.3) should be [circle(54% at 13% 27%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (0.6) should be [circle(48% at 16% 24%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (1.5) should be [circle(30% at 25% 15%)]
+Fail	CSS Animations: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (-0.3) should be [circle(66% at 7% 33%)]
+Pass	CSS Animations: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (0) should be [circle(60% at 10% 30%)]
+Fail	CSS Animations: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (0.3) should be [circle(54% at 13% 27%)]
+Fail	CSS Animations: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (0.6) should be [circle(48% at 16% 24%)]
+Pass	CSS Animations: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Fail	CSS Animations: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (1.5) should be [circle(30% at 25% 15%)]
+Fail	Web Animations: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (-0.3) should be [circle(66% at 7% 33%)]
+Pass	Web Animations: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (0) should be [circle(60% at 10% 30%)]
+Fail	Web Animations: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (0.3) should be [circle(54% at 13% 27%)]
+Fail	Web Animations: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (0.6) should be [circle(48% at 16% 24%)]
+Pass	Web Animations: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Fail	Web Animations: property <clip-path> from neutral to [circle(40% at 20% 20%)] at (1.5) should be [circle(30% at 25% 15%)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (-0.3) should be [initial]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0) should be [initial]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0.3) should be [initial]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (-0.3) should be [initial]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0) should be [initial]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0.3) should be [initial]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (-0.3) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0.3) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (-0.3) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0.3) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
+Pass	CSS Animations: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (-0.3) should be [initial]
+Pass	CSS Animations: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0) should be [initial]
+Pass	CSS Animations: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0.3) should be [initial]
+Pass	CSS Animations: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
+Pass	CSS Animations: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
+Pass	CSS Animations: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Pass	CSS Animations: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
+Pass	Web Animations: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (-0.3) should be [initial]
+Pass	Web Animations: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0) should be [initial]
+Pass	Web Animations: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0.3) should be [initial]
+Pass	Web Animations: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
+Pass	Web Animations: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
+Pass	Web Animations: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Pass	Web Animations: property <clip-path> from [initial] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
+Fail	CSS Transitions: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (-0.3) should be [circle(92% at 33% 7%)]
+Fail	CSS Transitions: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (0) should be [circle(80% at 30% 10%)]
+Fail	CSS Transitions: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (0.3) should be [circle(68% at 27% 13%)]
+Fail	CSS Transitions: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (0.6) should be [circle(56% at 24% 16%)]
+Pass	CSS Transitions: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Fail	CSS Transitions: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (1.5) should be [circle(20% at 15% 25%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (-0.3) should be [circle(92% at 33% 7%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (0) should be [circle(80% at 30% 10%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (0.3) should be [circle(68% at 27% 13%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (0.6) should be [circle(56% at 24% 16%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (1.5) should be [circle(20% at 15% 25%)]
+Fail	CSS Animations: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (-0.3) should be [circle(92% at 33% 7%)]
+Pass	CSS Animations: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (0) should be [circle(80% at 30% 10%)]
+Fail	CSS Animations: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (0.3) should be [circle(68% at 27% 13%)]
+Fail	CSS Animations: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (0.6) should be [circle(56% at 24% 16%)]
+Pass	CSS Animations: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Fail	CSS Animations: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (1.5) should be [circle(20% at 15% 25%)]
+Fail	Web Animations: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (-0.3) should be [circle(92% at 33% 7%)]
+Pass	Web Animations: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (0) should be [circle(80% at 30% 10%)]
+Fail	Web Animations: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (0.3) should be [circle(68% at 27% 13%)]
+Fail	Web Animations: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (0.6) should be [circle(56% at 24% 16%)]
+Pass	Web Animations: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Fail	Web Animations: property <clip-path> from [inherit] to [circle(40% at 20% 20%)] at (1.5) should be [circle(20% at 15% 25%)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (-0.3) should be [unset]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0) should be [unset]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0.3) should be [unset]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (-0.3) should be [unset]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0) should be [unset]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0.3) should be [unset]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (-0.3) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0.3) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (-0.3) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0.3) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
+Pass	CSS Animations: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (-0.3) should be [unset]
+Pass	CSS Animations: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0) should be [unset]
+Pass	CSS Animations: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0.3) should be [unset]
+Pass	CSS Animations: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
+Pass	CSS Animations: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
+Pass	CSS Animations: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Pass	CSS Animations: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
+Pass	Web Animations: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (-0.3) should be [unset]
+Pass	Web Animations: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0) should be [unset]
+Pass	Web Animations: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0.3) should be [unset]
+Pass	Web Animations: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0.5) should be [circle(40% at 20% 20%)]
+Pass	Web Animations: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (0.6) should be [circle(40% at 20% 20%)]
+Pass	Web Animations: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (1) should be [circle(40% at 20% 20%)]
+Pass	Web Animations: property <clip-path> from [unset] to [circle(40% at 20% 20%)] at (1.5) should be [circle(40% at 20% 20%)]
+Fail	CSS Transitions: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (-0.3) should be [circle(115% at -7.5% -7.5%)]
+Fail	CSS Transitions: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0) should be [circle(100% at 0% 0%)]
+Fail	CSS Transitions: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0.3) should be [circle(85% at 7.5% 7.5%)]
+Fail	CSS Transitions: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0.6) should be [circle(70% at 15% 15%)]
+Pass	CSS Transitions: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (1) should be [circle(50% at 25% 25%)]
+Fail	CSS Transitions: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (1.5) should be [circle(25% at 37.5% 37.5%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (-0.3) should be [circle(115% at -7.5% -7.5%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0) should be [circle(100% at 0% 0%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0.3) should be [circle(85% at 7.5% 7.5%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0.6) should be [circle(70% at 15% 15%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (1) should be [circle(50% at 25% 25%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (1.5) should be [circle(25% at 37.5% 37.5%)]
+Fail	CSS Animations: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (-0.3) should be [circle(115% at -7.5% -7.5%)]
+Pass	CSS Animations: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0) should be [circle(100% at 0% 0%)]
+Fail	CSS Animations: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0.3) should be [circle(85% at 7.5% 7.5%)]
+Fail	CSS Animations: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0.6) should be [circle(70% at 15% 15%)]
+Pass	CSS Animations: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (1) should be [circle(50% at 25% 25%)]
+Fail	CSS Animations: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (1.5) should be [circle(25% at 37.5% 37.5%)]
+Fail	Web Animations: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (-0.3) should be [circle(115% at -7.5% -7.5%)]
+Pass	Web Animations: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0) should be [circle(100% at 0% 0%)]
+Fail	Web Animations: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0.3) should be [circle(85% at 7.5% 7.5%)]
+Fail	Web Animations: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (0.6) should be [circle(70% at 15% 15%)]
+Pass	Web Animations: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (1) should be [circle(50% at 25% 25%)]
+Fail	Web Animations: property <clip-path> from [circle(100% at 0% 0%)] to [circle(50% at 25% 25%)] at (1.5) should be [circle(25% at 37.5% 37.5%)]
+Fail	CSS Transitions: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (-0.3) should be [ellipse(115% 115% at -7.5% -7.5%)]
+Fail	CSS Transitions: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0) should be [ellipse(100% 100% at 0% 0%)]
+Fail	CSS Transitions: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0.3) should be [ellipse(85% 85% at 7.5% 7.5%)]
+Fail	CSS Transitions: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0.6) should be [ellipse(70% 70% at 15% 15%)]
+Pass	CSS Transitions: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (1) should be [ellipse(50% 50% at 25% 25%)]
+Fail	CSS Transitions: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (1.5) should be [ellipse(25% 25% at 37.5% 37.5%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (-0.3) should be [ellipse(115% 115% at -7.5% -7.5%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0) should be [ellipse(100% 100% at 0% 0%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0.3) should be [ellipse(85% 85% at 7.5% 7.5%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0.6) should be [ellipse(70% 70% at 15% 15%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (1) should be [ellipse(50% 50% at 25% 25%)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (1.5) should be [ellipse(25% 25% at 37.5% 37.5%)]
+Fail	CSS Animations: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (-0.3) should be [ellipse(115% 115% at -7.5% -7.5%)]
+Pass	CSS Animations: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0) should be [ellipse(100% 100% at 0% 0%)]
+Fail	CSS Animations: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0.3) should be [ellipse(85% 85% at 7.5% 7.5%)]
+Fail	CSS Animations: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0.6) should be [ellipse(70% 70% at 15% 15%)]
+Pass	CSS Animations: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (1) should be [ellipse(50% 50% at 25% 25%)]
+Fail	CSS Animations: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (1.5) should be [ellipse(25% 25% at 37.5% 37.5%)]
+Fail	Web Animations: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (-0.3) should be [ellipse(115% 115% at -7.5% -7.5%)]
+Pass	Web Animations: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0) should be [ellipse(100% 100% at 0% 0%)]
+Fail	Web Animations: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0.3) should be [ellipse(85% 85% at 7.5% 7.5%)]
+Fail	Web Animations: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (0.6) should be [ellipse(70% 70% at 15% 15%)]
+Pass	Web Animations: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (1) should be [ellipse(50% 50% at 25% 25%)]
+Fail	Web Animations: property <clip-path> from [ellipse(100% 100% at 0% 0%)] to [ellipse(50% 50% at 25% 25%)] at (1.5) should be [ellipse(25% 25% at 37.5% 37.5%)]
+Fail	CSS Transitions: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(nonzero, -7.5px -7.5px, 17.5px 17.5px, 42.5px 42.5px)]
+Fail	CSS Transitions: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)]
+Fail	CSS Transitions: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(nonzero, 7.5px 7.5px, 32.5px 32.5px, 57.5px 57.5px)]
+Fail	CSS Transitions: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 15px 15px, 40px 40px, 65px 65px)]
+Pass	CSS Transitions: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Fail	CSS Transitions: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 37.5px 37.5px, 62.5px 62.5px, 87.5px 87.5px)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(nonzero, -7.5px -7.5px, 17.5px 17.5px, 42.5px 42.5px)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(nonzero, 7.5px 7.5px, 32.5px 32.5px, 57.5px 57.5px)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 15px 15px, 40px 40px, 65px 65px)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Fail	CSS Transitions with transition: all: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 37.5px 37.5px, 62.5px 62.5px, 87.5px 87.5px)]
+Fail	CSS Animations: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(nonzero, -7.5px -7.5px, 17.5px 17.5px, 42.5px 42.5px)]
+Pass	CSS Animations: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)]
+Fail	CSS Animations: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(nonzero, 7.5px 7.5px, 32.5px 32.5px, 57.5px 57.5px)]
+Fail	CSS Animations: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 15px 15px, 40px 40px, 65px 65px)]
+Pass	CSS Animations: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Fail	CSS Animations: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 37.5px 37.5px, 62.5px 62.5px, 87.5px 87.5px)]
+Fail	Web Animations: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(nonzero, -7.5px -7.5px, 17.5px 17.5px, 42.5px 42.5px)]
+Pass	Web Animations: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)]
+Fail	Web Animations: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(nonzero, 7.5px 7.5px, 32.5px 32.5px, 57.5px 57.5px)]
+Fail	Web Animations: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 15px 15px, 40px 40px, 65px 65px)]
+Pass	Web Animations: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Fail	Web Animations: property <clip-path> from [polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 37.5px 37.5px, 62.5px 62.5px, 87.5px 87.5px)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Animations: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
+Pass	CSS Animations: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
+Pass	CSS Animations: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
+Pass	CSS Animations: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Animations: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Animations: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Animations: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	Web Animations: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (-0.3) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
+Pass	Web Animations: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
+Pass	Web Animations: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.3) should be [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)]
+Pass	Web Animations: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	Web Animations: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (0.6) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	Web Animations: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	Web Animations: property <clip-path> from [polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)] to [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)] at (1.5) should be [polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)]
+Pass	CSS Transitions: property <clip-path> from [inset(100%)] to [inset(120%)] at (-0.3) should be [inset(94%)]
+Pass	CSS Transitions: property <clip-path> from [inset(100%)] to [inset(120%)] at (0) should be [inset(100%)]
+Pass	CSS Transitions: property <clip-path> from [inset(100%)] to [inset(120%)] at (0.3) should be [inset(106%)]
+Pass	CSS Transitions: property <clip-path> from [inset(100%)] to [inset(120%)] at (0.6) should be [inset(112%)]
+Pass	CSS Transitions: property <clip-path> from [inset(100%)] to [inset(120%)] at (1) should be [inset(120%)]
+Pass	CSS Transitions: property <clip-path> from [inset(100%)] to [inset(120%)] at (1.5) should be [inset(130%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [inset(100%)] to [inset(120%)] at (-0.3) should be [inset(94%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [inset(100%)] to [inset(120%)] at (0) should be [inset(100%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [inset(100%)] to [inset(120%)] at (0.3) should be [inset(106%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [inset(100%)] to [inset(120%)] at (0.6) should be [inset(112%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [inset(100%)] to [inset(120%)] at (1) should be [inset(120%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [inset(100%)] to [inset(120%)] at (1.5) should be [inset(130%)]
+Pass	CSS Animations: property <clip-path> from [inset(100%)] to [inset(120%)] at (-0.3) should be [inset(94%)]
+Pass	CSS Animations: property <clip-path> from [inset(100%)] to [inset(120%)] at (0) should be [inset(100%)]
+Pass	CSS Animations: property <clip-path> from [inset(100%)] to [inset(120%)] at (0.3) should be [inset(106%)]
+Pass	CSS Animations: property <clip-path> from [inset(100%)] to [inset(120%)] at (0.6) should be [inset(112%)]
+Pass	CSS Animations: property <clip-path> from [inset(100%)] to [inset(120%)] at (1) should be [inset(120%)]
+Pass	CSS Animations: property <clip-path> from [inset(100%)] to [inset(120%)] at (1.5) should be [inset(130%)]
+Pass	Web Animations: property <clip-path> from [inset(100%)] to [inset(120%)] at (-0.3) should be [inset(94%)]
+Pass	Web Animations: property <clip-path> from [inset(100%)] to [inset(120%)] at (0) should be [inset(100%)]
+Pass	Web Animations: property <clip-path> from [inset(100%)] to [inset(120%)] at (0.3) should be [inset(106%)]
+Pass	Web Animations: property <clip-path> from [inset(100%)] to [inset(120%)] at (0.6) should be [inset(112%)]
+Pass	Web Animations: property <clip-path> from [inset(100%)] to [inset(120%)] at (1) should be [inset(120%)]
+Pass	Web Animations: property <clip-path> from [inset(100%)] to [inset(120%)] at (1.5) should be [inset(130%)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (-0.3) should be [none]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0) should be [none]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.3) should be [none]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (-0.3) should be [none]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0) should be [none]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.3) should be [none]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (-0.3) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.3) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (-0.3) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.3) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Animations: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (-0.3) should be [none]
+Pass	CSS Animations: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0) should be [none]
+Pass	CSS Animations: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.3) should be [none]
+Pass	CSS Animations: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS 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	CSS Animations: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Animations: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	Web Animations: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (-0.3) should be [none]
+Pass	Web Animations: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0) should be [none]
+Pass	Web Animations: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.3) should be [none]
+Pass	Web Animations: property <clip-path> from [none] to [ellipse(100% 100% at 0% 0%)] at (0.5) should be [ellipse(100% 100% at 0% 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 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)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition-property:all and transition-behavor: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-property:all and transition-behavor: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-property:all and transition-behavor: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-property:all and transition-behavor:allow-discrete: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition-property:all and transition-behavor:allow-discrete: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (-0.3) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0.3) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (-0.3) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0.3) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Animations: 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 Animations: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0) should be [url(file:///.../clip-source)]
+Pass	CSS Animations: 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 Animations: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Animations: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0.6) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Animations: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
+Pass	CSS Animations: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	Web Animations: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (-0.3) should be [url(file:///.../clip-source)]
+Pass	Web Animations: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0) should be [url(file:///.../clip-source)]
+Pass	Web Animations: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0.3) should be [url(file:///.../clip-source)]
+Pass	Web Animations: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (0.5) should be [ellipse(100% 100% at 0% 0%)]
+Pass	Web Animations: property <clip-path> from [url("/clip-source")] 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 [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (1) should be [ellipse(100% 100% at 0% 0%)]
+Pass	Web Animations: property <clip-path> from [url("/clip-source")] to [ellipse(100% 100% at 0% 0%)] at (1.5) should be [ellipse(100% 100% at 0% 0%)]

Tests/LibWeb/Text/expected/wpt-import/css/css-masking/animations/clip-path-interpolation-002.txt

@@ -2,32 +2,32 @@ Harness status: OK
 
 Found 720 tests
 
-544 Pass
+580 Pass
-176 Fail
+140 Fail
-Fail	CSS Transitions: property <clip-path> from neutral to [inset(20px)] at (-0.3) should be [inset(7px)]
+Pass	CSS Transitions: property <clip-path> from neutral to [inset(20px)] at (-0.3) should be [inset(7px)]
-Fail	CSS Transitions: property <clip-path> from neutral to [inset(20px)] at (0) should be [inset(10px)]
+Pass	CSS Transitions: property <clip-path> from neutral to [inset(20px)] at (0) should be [inset(10px)]
-Fail	CSS Transitions: property <clip-path> from neutral to [inset(20px)] at (0.3) should be [inset(13px)]
+Pass	CSS Transitions: property <clip-path> from neutral to [inset(20px)] at (0.3) should be [inset(13px)]
-Fail	CSS Transitions: property <clip-path> from neutral to [inset(20px)] at (0.6) should be [inset(16px)]
+Pass	CSS Transitions: property <clip-path> from neutral to [inset(20px)] at (0.6) should be [inset(16px)]
 Pass	CSS Transitions: property <clip-path> from neutral to [inset(20px)] at (1) should be [inset(20px)]
-Fail	CSS Transitions: property <clip-path> from neutral to [inset(20px)] at (1.5) should be [inset(25px)]
+Pass	CSS Transitions: property <clip-path> from neutral to [inset(20px)] at (1.5) should be [inset(25px)]
-Fail	CSS Transitions with transition: all: property <clip-path> from neutral to [inset(20px)] at (-0.3) should be [inset(7px)]
+Pass	CSS Transitions with transition: all: property <clip-path> from neutral to [inset(20px)] at (-0.3) should be [inset(7px)]
-Fail	CSS Transitions with transition: all: property <clip-path> from neutral to [inset(20px)] at (0) should be [inset(10px)]
+Pass	CSS Transitions with transition: all: property <clip-path> from neutral to [inset(20px)] at (0) should be [inset(10px)]
-Fail	CSS Transitions with transition: all: property <clip-path> from neutral to [inset(20px)] at (0.3) should be [inset(13px)]
+Pass	CSS Transitions with transition: all: property <clip-path> from neutral to [inset(20px)] at (0.3) should be [inset(13px)]
-Fail	CSS Transitions with transition: all: property <clip-path> from neutral to [inset(20px)] at (0.6) should be [inset(16px)]
+Pass	CSS Transitions with transition: all: property <clip-path> from neutral to [inset(20px)] at (0.6) should be [inset(16px)]
 Pass	CSS Transitions with transition: all: property <clip-path> from neutral to [inset(20px)] at (1) should be [inset(20px)]
-Fail	CSS Transitions with transition: all: property <clip-path> from neutral to [inset(20px)] at (1.5) should be [inset(25px)]
+Pass	CSS Transitions with transition: all: property <clip-path> from neutral to [inset(20px)] at (1.5) should be [inset(25px)]
-Fail	CSS Animations: property <clip-path> from neutral to [inset(20px)] at (-0.3) should be [inset(7px)]
+Pass	CSS Animations: property <clip-path> from neutral to [inset(20px)] at (-0.3) should be [inset(7px)]
 Pass	CSS Animations: property <clip-path> from neutral to [inset(20px)] at (0) should be [inset(10px)]
-Fail	CSS Animations: property <clip-path> from neutral to [inset(20px)] at (0.3) should be [inset(13px)]
+Pass	CSS Animations: property <clip-path> from neutral to [inset(20px)] at (0.3) should be [inset(13px)]
-Fail	CSS Animations: property <clip-path> from neutral to [inset(20px)] at (0.6) should be [inset(16px)]
+Pass	CSS Animations: property <clip-path> from neutral to [inset(20px)] at (0.6) should be [inset(16px)]
 Pass	CSS Animations: property <clip-path> from neutral to [inset(20px)] at (1) should be [inset(20px)]
-Fail	CSS Animations: property <clip-path> from neutral to [inset(20px)] at (1.5) should be [inset(25px)]
+Pass	CSS Animations: property <clip-path> from neutral to [inset(20px)] at (1.5) should be [inset(25px)]
-Fail	Web Animations: property <clip-path> from neutral to [inset(20px)] at (-0.3) should be [inset(7px)]
+Pass	Web Animations: property <clip-path> from neutral to [inset(20px)] at (-0.3) should be [inset(7px)]
 Pass	Web Animations: property <clip-path> from neutral to [inset(20px)] at (0) should be [inset(10px)]
-Fail	Web Animations: property <clip-path> from neutral to [inset(20px)] at (0.3) should be [inset(13px)]
+Pass	Web Animations: property <clip-path> from neutral to [inset(20px)] at (0.3) should be [inset(13px)]
-Fail	Web Animations: property <clip-path> from neutral to [inset(20px)] at (0.6) should be [inset(16px)]
+Pass	Web Animations: property <clip-path> from neutral to [inset(20px)] at (0.6) should be [inset(16px)]
 Pass	Web Animations: property <clip-path> from neutral to [inset(20px)] at (1) should be [inset(20px)]
-Fail	Web Animations: property <clip-path> from neutral to [inset(20px)] at (1.5) should be [inset(25px)]
+Pass	Web Animations: property <clip-path> from neutral to [inset(20px)] at (1.5) should be [inset(25px)]
 Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [initial] to [inset(20px)] at (-0.3) should be [initial]
 Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [initial] to [inset(20px)] at (0) should be [initial]
 Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [initial] to [inset(20px)] at (0.3) should be [initial]
@@ -70,30 +70,30 @@ Pass	Web Animations: property <clip-path> from [initial] to [inset(20px)] at (0.
 Pass	Web Animations: property <clip-path> from [initial] to [inset(20px)] at (0.6) should be [inset(20px)]
 Pass	Web Animations: property <clip-path> from [initial] to [inset(20px)] at (1) should be [inset(20px)]
 Pass	Web Animations: property <clip-path> from [initial] to [inset(20px)] at (1.5) should be [inset(20px)]
-Fail	CSS Transitions: property <clip-path> from [inherit] to [inset(20px)] at (-0.3) should be [inset(7px)]
+Pass	CSS Transitions: property <clip-path> from [inherit] to [inset(20px)] at (-0.3) should be [inset(7px)]
-Fail	CSS Transitions: property <clip-path> from [inherit] to [inset(20px)] at (0) should be [inset(10px)]
+Pass	CSS Transitions: property <clip-path> from [inherit] to [inset(20px)] at (0) should be [inset(10px)]
-Fail	CSS Transitions: property <clip-path> from [inherit] to [inset(20px)] at (0.3) should be [inset(13px)]
+Pass	CSS Transitions: property <clip-path> from [inherit] to [inset(20px)] at (0.3) should be [inset(13px)]
-Fail	CSS Transitions: property <clip-path> from [inherit] to [inset(20px)] at (0.6) should be [inset(16px)]
+Pass	CSS Transitions: property <clip-path> from [inherit] to [inset(20px)] at (0.6) should be [inset(16px)]
 Pass	CSS Transitions: property <clip-path> from [inherit] to [inset(20px)] at (1) should be [inset(20px)]
-Fail	CSS Transitions: property <clip-path> from [inherit] to [inset(20px)] at (1.5) should be [inset(25px)]
+Pass	CSS Transitions: property <clip-path> from [inherit] to [inset(20px)] at (1.5) should be [inset(25px)]
-Fail	CSS Transitions with transition: all: property <clip-path> from [inherit] to [inset(20px)] at (-0.3) should be [inset(7px)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [inherit] to [inset(20px)] at (-0.3) should be [inset(7px)]
-Fail	CSS Transitions with transition: all: property <clip-path> from [inherit] to [inset(20px)] at (0) should be [inset(10px)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [inherit] to [inset(20px)] at (0) should be [inset(10px)]
-Fail	CSS Transitions with transition: all: property <clip-path> from [inherit] to [inset(20px)] at (0.3) should be [inset(13px)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [inherit] to [inset(20px)] at (0.3) should be [inset(13px)]
-Fail	CSS Transitions with transition: all: property <clip-path> from [inherit] to [inset(20px)] at (0.6) should be [inset(16px)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [inherit] to [inset(20px)] at (0.6) should be [inset(16px)]
 Pass	CSS Transitions with transition: all: property <clip-path> from [inherit] to [inset(20px)] at (1) should be [inset(20px)]
-Fail	CSS Transitions with transition: all: property <clip-path> from [inherit] to [inset(20px)] at (1.5) should be [inset(25px)]
+Pass	CSS Transitions with transition: all: property <clip-path> from [inherit] to [inset(20px)] at (1.5) should be [inset(25px)]
-Fail	CSS Animations: property <clip-path> from [inherit] to [inset(20px)] at (-0.3) should be [inset(7px)]
+Pass	CSS Animations: property <clip-path> from [inherit] to [inset(20px)] at (-0.3) should be [inset(7px)]
 Pass	CSS Animations: property <clip-path> from [inherit] to [inset(20px)] at (0) should be [inset(10px)]
-Fail	CSS Animations: property <clip-path> from [inherit] to [inset(20px)] at (0.3) should be [inset(13px)]
+Pass	CSS Animations: property <clip-path> from [inherit] to [inset(20px)] at (0.3) should be [inset(13px)]
-Fail	CSS Animations: property <clip-path> from [inherit] to [inset(20px)] at (0.6) should be [inset(16px)]
+Pass	CSS Animations: property <clip-path> from [inherit] to [inset(20px)] at (0.6) should be [inset(16px)]
 Pass	CSS Animations: property <clip-path> from [inherit] to [inset(20px)] at (1) should be [inset(20px)]
-Fail	CSS Animations: property <clip-path> from [inherit] to [inset(20px)] at (1.5) should be [inset(25px)]
+Pass	CSS Animations: property <clip-path> from [inherit] to [inset(20px)] at (1.5) should be [inset(25px)]
-Fail	Web Animations: property <clip-path> from [inherit] to [inset(20px)] at (-0.3) should be [inset(7px)]
+Pass	Web Animations: property <clip-path> from [inherit] to [inset(20px)] at (-0.3) should be [inset(7px)]
 Pass	Web Animations: property <clip-path> from [inherit] to [inset(20px)] at (0) should be [inset(10px)]
-Fail	Web Animations: property <clip-path> from [inherit] to [inset(20px)] at (0.3) should be [inset(13px)]
+Pass	Web Animations: property <clip-path> from [inherit] to [inset(20px)] at (0.3) should be [inset(13px)]
-Fail	Web Animations: property <clip-path> from [inherit] to [inset(20px)] at (0.6) should be [inset(16px)]
+Pass	Web Animations: property <clip-path> from [inherit] to [inset(20px)] at (0.6) should be [inset(16px)]
 Pass	Web Animations: property <clip-path> from [inherit] to [inset(20px)] at (1) should be [inset(20px)]
-Fail	Web Animations: property <clip-path> from [inherit] to [inset(20px)] at (1.5) should be [inset(25px)]
+Pass	Web Animations: property <clip-path> from [inherit] to [inset(20px)] at (1.5) should be [inset(25px)]
 Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [unset] to [inset(20px)] at (-0.3) should be [unset]
 Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [unset] to [inset(20px)] at (0) should be [unset]
 Pass	CSS Transitions with transition-behavior:allow-discrete: property <clip-path> from [unset] to [inset(20px)] at (0.3) should be [unset]

Tests/LibWeb/Text/input/wpt-import/css/css-masking/animations/clip-path-interpolation-001.html

@@ -0,0 +1,141 @@
+<!DOCTYPE html>
+<meta charset="UTF-8">
+<title>clip-path interpolation</title>
+<link rel="help" href="https://drafts.fxtf.org/css-masking-1/#the-clip-path">
+<meta name="assert" content="clip-path supports animation">
+
+<script src="../../../resources/testharness.js"></script>
+<script src="../../../resources/testharnessreport.js"></script>
+<script src="../../../css/support/interpolation-testcommon.js"></script>
+
+<style>
+.parent {
+  clip-path: circle(80% at 30% 10%);
+}
+
+.target {
+  clip-path: circle(60% at 10% 30%);
+}
+</style>
+<body>
+<script>
+test_interpolation({
+  property: 'clip-path',
+  from: neutralKeyframe,
+  to: 'circle(40% at 20% 20%)',
+}, [
+  {at: -0.3, expect: 'circle(66% at 7% 33%)'},
+  {at: 0, expect: 'circle(60% at 10% 30%)'},
+  {at: 0.3, expect: 'circle(54% at 13% 27%)'},
+  {at: 0.6, expect: 'circle(48% at 16% 24%)'},
+  {at: 1, expect: 'circle(40% at 20% 20%)'},
+  {at: 1.5, expect: 'circle(30% at 25% 15%)'},
+]);
+
+test_no_interpolation({
+  property: 'clip-path',
+  from: 'initial',
+  to: 'circle(40% at 20% 20%)',
+});
+
+test_interpolation({
+  property: 'clip-path',
+  from: 'inherit',
+  to: 'circle(40% at 20% 20%)',
+}, [
+  {at: -0.3, expect: 'circle(92% at 33% 7%)'},
+  {at: 0, expect: 'circle(80% at 30% 10%)'},
+  {at: 0.3, expect: 'circle(68% at 27% 13%)'},
+  {at: 0.6, expect: 'circle(56% at 24% 16%)'},
+  {at: 1, expect: 'circle(40% at 20% 20%)'},
+  {at: 1.5, expect: 'circle(20% at 15% 25%)'},
+]);
+
+test_no_interpolation({
+  property: 'clip-path',
+  from: 'unset',
+  to: 'circle(40% at 20% 20%)',
+});
+
+test_interpolation({
+  property: 'clip-path',
+  from: 'circle(100% at 0% 0%)',
+  to: 'circle(50% at 25% 25%)',
+}, [
+  {at: -0.3, expect: 'circle(115% at -7.5% -7.5%)'},
+  {at: 0, expect: 'circle(100% at 0% 0%)'},
+  {at: 0.3, expect: 'circle(85% at 7.5% 7.5%)'},
+  {at: 0.6, expect: 'circle(70% at 15% 15%)'},
+  {at: 1, expect: 'circle(50% at 25% 25%)'},
+  {at: 1.5, expect: 'circle(25% at 37.5% 37.5%)'}
+]);
+
+test_interpolation({
+  property: 'clip-path',
+  from: 'ellipse(100% 100% at 0% 0%)',
+  to: 'ellipse(50% 50% at 25% 25%)',
+}, [
+  {at: -0.3, expect: 'ellipse(115% 115% at -7.5% -7.5%)'},
+  {at: 0, expect: 'ellipse(100% 100% at 0% 0%)'},
+  {at: 0.3, expect: 'ellipse(85% 85% at 7.5% 7.5%)'},
+  {at: 0.6, expect: 'ellipse(70% 70% at 15% 15%)'},
+  {at: 1, expect: 'ellipse(50% 50% at 25% 25%)'},
+  {at: 1.5, expect: 'ellipse(25% 25% at 37.5% 37.5%)'}
+]);
+
+test_interpolation({
+  property: 'clip-path',
+  from: 'polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)',
+  to: 'polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)',
+}, [
+  {at: -0.3, expect: 'polygon(nonzero, -7.5px -7.5px, 17.5px 17.5px, 42.5px 42.5px)'},
+  {at: 0, expect: 'polygon(nonzero, 0px 0px, 25px 25px, 50px 50px)'},
+  {at: 0.3, expect: 'polygon(nonzero, 7.5px 7.5px, 32.5px 32.5px, 57.5px 57.5px)'},
+  {at: 0.6, expect: 'polygon(nonzero, 15px 15px, 40px 40px, 65px 65px)'},
+  {at: 1, expect: 'polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)'},
+  {at: 1.5, expect: 'polygon(nonzero, 37.5px 37.5px, 62.5px 62.5px, 87.5px 87.5px)'}
+]);
+
+test_no_interpolation({
+  property: 'clip-path',
+  from: 'polygon(evenodd, 0px 0px, 25px 25px, 50px 50px)',
+  to: 'polygon(nonzero, 25px 25px, 50px 50px, 75px 75px)',
+});
+
+test_interpolation({
+  property: 'clip-path',
+  from: 'inset(100%)',
+  to: 'inset(120%)',
+}, [
+  {at: -0.3, expect: 'inset(94%)'},
+  {at: 0, expect: 'inset(100%)'},
+  {at: 0.3, expect: 'inset(106%)'},
+  {at: 0.6, expect: 'inset(112%)'},
+  {at: 1, expect: 'inset(120%)'},
+  {at: 1.5, expect: 'inset(130%)'},
+]);
+
+test_no_interpolation({
+  property: 'clip-path',
+  from: 'none',
+  to: 'ellipse(100% 100% at 0% 0%)',
+});
+
+test_interpolation({
+  property: 'clip-path',
+  from: 'circle(25% at right 5% bottom 15px)',
+  to: 'circle(45% at right 25% bottom 35px)',
+}, [
+  {at: 0.25, expect: 'circle(30% at 90% calc(-20px + 100%))'},
+  {at: 0.5, expect: 'circle(35% at 85% calc(-25px + 100%))'},
+  {at: 0.75, expect: 'circle(40% at 80% calc(-30px + 100%))'},
+]);
+
+test_no_interpolation({
+  property: 'clip-path',
+  from: 'url("/clip-source")',
+  to: 'ellipse(100% 100% at 0% 0%)',
+});
+
+</script>
+</body>