Bug 1421476 - Add waitForNextFrame() that ensures the state in the next frame. r?birtles draft
authorHiroyuki Ikezoe <hikezoe@mozilla.com>
Wed, 29 Nov 2017 13:04:17 +0900
changeset 704921 76de39c1a41cfb0fe60fd1ec208796ec36876bda
parent 704807 cb9092a90f6ef501e6de8eb5fc6ce19e2717193f
child 704922 c64d9907446481d6ac96e1afa3d6cb45a3408776
push id91278
push userhikezoe@mozilla.com
push dateWed, 29 Nov 2017 04:07:53 +0000
reviewersbirtles
bugs1421476
milestone59.0a1
Bug 1421476 - Add waitForNextFrame() that ensures the state in the next frame. r?birtles With the conformant Promise handling, there are cases that we are still in the same tick even after we got a reqeustAnimationFrame. For example, if we call requestAnimationFrame() in the callback for an animationstart event, the callback is processed just before the callback for requestAnimationFrame is processed in a tick, so we are still in the same tick even after we got the requestAnimationFrame. MozReview-Commit-ID: Cgnu7Mk4Nl8
dom/animation/test/testcommon.js
--- a/dom/animation/test/testcommon.js
+++ b/dom/animation/test/testcommon.js
@@ -207,16 +207,34 @@ function propertyToIDL(property) {
  */
 function waitForFrame() {
   return new Promise(function(resolve, reject) {
     window.requestAnimationFrame(resolve);
   });
 }
 
 /**
+ * Waits for a requestAnimationFrame callback in the next refresh driver tick.
+ * Note that 'dom.animations-api.core.enabled' pref should be true to use this
+ * function.
+ */
+function waitForNextFrame() {
+  const timeAtStart = document.timeline.currentTime;
+  return new Promise(resolve => {
+    window.requestAnimationFrame(() => {
+      if (timeAtStart === document.timeline.currentTime) {
+        window.requestAnimationFrame(resolve);
+      } else {
+        resolve();
+      }
+    });
+  });
+}
+
+/**
  * Returns a Promise that is resolved after the given number of consecutive
  * animation frames have occured (using requestAnimationFrame callbacks).
  *
  * @param frameCount  The number of animation frames.
  * @param onFrame  An optional function to be processed in each animation frame.
  */
 function waitForAnimationFrames(frameCount, onFrame) {
   return new Promise(function(resolve, reject) {