author | Mantaroh Yoshinaga <mantaroh@gmail.com> |
Mon, 04 Apr 2016 16:39:00 +0200 | |
changeset 291840 | fabbda4a082a27cd6a9b04d8ab198b160b13871d |
parent 291839 | 3a1f7178cc4813b9b03f0642297ec93528d02002 |
child 291841 | 45b2a2adec04c7349f887f77dbaaefca986659fc |
push id | 74692 |
push user | cbook@mozilla.com |
push date | Wed, 06 Apr 2016 07:06:16 +0000 |
treeherder | mozilla-inbound@45b2a2adec04 [default view] [failures only] |
perfherder | [talos] [build metrics] [platform microbench] (compared to previous push) |
reviewers | birtles |
bugs | 1259344 |
milestone | 48.0a1 |
first release with | nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
|
last release without | nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
|
--- a/dom/animation/test/css-animations/file_animation-cancel.html +++ b/dom/animation/test/css-animations/file_animation-cancel.html @@ -12,105 +12,96 @@ from { margin-left: 100px } to { margin-left: 200px } } </style> <body> <script> 'use strict'; -async_test(function(t) { +promise_test(function(t) { var div = addDiv(t, { style: 'animation: translateAnim 100s' }); + var animation = div.getAnimations()[0]; - var animation = div.getAnimations()[0]; - animation.ready.then(t.step_func(function() { + return animation.ready.then(function() { assert_not_equals(getComputedStyle(div).transform, 'none', 'transform style is animated before cancelling'); animation.cancel(); assert_equals(getComputedStyle(div).transform, 'none', 'transform style is no longer animated after cancelling'); - t.done(); - })); + }); }, 'Animated style is cleared after cancelling a running CSS animation'); -async_test(function(t) { +promise_test(function(t) { var div = addDiv(t, { style: 'animation: translateAnim 100s forwards' }); - var animation = div.getAnimations()[0]; animation.finish(); - animation.ready.then(t.step_func(function() { + return animation.ready.then(function() { assert_not_equals(getComputedStyle(div).transform, 'none', 'transform style is filling before cancelling'); animation.cancel(); assert_equals(getComputedStyle(div).transform, 'none', 'fill style is cleared after cancelling'); - t.done(); - })); + }); }, 'Animated style is cleared after cancelling a filling CSS animation'); -async_test(function(t) { +promise_test(function(t) { var div = addDiv(t, { style: 'animation: translateAnim 100s' }); var animation = div.getAnimations()[0]; - div.addEventListener('animationend', t.step_func(function() { assert_unreached('Got unexpected end event on cancelled animation'); })); - animation.ready.then(t.step_func(function() { + return animation.ready.then(function() { // Seek to just before the end then cancel animation.currentTime = 99.9 * 1000; animation.cancel(); // Then wait a couple of frames and check that no event was dispatched return waitForAnimationFrames(2); - })).then(t.step_func(function() { - t.done(); - })); + }); }, 'Cancelled CSS animations do not dispatch events'); test(function(t) { var div = addDiv(t, { style: 'animation: marginLeftAnim 100s linear' }); + var animation = div.getAnimations()[0]; + animation.cancel(); - var animation = div.getAnimations()[0]; - - animation.cancel(); assert_equals(getComputedStyle(div).marginLeft, '0px', 'margin-left style is not animated after cancelling'); animation.currentTime = 50 * 1000; assert_equals(getComputedStyle(div).marginLeft, '50px', 'margin-left style is updated when cancelled animation is' + ' seeked'); }, 'After cancelling an animation, it can still be seeked'); -async_test(function(t) { +promise_test(function(t) { var div = addDiv(t, { style: 'animation: marginLeftAnim100To200 100s linear' }); + var animation = div.getAnimations()[0]; - var animation = div.getAnimations()[0]; - animation.ready.then(t.step_func(function() { + return animation.ready.then(function() { animation.cancel(); assert_equals(getComputedStyle(div).marginLeft, '0px', 'margin-left style is not animated after cancelling'); animation.play(); assert_equals(getComputedStyle(div).marginLeft, '100px', 'margin-left style is animated after re-starting animation'); return animation.ready; - })).then(t.step_func(function() { + }).then(function() { assert_equals(animation.playState, 'running', 'Animation succeeds in running after being re-started'); - t.done(); - })); + }); }, 'After cancelling an animation, it can still be re-used'); test(function(t) { var div = addDiv(t, { style: 'animation: marginLeftAnim100To200 100s linear' }); - var animation = div.getAnimations()[0]; animation.cancel(); assert_equals(getComputedStyle(div).marginLeft, '0px', 'margin-left style is not animated after cancelling'); // Trigger a change to some animation properties and check that this // doesn't cause the animation to become live again div.style.animationDuration = '200s'; @@ -121,17 +112,16 @@ test(function(t) { assert_equals(animation.playState, 'idle', 'Animation is still idle after updating animation-duration'); }, 'After cancelling an animation, updating animation properties doesn\'t make' + ' it live again'); test(function(t) { var div = addDiv(t, { style: 'animation: marginLeftAnim100To200 100s linear' }); - var animation = div.getAnimations()[0]; animation.cancel(); assert_equals(getComputedStyle(div).marginLeft, '0px', 'margin-left style is not animated after cancelling'); // Make some changes to animation-play-state and check that the // animation doesn't become live again. This is because it should be // possible to cancel an animation from script such that all future
--- a/dom/animation/test/css-animations/file_animation-playstate.html +++ b/dom/animation/test/css-animations/file_animation-playstate.html @@ -3,76 +3,69 @@ <script src="../testcommon.js"></script> <style> @keyframes anim { } </style> <body> <script> 'use strict'; -async_test(function(t) { +promise_test(function(t) { var div = addDiv(t); var cs = window.getComputedStyle(div); div.style.animation = 'anim 1000s'; - var animation = div.getAnimations()[0]; assert_equals(animation.playState, 'pending'); - animation.ready.then(t.step_func(function() { + return animation.ready.then(function() { assert_equals(animation.playState, 'running'); - t.done(); - })); + }); }, 'Animation returns correct playState when running'); -async_test(function(t) { +promise_test(function(t) { var div = addDiv(t); var cs = window.getComputedStyle(div); div.style.animation = 'anim 1000s paused'; - var animation = div.getAnimations()[0]; assert_equals(animation.playState, 'pending'); - animation.ready.then(t.step_func(function() { + return animation.ready.then(function() { assert_equals(animation.playState, 'paused'); - t.done(); - })); + }); }, 'Animation returns correct playState when paused'); -async_test(function(t) { +promise_test(function(t) { var div = addDiv(t); var cs = window.getComputedStyle(div); div.style.animation = 'anim 1000s'; - var animation = div.getAnimations()[0]; animation.pause(); assert_equals(animation.playState, 'pending'); - animation.ready.then(t.step_func(function() { + return animation.ready.then(function() { assert_equals(animation.playState, 'paused'); - t.done(); - })); + }); }, 'Animation.playState updates when paused by script'); test(function(t) { var div = addDiv(t); var cs = window.getComputedStyle(div); div.style.animation = 'anim 1000s paused'; - var animation = div.getAnimations()[0]; div.style.animationPlayState = 'running'; + // This test also checks that calling playState flushes style assert_equals(animation.playState, 'pending', 'Animation.playState reports pending after updating' + ' animation-play-state (got: ' + animation.playState + ')'); }, 'Animation.playState updates when resumed by setting style'); test(function(t) { var div = addDiv(t); div.style.animation = 'anim 1000s'; - var animation = div.getAnimations()[0]; animation.cancel(); assert_equals(animation.playState, 'idle'); }, 'Animation returns correct playState when cancelled'); done(); </script> </body>