blob: 524aaefe482d88f543b8f7715d86b7926254059e [file] [log] [blame]
<!DOCTYPE html>
<meta charset="UTF-8">
<body>
<script src="resources/interpolation-test.js"></script>
<script>
'use strict';
// Distinct number of path segments
assertNoInterpolation({
property: 'offset-path',
from: "path('M 0 0 H 1 H 2')",
to: "path('M 0 0 H 3')"
});
assertNoInterpolation({
property: 'offset-path',
from: "path('M 1 2 L 3 4 Z')",
to: "none"
});
// Distinct segment types
assertNoInterpolation({
property: 'offset-path',
from: "path('M 10 0 H 11')",
to: "path('M 20 0 V 2')"
});
assertNoInterpolation({
property: 'offset-path',
from: "path('M 1 2 L 4 6 Z')",
to: "path('M 1 2 L 4 6')"
});
// Exercise each segment type
assertInterpolation({
property: 'offset-path',
from: "path('M 0 0 Z')",
to: "path('M 0 0 Z')"
}, [
{at: -0.4, is: "path('M 0 0 Z')"},
{at: 0, is: "path('M 0 0 Z')"},
{at: 0.2, is: "path('M 0 0 Z')"},
{at: 0.6, is: "path('M 0 0 Z')"},
{at: 1, is: "path('M 0 0 Z')"},
{at: 1.4, is: "path('M 0 0 Z')"}
]);
assertInterpolation({
property: 'offset-path',
from: "path('M 20 50')",
to: "path('M 30 70')"
}, [
{at: -0.4, is: "path('M 16 42')"},
{at: 0, is: "path('M 20 50')"},
{at: 0.2, is: "path('M 22 54')"},
{at: 0.6, is: "path('M 26 62')"},
{at: 1, is: "path('M 30 70')"},
{at: 1.4, is: "path('M 34 78')"}
]);
assertInterpolation({
property: 'offset-path',
from: "path('m 20 50')",
to: "path('m 30 70')"
}, [
{at: -0.4, is: "path('M 16 42')"},
{at: 0, is: "path('M 20 50')"},
{at: 0.2, is: "path('M 22 54')"},
{at: 0.6, is: "path('M 26 62')"},
{at: 1, is: "path('M 30 70')"},
{at: 1.4, is: "path('M 34 78')"}
]);
assertInterpolation({
property: 'offset-path',
from: "path('m 0 0 L 20 50')",
to: "path('m 0 0 L 30 70')"
}, [
{at: -0.4, is: "path('M 0 0 L 16 42')"},
{at: 0, is: "path('M 0 0 L 20 50')"},
{at: 0.2, is: "path('M 0 0 L 22 54')"},
{at: 0.6, is: "path('M 0 0 L 26 62')"},
{at: 1, is: "path('M 0 0 L 30 70')"},
{at: 1.4, is: "path('M 0 0 L 34 78')"}
]);
assertInterpolation({
property: 'offset-path',
from: "path('m 0 0 l 20 50')",
to: "path('m 0 0 l 30 70')"
}, [
{at: -0.4, is: "path('M 0 0 L 16 42')"},
{at: 0, is: "path('M 0 0 L 20 50')"},
{at: 0.2, is: "path('M 0 0 L 22 54')"},
{at: 0.6, is: "path('M 0 0 L 26 62')"},
{at: 1, is: "path('M 0 0 L 30 70')"},
{at: 1.4, is: "path('M 0 0 L 34 78')"}
]);
</script>
</body>