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

LibWeb: Interpolate inset() function by computed value

Browse source
This commit is contained in:
Tim Ledbetter 2025-09-13 13:54:02 +01:00 • committed by Sam Atkins
commit be94c8d456
Notes: github-actions[bot] 2025-09-15 09:36:31 +00:00
4 changed files with 586 additions and 38 deletions
Download patch file Download diff file Expand all files Collapse all files

35
Libraries/LibWeb/CSS/Interpolation.cpp
View file

@ -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();

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

@ -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%)]

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

@ -2,32 +2,32 @@ Harness status: OK
Found 720 tests
544 Pass
176 Fail
Fail 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)]
Fail 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)]
580 Pass
140 Fail
Pass 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) should be [inset(10px)]
Pass 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.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)]
Fail 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)]
Fail 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: 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 (-0.3) should be [inset(7px)]
Pass 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.3) should be [inset(13px)]
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)]
Fail CSS Animations: 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 (1.5) should be [inset(25px)]
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)]
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.3) should be [inset(13px)]
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)]
Fail Web 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 (1.5) should be [inset(25px)]
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)]
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.3) should be [inset(13px)]
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)]
Fail 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)]
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.3) should be [inset(7px)]
Pass 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.3) should be [inset(13px)]
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)]
Fail 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)]
Fail 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: 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 (-0.3) should be [inset(7px)]
Pass 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.3) should be [inset(13px)]
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)]
Fail CSS Animations: 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 (1.5) should be [inset(25px)]
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)]
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.3) should be [inset(13px)]
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)]
Fail Web 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 (1.5) should be [inset(25px)]
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)]
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.3) should be [inset(13px)]
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]

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

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