[animation-worklet] Deflake tests running with threaded compositing

Don't assume a certain number of frames for receiving style updates
rather poll everyframe until change is noticed.


Bug: 915352
Change-Id: I92c78bc94c82de561f4867a596c449eb6dd39603
Reviewed-on: https://chromium-review.googlesource.com/c/1495227
Commit-Queue: Majid Valipour <majidvp@chromium.org>
Reviewed-by: Yi Gu <yigu@chromium.org>
Cr-Commit-Position: refs/heads/master@{#636841}

third_party/blink/web_tests/TestExpectations

@@ -5947,9 +5947,6 @@ crbug.com/754910 virtual/origin-trials-runtimeflags-disabled/http/tests/origin_t
 crbug.com/936827 external/wpt/fullscreen/api/element-request-fullscreen-and-remove-manual.html [ Failure Pass ]
 
 # Enable WPT animation-worklet test to run with threaded-compositing
-crbug.com/915352 virtual/threaded/external/wpt/animation-worklet/animation-worklet-inside-iframe.https.html [ Pass Failure ]
-crbug.com/915352 virtual/threaded/external/wpt/animation-worklet/animator-animate.https.html [ Pass Failure ]
-crbug.com/915352 virtual/threaded/external/wpt/animation-worklet/animator-with-options.https.html [ Pass Failure ]
 crbug.com/915352 virtual/threaded/external/wpt/animation-worklet/playback-rate.https.html [ Pass Failure ]
 crbug.com/915352 virtual/threaded/external/wpt/animation-worklet/scroll-timeline-writing-modes.https.html [ Pass Failure ]
 crbug.com/915352 virtual/threaded/external/wpt/animation-worklet/worklet-animation-pause-resume.https.html [ Pass Failure ]

third_party/blink/web_tests/external/wpt/animation-worklet/animation-worklet-inside-iframe.https.html

@@ -48,7 +48,11 @@ async_test(t => {
       animation.play();
 
       assert_equals(data, '0.4');
-      waitForAsyncAnimationFrames(1).then(t.step_func_done(() => {
+
+      // wait until local times are synced back to the main thread.
+      waitForAnimationFrameWithCondition(_ => {
+        return getComputedStyle(target).opacity != '1';
+      }).then(t.step_func_done(() => {
         assert_equals(getComputedStyle(target).opacity, '0.5');
       }));
     });

third_party/blink/web_tests/external/wpt/animation-worklet/animator-animate.https.html

@@ -16,7 +16,10 @@
     const animation = new WorkletAnimation('constant_time', effect);
     animation.play();
 
-    await waitForAsyncAnimationFrames(1);
+    // wait until local times are synced back to the main thread.
+    await waitForAnimationFrameWithCondition(_ => {
+      return getComputedStyle(target).opacity != '1';
+    });
     assert_equals(getComputedStyle(target).opacity, "0.5");
   }, "Simple worklet animation should output values at specified local time");
 </script>
\ No newline at end of file

third_party/blink/web_tests/external/wpt/animation-worklet/animator-with-options.https.html

@@ -29,7 +29,10 @@
     const animation = new WorkletAnimation('test_animator', effect, document.timeline, options);
     animation.play();
 
-    await waitForAsyncAnimationFrames(1);
+    // wait until local times are synced back to the main thread.
+    await waitForAnimationFrameWithCondition(_ => {
+      return getComputedStyle(target).opacity != '1';
+    });
     assert_equals(getComputedStyle(target).opacity, "0.5");
   }, "Animator should be able to use options to update the animation");
 </script>
\ No newline at end of file

third_party/blink/web_tests/external/wpt/animation-worklet/resources/animator-iframe.html

@@ -33,7 +33,11 @@ runInAnimationWorklet(
   const effect = new KeyframeEffect(target, [{ opacity: 0 }], { duration: 1000 });
   const animation = new WorkletAnimation('iframe_animator', effect);
   animation.play();
-  waitForAnimationFrames(2).then(_ => {
+
+  // wait until local times are synced back to the main thread.
+  waitForAnimationFrameWithCondition(_ => {
+    return getComputedStyle(target).opacity != '1';
+  }).then(_ => {
     window.parent.postMessage(getComputedStyle(target).opacity, '*');
   });
  });