mirror of
https://github.com/servo/servo.git
synced 2025-08-29 00:58:20 +01:00
Update web-platform-tests to revision be5419e845d39089ba6dc338c1bd0fa279108317
This commit is contained in:
Josh Matthews
parent
aa199307c8
commit
2b6f573eb5
3440 changed files with 109438 additions and 41750 deletions
|
|
@ -0,0 +1,110 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>offset-distance interpolation</title>
|
||||
<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org">
|
||||
<link rel="help" href="https://drafts.fxtf.org/motion-1/#offset-distance-property">
|
||||
<meta name="assert" content="offset-distance supports animation.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="resources/interpolation-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
// Distinct number of path segments
|
||||
test_no_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('M 0 0 H 1 H 2')",
|
||||
to: "path('M 0 0 H 3')"
|
||||
});
|
||||
|
||||
test_no_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('M 1 2 L 3 4 Z')",
|
||||
to: "none"
|
||||
});
|
||||
|
||||
// Distinct segment types
|
||||
test_no_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('M 10 0 H 11')",
|
||||
to: "path('M 20 0 V 2')"
|
||||
});
|
||||
|
||||
test_no_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('M 1 2 L 4 6 Z')",
|
||||
to: "path('M 1 2 H 4 V 6')"
|
||||
});
|
||||
|
||||
// Exercise each segment type
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('M 0 0 Z')",
|
||||
to: "path('M 0 0 Z')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M 0 0 Z')"},
|
||||
{at: 0, expect: "path('M 0 0 Z')"},
|
||||
{at: 0.125, expect: "path('M 0 0 Z')"},
|
||||
{at: 0.875, expect: "path('M 0 0 Z')"},
|
||||
{at: 1, expect: "path('M 0 0 Z')"},
|
||||
{at: 2, expect: "path('M 0 0 Z')"}
|
||||
]);
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('M 20 70')",
|
||||
to: "path('M 100 30')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M -60 110')"},
|
||||
{at: 0, expect: "path('M 20 70')"},
|
||||
{at: 0.125, expect: "path('M 30 65')"},
|
||||
{at: 0.875, expect: "path('M 90 35')"},
|
||||
{at: 1, expect: "path('M 100 30')"},
|
||||
{at: 2, expect: "path('M 180 -10')"}
|
||||
]);
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('m 20 70')",
|
||||
to: "path('m 100 30')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M -60 110')"},
|
||||
{at: 0, expect: "path('M 20 70')"},
|
||||
{at: 0.125, expect: "path('M 30 65')"},
|
||||
{at: 0.875, expect: "path('M 90 35')"},
|
||||
{at: 1, expect: "path('M 100 30')"},
|
||||
{at: 2, expect: "path('M 180 -10')"}
|
||||
]);
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('m 100 200 L 120 270')",
|
||||
to: "path('m 100 200 L 200 230')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M 100 200 L 40 310')"},
|
||||
{at: 0, expect: "path('M 100 200 L 120 270')"},
|
||||
{at: 0.125, expect: "path('M 100 200 L 130 265')"},
|
||||
{at: 0.875, expect: "path('M 100 200 L 190 235')"},
|
||||
{at: 1, expect: "path('M 100 200 L 200 230')"},
|
||||
{at: 2, expect: "path('M 100 200 L 280 190')"}
|
||||
]);
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('m 100 200 l 20 70')",
|
||||
to: "path('m 100 200 l 100 30')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M 100 200 L 40 310')"},
|
||||
{at: 0, expect: "path('M 100 200 L 120 270')"},
|
||||
{at: 0.125, expect: "path('M 100 200 L 130 265')"},
|
||||
{at: 0.875, expect: "path('M 100 200 L 190 235')"},
|
||||
{at: 1, expect: "path('M 100 200 L 200 230')"},
|
||||
{at: 2, expect: "path('M 100 200 L 280 190')"}
|
||||
]);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,93 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>offset-distance interpolation</title>
|
||||
<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org">
|
||||
<link rel="help" href="https://drafts.fxtf.org/motion-1/#offset-distance-property">
|
||||
<meta name="assert" content="offset-distance supports animation.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="resources/interpolation-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('M 20 10 C 32 42 52 62 120 2200')",
|
||||
to: "path('M 20 10 C 40 50 60 70 200 3000')",
|
||||
}, [
|
||||
{at: -1, expect: "path('M 20 10 C 24 34 44 54 40 1400')"},
|
||||
{at: 0, expect: "path('M 20 10 C 32 42 52 62 120 2200')"},
|
||||
{at: 0.125, expect: "path('M 20 10 C 33 43 53 63 130 2300')"},
|
||||
{at: 0.875, expect: "path('M 20 10 C 39 49 59 69 190 2900')"},
|
||||
{at: 1, expect: "path('M 20 10 C 40 50 60 70 200 3000')"},
|
||||
{at: 2, expect: "path('M 20 10 C 48 58 68 78 280 3800')"}
|
||||
]);
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('m 20 10 c 12 32 32 52 100 2190')",
|
||||
to: "path('m 20 10 c 20 40 40 60 180 2990')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M 20 10 C 24 34 44 54 40 1400')"},
|
||||
{at: 0, expect: "path('M 20 10 C 32 42 52 62 120 2200')"},
|
||||
{at: 0.125, expect: "path('M 20 10 C 33 43 53 63 130 2300')"},
|
||||
{at: 0.875, expect: "path('M 20 10 C 39 49 59 69 190 2900')"},
|
||||
{at: 1, expect: "path('M 20 10 C 40 50 60 70 200 3000')"},
|
||||
{at: 2, expect: "path('M 20 10 C 48 58 68 78 280 3800')"}
|
||||
]);
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('M 20 10 Q 32 42 120 2200')",
|
||||
to: "path('M 20 10 Q 40 50 200 3000')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M 20 10 Q 24 34 40 1400')"},
|
||||
{at: 0, expect: "path('M 20 10 Q 32 42 120 2200')"},
|
||||
{at: 0.125, expect: "path('M 20 10 Q 33 43 130 2300')"},
|
||||
{at: 0.875, expect: "path('M 20 10 Q 39 49 190 2900')"},
|
||||
{at: 1, expect: "path('M 20 10 Q 40 50 200 3000')"},
|
||||
{at: 2, expect: "path('M 20 10 Q 48 58 280 3800')"}
|
||||
]);
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('m 20 10 q 12 32 100 2190')",
|
||||
to: "path('m 20 10 q 20 40 180 2990')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M 20 10 Q 24 34 40 1400')"},
|
||||
{at: 0, expect: "path('M 20 10 Q 32 42 120 2200')"},
|
||||
{at: 0.125, expect: "path('M 20 10 Q 33 43 130 2300')"},
|
||||
{at: 0.875, expect: "path('M 20 10 Q 39 49 190 2900')"},
|
||||
{at: 1, expect: "path('M 20 10 Q 40 50 200 3000')"},
|
||||
{at: 2, expect: "path('M 20 10 Q 48 58 280 3800')"}
|
||||
]);
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('M 100 400 A 10 20 30 1 0 140 450')",
|
||||
to: "path('M 300 200 A 50 60 70 0 1 380 290')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M -100 600 A -30 -20 -10 1 0 -100 610')"},
|
||||
{at: 0, expect: "path('M 100 400 A 10 20 30 1 0 140 450')"},
|
||||
{at: 0.125, expect: "path('M 125 375 A 15 25 35 1 0 170 430')"},
|
||||
{at: 0.875, expect: "path('M 275 225 A 45 55 65 0 1 350 310')"},
|
||||
{at: 1, expect: "path('M 300 200 A 50 60 70 0 1 380 290')"},
|
||||
{at: 2, expect: "path('M 500 0 A 90 100 110 0 1 620 130')"}
|
||||
]);
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('m 100 400 a 10 20 30 1 0 40 50')",
|
||||
to: "path('m 300 200 a 50 60 70 0 1 80 90')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M -100 600 A -30 -20 -10 1 0 -100 610')"},
|
||||
{at: 0, expect: "path('M 100 400 A 10 20 30 1 0 140 450')"},
|
||||
{at: 0.125, expect: "path('M 125 375 A 15 25 35 1 0 170 430')"},
|
||||
{at: 0.875, expect: "path('M 275 225 A 45 55 65 0 1 350 310')"},
|
||||
{at: 1, expect: "path('M 300 200 A 50 60 70 0 1 380 290')"},
|
||||
{at: 2, expect: "path('M 500 0 A 90 100 110 0 1 620 130')"}
|
||||
]);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,118 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>offset-distance interpolation</title>
|
||||
<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org">
|
||||
<link rel="help" href="https://drafts.fxtf.org/motion-1/#offset-distance-property">
|
||||
<meta name="assert" content="offset-distance supports animation.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="resources/interpolation-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('M 50 60 H 70')",
|
||||
to: "path('M 10 140 H 270')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M 90 -20 H -130')"},
|
||||
{at: 0, expect: "path('M 50 60 H 70')"},
|
||||
{at: 0.125, expect: "path('M 45 70 H 95')"},
|
||||
{at: 0.875, expect: "path('M 15 130 H 245')"},
|
||||
{at: 1, expect: "path('M 10 140 H 270')"},
|
||||
{at: 2, expect: "path('M -30 220 H 470')"}
|
||||
]);
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('m 50 60 h 20')",
|
||||
to: "path('m 10 140 h 260')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M 90 -20 H -130')"},
|
||||
{at: 0, expect: "path('M 50 60 H 70')"},
|
||||
{at: 0.125, expect: "path('M 45 70 H 95')"},
|
||||
{at: 0.875, expect: "path('M 15 130 H 245')"},
|
||||
{at: 1, expect: "path('M 10 140 H 270')"},
|
||||
{at: 2, expect: "path('M -30 220 H 470')"}
|
||||
]);
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('M 50 60 V 70')",
|
||||
to: "path('M 10 140 V 270')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M 90 -20 V -130')"},
|
||||
{at: 0, expect: "path('M 50 60 V 70')"},
|
||||
{at: 0.125, expect: "path('M 45 70 V 95')"},
|
||||
{at: 0.875, expect: "path('M 15 130 V 245')"},
|
||||
{at: 1, expect: "path('M 10 140 V 270')"},
|
||||
{at: 2, expect: "path('M -30 220 V 470')"}
|
||||
]);
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('m 50 60 v 10')",
|
||||
to: "path('m 10 140 v 130')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M 90 -20 V -130')"},
|
||||
{at: 0, expect: "path('M 50 60 V 70')"},
|
||||
{at: 0.125, expect: "path('M 45 70 V 95')"},
|
||||
{at: 0.875, expect: "path('M 15 130 V 245')"},
|
||||
{at: 1, expect: "path('M 10 140 V 270')"},
|
||||
{at: 2, expect: "path('M -30 220 V 470')"}
|
||||
]);
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('M 12 34 S 45 67 89 123')",
|
||||
to: "path('M 20 26 S 61 51 113 99')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M 4 42 S 29 83 65 147')"},
|
||||
{at: 0, expect: "path('M 12 34 S 45 67 89 123')"},
|
||||
{at: 0.125, expect: "path('M 13 33 S 47 65 92 120')"},
|
||||
{at: 0.875, expect: "path('M 19 27 S 59 53 110 102')"},
|
||||
{at: 1, expect: "path('M 20 26 S 61 51 113 99')"},
|
||||
{at: 2, expect: "path('M 28 18 S 77 35 137 75')"},
|
||||
]);
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('m 12 34 s 33 33 77 89')",
|
||||
to: "path('m 20 26 s 41 25 93 73')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M 4 42 S 29 83 65 147')"},
|
||||
{at: 0, expect: "path('M 12 34 S 45 67 89 123')"},
|
||||
{at: 0.125, expect: "path('M 13 33 S 47 65 92 120')"},
|
||||
{at: 0.875, expect: "path('M 19 27 S 59 53 110 102')"},
|
||||
{at: 1, expect: "path('M 20 26 S 61 51 113 99')"},
|
||||
{at: 2, expect: "path('M 28 18 S 77 35 137 75')"},
|
||||
]);
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('M 12 34 T 45 67')",
|
||||
to: "path('M 20 26 T 61 51')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M 4 42 T 29 83')"},
|
||||
{at: 0, expect: "path('M 12 34 T 45 67')"},
|
||||
{at: 0.125, expect: "path('M 13 33 T 47 65')"},
|
||||
{at: 0.875, expect: "path('M 19 27 T 59 53')"},
|
||||
{at: 1, expect: "path('M 20 26 T 61 51')"},
|
||||
{at: 2, expect: "path('M 28 18 T 77 35')"},
|
||||
]);
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('m 12 34 t 33 33')",
|
||||
to: "path('m 20 26 t 41 25')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M 4 42 T 29 83')"},
|
||||
{at: 0, expect: "path('M 12 34 T 45 67')"},
|
||||
{at: 0.125, expect: "path('M 13 33 T 47 65')"},
|
||||
{at: 0.875, expect: "path('M 19 27 T 59 53')"},
|
||||
{at: 1, expect: "path('M 20 26 T 61 51')"},
|
||||
{at: 2, expect: "path('M 28 18 T 77 35')"},
|
||||
]);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,123 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>offset-distance interpolation</title>
|
||||
<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org">
|
||||
<link rel="help" href="https://drafts.fxtf.org/motion-1/#offset-distance-property">
|
||||
<meta name="assert" content="offset-distance supports animation.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="resources/interpolation-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
// Mix relative and non-relative
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('M 0 0 L 100 100 M 100 200 L 200 200 Z L 200 100 Z')",
|
||||
to: "path('M 0 0 L 100 100 m 0 100 l 100 0 z l 300 100 z')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M 0 0 L 100 100 M 100 200 L 200 200 Z L 0 -100 Z')"},
|
||||
{at: 0, expect: "path('M 0 0 L 100 100 M 100 200 L 200 200 Z L 200 100 Z')"},
|
||||
{at: 0.125, expect: "path('M 0 0 L 100 100 M 100 200 L 200 200 Z L 225 125 Z')"},
|
||||
{at: 0.875, expect: "path('M 0 0 L 100 100 M 100 200 L 200 200 Z L 375 275 Z')"},
|
||||
{at: 1, expect: "path('M 0 0 L 100 100 M 100 200 L 200 200 Z L 400 300 Z')"},
|
||||
{at: 2, expect: "path('M 0 0 L 100 100 M 100 200 L 200 200 Z L 600 500 Z')"},
|
||||
]);
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('M 0 0 L 100 100 M 100 200 L 200 200 Z L 200 100 Z')",
|
||||
to: "path('M 0 0 L 100 100 m 0 100 l 100 0 z l 100 -100 z')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M 0 0 L 100 100 M 100 200 L 200 200 Z L 200 100 Z')"},
|
||||
{at: 0, expect: "path('M 0 0 L 100 100 M 100 200 L 200 200 Z L 200 100 Z')"},
|
||||
{at: 0.125, expect: "path('M 0 0 L 100 100 M 100 200 L 200 200 Z L 200 100 Z')"},
|
||||
{at: 0.875, expect: "path('M 0 0 L 100 100 M 100 200 L 200 200 Z L 200 100 Z')"},
|
||||
{at: 1, expect: "path('M 0 0 L 100 100 M 100 200 L 200 200 Z L 200 100 Z')"},
|
||||
{at: 2, expect: "path('M 0 0 L 100 100 M 100 200 L 200 200 Z L 200 100 Z')"},
|
||||
]);
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('m 10 20 l 40 50 z l 40 60 z m 60 70 l 90 60 z t 70 130')",
|
||||
to: "path('M 210 220 L 170 190 Z L 90 120 Z M 110 130 L 200 230 Z T 220 220')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M -190 -180 L -70 -50 Z L 10 40 Z M 30 50 L 120 70 Z T 60 220')"},
|
||||
{at: 0, expect: "path('M 10 20 L 50 70 Z L 50 80 Z M 70 90 L 160 150 Z T 140 220')"},
|
||||
{at: 0.125, expect: "path('M 35 45 L 65 85 Z L 55 85 Z M 75 95 L 165 160 Z T 150 220')"},
|
||||
{at: 0.875, expect: "path('M 185 195 L 155 175 Z L 85 115 Z M 105 125 L 195 220 Z T 210 220')"},
|
||||
{at: 1, expect: "path('M 210 220 L 170 190 Z L 90 120 Z M 110 130 L 200 230 Z T 220 220')"},
|
||||
{at: 2, expect: "path('M 410 420 L 290 310 Z L 130 160 Z M 150 170 L 240 310 Z T 300 220')"}
|
||||
]);
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('m 10 20 c 40 50 30 60 80 70 c 120 130 170 140 110 160')",
|
||||
to: "path('M 130 100 C 130 150 120 160 210 170 C 290 300 340 310 320 330')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M -110 -60 C -30 -10 -40 0 -30 10 C 130 140 180 150 80 170')"},
|
||||
{at: 0, expect: "path('M 10 20 C 50 70 40 80 90 90 C 210 220 260 230 200 250')"},
|
||||
{at: 0.125, expect: "path('M 25 30 C 60 80 50 90 105 100 C 220 230 270 240 215 260')"},
|
||||
{at: 0.875, expect: "path('M 115 90 C 120 140 110 150 195 160 C 280 290 330 300 305 320')"},
|
||||
{at: 1, expect: "path('M 130 100 C 130 150 120 160 210 170 C 290 300 340 310 320 330')"},
|
||||
{at: 2, expect: "path('M 250 180 C 210 230 200 240 330 250 C 370 380 420 390 440 410')"}
|
||||
]);
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('m 10 20 q 30 60 40 50 q 110 80 90 80')",
|
||||
to: "path('M 130 100 Q 120 160 130 150 Q 200 150 180 190')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M -110 -60 Q -40 0 -30 -10 Q 120 150 100 110')"},
|
||||
{at: 0, expect: "path('M 10 20 Q 40 80 50 70 Q 160 150 140 150')"},
|
||||
{at: 0.125, expect: "path('M 25 30 Q 50 90 60 80 Q 165 150 145 155')"},
|
||||
{at: 0.875, expect: "path('M 115 90 Q 110 150 120 140 Q 195 150 175 185')"},
|
||||
{at: 1, expect: "path('M 130 100 Q 120 160 130 150 Q 200 150 180 190')"},
|
||||
{at: 2, expect: "path('M 250 180 Q 200 240 210 230 Q 240 150 220 230')"}
|
||||
]);
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('m 10 20 s 30 60 40 50 s 110 60 90 70')",
|
||||
to: "path('M 130 140 S 120 160 130 150 S 200 170 140 180')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M -110 -100 S -40 0 -30 -10 S 120 90 140 100')"},
|
||||
{at: 0, expect: "path('M 10 20 S 40 80 50 70 S 160 130 140 140')"},
|
||||
{at: 0.125, expect: "path('M 25 35 S 50 90 60 80 S 165 135 140 145')"},
|
||||
{at: 0.875, expect: "path('M 115 125 S 110 150 120 140 S 195 165 140 175')"},
|
||||
{at: 1, expect: "path('M 130 140 S 120 160 130 150 S 200 170 140 180')"},
|
||||
{at: 2, expect: "path('M 250 260 S 200 240 210 230 S 240 210 140 220')"}
|
||||
]);
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('m 10 20 h 30 v 60 h 10 v -10 l 110 60')",
|
||||
to: "path('M 130 140 H 120 V 160 H 130 V 150 L 200 170')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M -110 -100 H -40 V 0 H -30 V -10 L 120 90')"},
|
||||
{at: 0, expect: "path('M 10 20 H 40 V 80 H 50 V 70 L 160 130')"},
|
||||
{at: 0.125, expect: "path('M 25 35 H 50 V 90 H 60 V 80 L 165 135')"},
|
||||
{at: 0.875, expect: "path('M 115 125 H 110 V 150 H 120 V 140 L 195 165')"},
|
||||
{at: 1, expect: "path('M 130 140 H 120 V 160 H 130 V 150 L 200 170')"},
|
||||
{at: 2, expect: "path('M 250 260 H 200 V 240 H 210 V 230 L 240 210')"}
|
||||
]);
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('m 10 20 a 10 20 30 1 0 40 50 a 110 120 30 1 1 140 50')",
|
||||
to: "path('M 18 12 A 50 100 70 0 1 90 110 A 150 160 70 0 1 70 80')"
|
||||
}, [
|
||||
{at: -1, expect: "path('M 2 28 A -30 -60 -10 1 0 10 30 A 70 80 -10 1 1 310 160')"},
|
||||
{at: 0, expect: "path('M 10 20 A 10 20 30 1 0 50 70 A 110 120 30 1 1 190 120')"},
|
||||
{at: 0.125, expect: "path('M 11 19 A 15 30 35 1 0 55 75 A 115 125 35 1 1 175 115')"},
|
||||
{at: 0.875, expect: "path('M 17 13 A 45 90 65 0 1 85 105 A 145 155 65 0 1 85 85')"},
|
||||
{at: 1, expect: "path('M 18 12 A 50 100 70 0 1 90 110 A 150 160 70 0 1 70 80')"},
|
||||
{at: 2, expect: "path('M 26 4 A 90 180 110 0 1 130 150 A 190 200 110 0 1 -50 40')"}
|
||||
]);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,81 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>offset-distance interpolation</title>
|
||||
<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org">
|
||||
<link rel="help" href="https://drafts.fxtf.org/motion-1/#offset-distance-property">
|
||||
<meta name="assert" content="offset-distance supports animation.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="resources/interpolation-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
test_no_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "path('M 0 0 L 100 100 M 100 200 L 200 200 Z L 200 100 Z')",
|
||||
to: "ray(0deg closest-side)",
|
||||
});
|
||||
|
||||
test_no_interpolation({
|
||||
property: 'offset-path',
|
||||
from: "ray(0deg closest-corner)",
|
||||
to: "none",
|
||||
});
|
||||
|
||||
// No interpolation to a ray from the initial value 'none'.
|
||||
test_no_interpolation({
|
||||
property: 'offset-path',
|
||||
from: 'none',
|
||||
to: 'ray(20deg closest-side)',
|
||||
});
|
||||
|
||||
// Interpolation between rays.
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: 'ray(10deg sides contain)',
|
||||
to: 'ray(50deg sides contain)'
|
||||
}, [
|
||||
{at: -1, expect: 'ray(-30deg sides contain)'},
|
||||
{at: 0, expect: 'ray(10deg sides contain)'},
|
||||
{at: 0.125, expect: 'ray(15deg sides contain)'},
|
||||
{at: 0.875, expect: 'ray(45deg sides contain)'},
|
||||
{at: 1, expect: 'ray(50deg sides contain)'},
|
||||
{at: 2, expect: 'ray(90deg sides contain)'},
|
||||
]);
|
||||
|
||||
test_interpolation({
|
||||
property: 'offset-path',
|
||||
from: 'ray(-10deg farthest-corner)',
|
||||
to: 'ray(-50deg farthest-corner)'
|
||||
}, [
|
||||
{at: -1, expect: 'ray(30deg farthest-corner)'},
|
||||
{at: 0, expect: 'ray(-10deg farthest-corner)'},
|
||||
{at: 0.125, expect: 'ray(-15deg farthest-corner)'},
|
||||
{at: 0.875, expect: 'ray(-45deg farthest-corner)'},
|
||||
{at: 1, expect: 'ray(-50deg farthest-corner)'},
|
||||
{at: 2, expect: 'ray(-90deg farthest-corner)'},
|
||||
]);
|
||||
|
||||
// No interpolation between different sizes and/or different containment.
|
||||
test_no_interpolation({
|
||||
property: 'offset-path',
|
||||
from: 'ray(200deg farthest-side)',
|
||||
to: 'ray(300deg sides)'
|
||||
});
|
||||
test_no_interpolation({
|
||||
property: 'offset-path',
|
||||
from: 'ray(200deg sides contain)',
|
||||
to: 'ray(300deg sides)'
|
||||
});
|
||||
test_no_interpolation({
|
||||
property: 'offset-path',
|
||||
from: 'ray(200deg farthest-side contain)',
|
||||
to: 'ray(300deg sides)'
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue