| Index: third_party/WebKit/LayoutTests/animations/composition/offset-rotate-composition.html
|
| diff --git a/third_party/WebKit/LayoutTests/animations/composition/offset-rotate-composition.html b/third_party/WebKit/LayoutTests/animations/composition/offset-rotate-composition.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..2f5665460135c89a6398cf503d0d1fc1feb21c41
|
| --- /dev/null
|
| +++ b/third_party/WebKit/LayoutTests/animations/composition/offset-rotate-composition.html
|
| @@ -0,0 +1,94 @@
|
| +<!DOCTYPE html>
|
| +<body>
|
| +<script src="../interpolation/resources/interpolation-test.js"></script>
|
| +<script>
|
| +// Angle rotations compose.
|
| +assertComposition({
|
| + property: 'offset-rotate',
|
| + underlying: '20deg',
|
| + addFrom: '10deg',
|
| + addTo: '20deg',
|
| +}, [
|
| + {at: -0.3, is: '27deg'},
|
| + {at: 0, is: '30deg'},
|
| + {at: 0.3, is: '33deg'},
|
| + {at: 0.6, is: '36deg'},
|
| + {at: 1, is: '40deg'},
|
| + {at: 1.5, is: '45deg'},
|
| +]);
|
| +
|
| +// Angle rotations don't compose with underlying 'auto'.
|
| +assertComposition({
|
| + property: 'offset-rotate',
|
| + underlying: 'auto 20deg',
|
| + addFrom: '10deg',
|
| + addTo: '20deg',
|
| +}, [
|
| + {at: -0.3, is: '7deg'},
|
| + {at: 0, is: '10deg'},
|
| + {at: 0.3, is: '13deg'},
|
| + {at: 0.6, is: '16deg'},
|
| + {at: 1, is: '20deg'},
|
| + {at: 1.5, is: '25deg'},
|
| +]);
|
| +
|
| +// Auto rotations compose with underlying 'auto'.
|
| +assertComposition({
|
| + property: 'offset-rotate',
|
| + underlying: 'auto 20deg',
|
| + addFrom: 'reverse 10deg',
|
| + addTo: 'auto 20deg',
|
| +}, [
|
| + {at: -0.3, is: 'auto 261deg'},
|
| + {at: 0, is: 'auto 210deg'},
|
| + {at: 0.3, is: 'auto 159deg'},
|
| + {at: 0.6, is: 'auto 108deg'},
|
| + {at: 1, is: 'auto 40deg'},
|
| + {at: 1.5, is: 'auto -45deg'},
|
| +]);
|
| +
|
| +// When we can't interpolate, we can't compose.
|
| +assertComposition({
|
| + property: 'offset-rotate',
|
| + underlying: '20deg',
|
| + addFrom: 'reverse 10deg',
|
| + addTo: '20deg',
|
| +}, [
|
| + {at: -0.3, is: 'auto 190deg'},
|
| + {at: 0, is: 'auto 190deg'},
|
| + {at: 0.3, is: 'auto 190deg'},
|
| + {at: 0.6, is: '40deg'},
|
| + {at: 1, is: '40deg'},
|
| + {at: 1.5, is: '40deg'},
|
| +]);
|
| +
|
| +assertComposition({
|
| + property: 'offset-rotate',
|
| + underlying: '20deg',
|
| + replaceFrom: 'reverse 10deg',
|
| + addTo: '20deg',
|
| +}, [
|
| + {at: -0.3, is: 'auto 190deg'},
|
| + {at: 0, is: 'auto 190deg'},
|
| + {at: 0.3, is: 'auto 190deg'},
|
| + {at: 0.6, is: '40deg'},
|
| + {at: 1, is: '40deg'},
|
| + {at: 1.5, is: '40deg'},
|
| +]);
|
| +
|
| +// Angle rotations compose with underlying angle.
|
| +assertComposition({
|
| + property: 'offset-rotate',
|
| + underlying: '20deg',
|
| + addFrom: '10deg',
|
| + replaceTo: '10deg',
|
| +}, [
|
| + {at: -0.3, is: '36deg'},
|
| + {at: 0, is: '30deg'},
|
| + {at: 0.3, is: '24deg'},
|
| + {at: 0.6, is: '18deg'},
|
| + {at: 1, is: '10deg'},
|
| + {at: 1.5, is: '0deg'},
|
| +]);
|
| +</script>
|
| +</body>
|
|
|
Chromium Code Reviews
Issue 2555543002:
CSS Motion Path: Support offset-rotate in addition to offset-rotation (Closed)
