| OLD | NEW |
| (Empty) |
| 1 <!DOCTYPE html> | |
| 2 <script src="../resources/testharness.js"></script> | |
| 3 <script src="../resources/testharnessreport.js"></script> | |
| 4 <style> | |
| 5 div { | |
| 6 width: 50px; | |
| 7 height: 50px; | |
| 8 background: green; | |
| 9 } | |
| 10 </style> | |
| 11 <div id=target1></div> | |
| 12 <div id=target2></div> | |
| 13 <script> | |
| 14 var anim1, anim2; | |
| 15 anim1 = target1.animate([ | |
| 16 {transform: 'none'}, | |
| 17 {transform: 'translateX(500px)'}, | |
| 18 ], 1000); | |
| 19 | |
| 20 function awaitFrame(frameTest) { | |
| 21 return new Promise(resolve => { | |
| 22 requestAnimationFrame(() => { | |
| 23 if (frameTest()) { | |
| 24 resolve(); | |
| 25 } else { | |
| 26 awaitFrame(frameTest).then(resolve); | |
| 27 } | |
| 28 }); | |
| 29 }); | |
| 30 } | |
| 31 | |
| 32 awaitFrame(() => anim1.currentTime > 100).then(() => { | |
| 33 requestAnimationFrame(t => { | |
| 34 // Testing a regression where scheduling anim1 and anim2 together caused ani
m2 | |
| 35 // to get anim1's start time. | |
| 36 anim1.startTime = t - 100; | |
| 37 anim2 = target2.animate([ | |
| 38 {transform: 'none'}, | |
| 39 {transform: 'translateX(500px)'}, | |
| 40 ], 200); | |
| 41 }); | |
| 42 }); | |
| 43 | |
| 44 async_test(t => { | |
| 45 awaitFrame(() => anim2 && anim2.startTime != null).then(() => { | |
| 46 t.step(() => assert_not_equals(Math.round(anim1.startTime), Math.round(anim2
.startTime))); | |
| 47 t.done(); | |
| 48 }); | |
| 49 }); | |
| 50 </script> | |
| OLD | NEW |