| Index: LayoutTests/virtual/threaded/animations/composited-animation-independent-transform-cancel.html
|
| diff --git a/LayoutTests/virtual/threaded/animations/composited-animation-independent-transform-cancel.html b/LayoutTests/virtual/threaded/animations/composited-animation-independent-transform-cancel.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..35e8172bab738c8aa2903ca2d095dd9c4958875e
|
| --- /dev/null
|
| +++ b/LayoutTests/virtual/threaded/animations/composited-animation-independent-transform-cancel.html
|
| @@ -0,0 +1,86 @@
|
| +<!DOCTYPE html>
|
| +<script src="../../../resources/testharness.js"></script>
|
| +<script src="../../../resources/testharnessreport.js"></script>
|
| +
|
| +<div id="parent"></div>
|
| +
|
| +<script>
|
| +var keyframeValueMap = {
|
| + translate: '10px 10px 10px',
|
| + scale: '1 2 3',
|
| + rotate: '45deg',
|
| + transform: 'translate(10px, 20px)',
|
| + opacity: '1'
|
| +};
|
| +
|
| +/* Test that animation on compositableProperty on compositor is cancelled when
|
| + cancelProperty is animated on the element */
|
| +function assertAnimationComposited(compositableProperty, cancelProperty, isStillComposited) {
|
| + var element = document.createElement('div');
|
| + document.getElementById('parent').appendChild(element);
|
| +
|
| + var keyframe = {};
|
| + keyframe[compositableProperty] = keyframeValueMap[compositableProperty];
|
| +
|
| + var animation = element.animate([keyframe, keyframe], {
|
| + duration: 4000,
|
| + iterations: Infinity
|
| + });
|
| +
|
| + var description = "Compositor Animation on " + compositableProperty + (isStillComposited ? " is not " : " is ") + "cancelled by " + cancelProperty;
|
| + var asyncHandle = async_test(description);
|
| + requestAnimationFrame(function() {
|
| + requestAnimationFrame(function() {
|
| +
|
| + asyncHandle.step(function() {
|
| + assert_true(internals.isCompositedAnimation(animation), compositableProperty + " animation should be composited");
|
| + });
|
| +
|
| + var keyframe2 = {};
|
| + keyframe2[cancelProperty] = keyframeValueMap[cancelProperty];
|
| + animation = element.animate([keyframe2, keyframe2], {
|
| + duration: 4000,
|
| + iterations: Infinity
|
| + });
|
| +
|
| + requestAnimationFrame(function() {
|
| + requestAnimationFrame(function() {
|
| +
|
| + asyncHandle.step(function() {
|
| + assert_equals(internals.isCompositedAnimation(animation), isStillComposited, description)
|
| + });
|
| +
|
| + animation.cancel();
|
| + asyncHandle.done();
|
| + });
|
| + });
|
| + });
|
| + });
|
| +}
|
| +
|
| +assertAnimationComposited('transform', 'transform', false);
|
| +
|
| +assertAnimationComposited('transform', 'translate', false);
|
| +assertAnimationComposited('transform', 'rotate', false);
|
| +assertAnimationComposited('transform', 'scale', false);
|
| +
|
| +assertAnimationComposited('translate', 'transform', false);
|
| +assertAnimationComposited('translate', 'rotate', false);
|
| +assertAnimationComposited('translate', 'scale', false);
|
| +assertAnimationComposited('translate', 'translate', false);
|
| +
|
| +assertAnimationComposited('rotate', 'transform', false);
|
| +assertAnimationComposited('rotate', 'rotate', false);
|
| +assertAnimationComposited('rotate', 'scale', false);
|
| +assertAnimationComposited('rotate', 'translate', false);
|
| +
|
| +assertAnimationComposited('scale', 'transform', false);
|
| +assertAnimationComposited('scale', 'rotate', false);
|
| +assertAnimationComposited('scale', 'scale', false);
|
| +assertAnimationComposited('scale', 'translate', false);
|
| +
|
| +assertAnimationComposited('opacity', 'transform', true);
|
| +assertAnimationComposited('opacity', 'translate', true);
|
| +assertAnimationComposited('opacity', 'rotate', true);
|
| +assertAnimationComposited('opacity', 'scale', true);
|
| +</script>
|
|
|
Chromium Code Reviews
Issue 1218943002:
Compositor animations for Independent CSS Transform Properties (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master