1298742-1.html (806B)
1 <!DOCTYPE html> 2 <html class="reftest-wait reftest-no-flush"> 3 <title>Bug 1298742</title> 4 <style> 5 div { 6 width: 100px; 7 height: 100px; 8 background: blue; 9 transform: translate(10px); 10 } 11 </style> 12 <div id="target"></div> 13 <script> 14 const MS_PER_SEC = 1000; 15 var elem = document.getElementById("target"); 16 var animA = 17 elem.animate({ transform: [ 'translate(0px)', 'translate(60px)' ] }, 18 100 * MS_PER_SEC); 19 var animB = 20 elem.animate({ transform: [ 'translate(60px)', 'translate(0px)' ] }, 21 100 * MS_PER_SEC); 22 animA.pause(); 23 animB.pause(); 24 25 Promise.all([animA.ready, animB.ready]).then(function() { 26 animB.effect = null; 27 requestAnimationFrame(function() { 28 document.documentElement.classList.remove("reftest-wait"); 29 }); 30 }); 31 </script> 32 </html>