| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| #testDiv { |
| transition: transform 30s linear, color 2s, left 4s linear, top 4s linear; |
| position: absolute; |
| } |
| </style> |
| </head> |
| <body> |
| <script src="../../resources/js-test.js"></script> |
| <div id="testDiv">TEST</div> |
| <script> |
| description("Tests that CSS animations that are created while the page is hidden are properly resumed when the page becomes visible."); |
| jsTestIsAsync = true; |
| |
| function registerAnimation() |
| { |
| testDiv.style.transform = "rotate(170deg) scale(0.2781941414347284)"; |
| } |
| |
| onload = function() { |
| internals.suspendAnimations(); |
| |
| setTimeout(function() { |
| registerAnimation(); |
| setTimeout(function() { |
| shouldBeTrue("internals.animationsAreSuspended()"); |
| shouldBe("internals.numberOfActiveAnimations()", "0"); |
| |
| internals.resumeAnimations(); |
| shouldBecomeEqual("internals.numberOfActiveAnimations()", "1", finishJSTest); |
| }, 500); |
| }, 0); |
| } |
| |
| </script> |
| </body> |
| </html> |
