Deflake virtual/threaded/animations/{opacity,transform}-responsive-neutral-keyframe.html

third_party/WebKit/LayoutTests/animations/opacity-responsive-neutral-keyframe.html

Index: third_party/WebKit/LayoutTests/animations/opacity-responsive-neutral-keyframe.html
diff --git a/third_party/WebKit/LayoutTests/animations/opacity-responsive-neutral-keyframe.html b/third_party/WebKit/LayoutTests/animations/opacity-responsive-neutral-keyframe.html
index 86f1587cdc0e2b83831b2dd7b39df9a920e444ae..b2025a27397c08678eee841c4ffbbf77bc883ff9 100644
--- a/third_party/WebKit/LayoutTests/animations/opacity-responsive-neutral-keyframe.html
+++ b/third_party/WebKit/LayoutTests/animations/opacity-responsive-neutral-keyframe.html
@@ -14,7 +14,7 @@ div {
   background: green;
 }
 @keyframes test {
-  to { opacity: 0.5; }
+  to { opacity: 0; }
 }
 </style>
 <div id="green"></div>
@@ -23,13 +23,14 @@ div {
 if (window.testRunner)
   testRunner.waitUntilDone();
 
-requestAnimationFrame(() => {
-  requestAnimationFrame(() => {
-    target.style.opacity = 0;
-    requestAnimationFrame(() => {
-      if (window.testRunner)
-        testRunner.notifyDone();
-    });
-  });
+function waitForCompositor() {
+  return target.animate({transform: ['none', 'none']}, 1).ready;
+}
+
+waitForCompositor().then(() => {
+  target.style.opacity = '0';
+}).then(() => waitForCompositor()).then(() => {
+  if (window.testRunner)
+    testRunner.notifyDone();
 });
 </script>