diff --git a/dom/animation/test/chrome/test_running_on_compositor.html b/dom/animation/test/chrome/test_running_on_compositor.html index cb46e3e994c0..ec8fd696aa5c 100644 --- a/dom/animation/test/chrome/test_running_on_compositor.html +++ b/dom/animation/test/chrome/test_running_on_compositor.html @@ -46,6 +46,11 @@ const OMTAPrefKey = 'layers.offmainthreadcomposition.async-animations'; var omtaEnabled = SpecialPowers.DOMWindowUtils.layerManagerRemote && SpecialPowers.getBoolPref(OMTAPrefKey); +function assert_animation_is_running_on_compositor(animation, desc) { + assert_equals(animation.isRunningOnCompositor, omtaEnabled, + desc + ' at ' + animation.currentTime + 'ms'); +} + promise_test(function(t) { // FIXME: When we implement Element.animate, use that here instead of CSS // so that we remove any dependency on the CSS mapping. @@ -53,7 +58,7 @@ promise_test(function(t) { var animation = div.getAnimations()[0]; return animation.ready.then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Animation reports that it is running on the compositor' + ' during playback'); @@ -83,7 +88,7 @@ promise_test(function(t) { var animation = div.getAnimations()[0]; return animation.ready.then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Animation reports that it is running on the compositor' + ' when the animation has two properties, where one can run' + ' on the compositor, the other cannot'); @@ -181,7 +186,7 @@ promise_test(function(t) { return new Promise(function(resolve) { window.requestAnimationFrame(function() { t.step(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Animation reports that it is running on the compositor' + ' in requestAnimationFrame callback'); }); @@ -212,7 +217,7 @@ promise_test(function(t) { assert_true(!!changedAnimation, 'The animation should be recorded ' + 'as one of the changedAnimations'); - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Animation reports that it is running on the compositor' + ' in MutationObserver callback'); }); @@ -244,7 +249,7 @@ promise_test(function(t) { var timeAtStart = window.performance.now(); function handleFrame() { t.step(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Animation reports that it is running on the compositor' + ' in requestAnimationFrame callback'); }); @@ -274,7 +279,7 @@ promise_test(function(t) { var animation = div.getAnimations()[0]; return animation.ready.then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Transition reports that it is running on the compositor' + ' during playback for opacity transition'); }); @@ -287,7 +292,7 @@ promise_test(function(t) { var animation = div.getAnimations()[0]; return animation.ready.then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'If an animation has a property that can run on the compositor and a ' + 'property that cannot (due to Gecko limitations) but where the latter' + 'property is overridden in the CSS cascade, the animation should ' @@ -302,7 +307,7 @@ promise_test(function(t) { { opacity: [ 0, 1 ] }, 200 * MS_PER_SEC); return animation.ready.then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Animation reports that it is running on the compositor'); animation.currentTime = 150 * MS_PER_SEC; @@ -321,7 +326,7 @@ promise_test(function(t) { { opacity: [ 0, 1 ] }, 100 * MS_PER_SEC); return animation.ready.then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Animation reports that it is running on the compositor'); animation.currentTime = 500 * MS_PER_SEC; @@ -333,7 +338,7 @@ promise_test(function(t) { animation.effect.timing.duration = 1000 * MS_PER_SEC; return waitForFrame(); }).then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Animation reports that it is running on the compositor' + ' when restarted'); }); @@ -346,12 +351,12 @@ promise_test(function(t) { { opacity: [ 0, 1 ] }, 100 * MS_PER_SEC); return animation.ready.then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Animation reports that it is running on the compositor'); animation.effect.timing.endDelay = 100 * MS_PER_SEC; - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Animation reports that it is running on the compositor' + ' when endDelay is changed'); @@ -371,7 +376,7 @@ promise_test(function(t) { { opacity: [ 0, 1 ] }, 100 * MS_PER_SEC); return animation.ready.then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Animation reports that it is running on the compositor'); animation.effect.timing.endDelay = -200 * MS_PER_SEC; @@ -390,13 +395,13 @@ promise_test(function(t) { { opacity: [ 0, 1 ] }, 100 * MS_PER_SEC); return animation.ready.then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Animation reports that it is running on the compositor'); animation.effect.timing.endDelay = -50 * MS_PER_SEC; return waitForFrame(); }).then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Animation reports that it is running on the compositor' + ' when endTime is positive and endDelay is negative'); animation.currentTime = 60 * MS_PER_SEC; @@ -426,7 +431,7 @@ promise_test(function(t) { animation.effect.target = div; return waitForFrame(); }).then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Animation reports that it is running on the compositor ' + 'after setting a valid target'); }); @@ -437,7 +442,7 @@ promise_test(function(t) { var animation = div.animate({ opacity: [ 0, 1 ] }, 100 * MS_PER_SEC); return animation.ready.then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Animation reports that it is running on the compositor'); animation.effect.target = null; @@ -463,7 +468,7 @@ promise_test(function(t) { animation.currentTime = 100 * MS_PER_SEC; return waitForFrame(); }).then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Animation with fill:backwards in delay phase reports ' + 'that it is running on the compositor after delay phase'); }); @@ -479,14 +484,14 @@ promise_test(function(t) { var another = addDiv(t); return animation.ready.then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Opacity animation on a 100% opacity keyframe reports ' + 'that it is running on the compositor from the begining'); animation.effect.target = another; return waitForFrame(); }).then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Opacity animation on a 100% opacity keyframe keeps ' + 'running on the compositor after changing the target ' + 'element'); @@ -508,7 +513,7 @@ promise_test(function(t) { { opacity: 0, offset: 1 }]); return waitForFrame(); }).then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, '100% opacity animation set by using setKeyframes reports ' + 'that it is running on the compositor'); }); @@ -532,7 +537,7 @@ promise_test(function(t) { animation.effect = effect; return waitForFrame(); }).then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, '100% opacity animation set up by changing effects reports ' + 'that it is running on the compositor'); }); @@ -553,7 +558,7 @@ promise_test(function(t) { div.style.setProperty("opacity", "1", ""); return waitForFrame(); }).then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Opacity animation reports that it is running on the compositor after ' + 'clearing the !important flag'); }); @@ -568,7 +573,7 @@ promise_test(function(t) { var another = addDiv(t); return Promise.all([firstAnimation.ready, secondAnimation.ready]).then(function() { - assert_equals(secondAnimation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(secondAnimation, 'The second opacity animation on an element reports that ' + 'it is running on the compositor'); assert_equals(firstAnimation.isRunningOnCompositor, false, @@ -578,11 +583,11 @@ promise_test(function(t) { firstAnimation.effect.target = another; return waitForFrame(); }).then(function() { - assert_equals(secondAnimation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(secondAnimation, 'The second opacity animation on the element keeps ' + 'running on the compositor after the preiously overridden ' + 'animation is applied to a different element'); - assert_equals(firstAnimation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(firstAnimation, 'The previously overridden opacity animation reports that ' + 'it it running on the compositor after being applied to a ' + 'different element'); @@ -599,7 +604,7 @@ promise_test(function(t) { var another = addDiv(t); return Promise.all([firstAnimation.ready, secondAnimation.ready]).then(function() { - assert_equals(secondAnimation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(secondAnimation, 'The second opacity animation on an element reports that ' + 'it is running on the compositor'); assert_equals(firstAnimation.isRunningOnCompositor, false, @@ -609,10 +614,10 @@ promise_test(function(t) { secondAnimation.effect.target = another; return waitForFrame(); }).then(function() { - assert_equals(secondAnimation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(secondAnimation, 'The second opacity animation continues to run on the ' + 'compositor after being applied to a different element'); - assert_equals(firstAnimation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(firstAnimation, 'The previously overridden opacity animation now reports ' + 'that it is running on the compositor after the animation ' + 'that was overridding it is applied to a different element'); @@ -629,17 +634,17 @@ promise_test(function(t) { var anotherAnimation = another.animate({ opacity: [0, 1] }, 100 * MS_PER_SEC); return Promise.all([animation.ready, anotherAnimation.ready]).then(function() { - assert_equals(anotherAnimation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(anotherAnimation, 'An opacity animation on an element reports that ' + 'it is running on the compositor'); - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Opacity animation running on a different element reports ' + 'that it is running on the compositor'); anotherAnimation.effect.target = div; return waitForFrame(); }).then(function() { - assert_equals(anotherAnimation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(anotherAnimation, 'Animation continues to run on the compositor after ' + 'being applied to a different element with a ' + 'lower-priority animation'); @@ -659,7 +664,7 @@ promise_test(function(t) { var animation = div.animate({ opacity: [1, 0] }, 100 * MS_PER_SEC); return animation.ready.then(function() { - assert_equals(animation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(animation, 'Opacity animation on an element reports ' + 'that it is running on the compositor'); @@ -689,10 +694,10 @@ promise_test(function(t) { var higherAnimation = another.animate({ opacity: [0, 1] }, 100 * MS_PER_SEC); return Promise.all([lowerAnimation.ready, higherAnimation.ready]).then(function() { - assert_equals(lowerAnimation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(lowerAnimation, 'An opacity animation on an element reports that ' + 'it is running on the compositor'); - assert_equals(higherAnimation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(higherAnimation, 'Opacity animation on a different element reports ' + 'that it is running on the compositor'); @@ -709,7 +714,7 @@ promise_test(function(t) { 'A lower-priority animation does NOT begin running ' + 'on the compositor after being applied to an element ' + 'which has a higher-priority animation'); - assert_equals(higherAnimation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(higherAnimation, 'A higher-priority animation continues to run on the ' + 'compositor even after a lower-priority animation is ' + 'applied to the same element'); @@ -726,10 +731,10 @@ promise_test(function(t) { var higherAnimation = another.animate({ opacity: [0, 1] }, 100 * MS_PER_SEC); return Promise.all([lowerAnimation.ready, higherAnimation.ready]).then(function() { - assert_equals(lowerAnimation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(lowerAnimation, 'An opacity animation on an element reports that ' + 'it is running on the compositor'); - assert_equals(higherAnimation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(higherAnimation, 'Opacity animation on a different element reports ' + 'that it is running on the compositor'); @@ -745,7 +750,7 @@ promise_test(function(t) { assert_equals(lowerAnimation.isRunningOnCompositor, false, 'Animation stops running on the compositor after ' + 'a higher-priority animation applied to the same element'); - assert_equals(higherAnimation.isRunningOnCompositor, omtaEnabled, + assert_animation_is_running_on_compositor(higherAnimation, 'A higher-priority animation begins to running on the ' + 'compositor after being applied to an element which has ' + 'a lower-priority-animation');