Bug 1504929 - Start animations once after a MozReftestInvalidate even…

…t is received. r=sotaro We need the same workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=1489327 . And unfortunately we have to disable animate-backface-hidden.html on MacOSX opt builds for WebRender because the test fails intermittently, we will enable it in bug 1506758. Depends on D11601 Differential Revision: https://phabricator.services.mozilla.com/D11726
mozilla-spidermonkey · Nov 13, 2018 · acdd60f · acdd60f
1 parent e3fe326
commit acdd60f
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 30 deletions.
diff --git a/layout/reftests/transform-3d/animate-backface-hidden.html b/layout/reftests/transform-3d/animate-backface-hidden.html
@@ -16,8 +16,6 @@
   background: blue;
   height: 200px; width: 200px;
   backface-visibility: hidden;
-  /* use a -99.9s delay to start at 99.9% and then move to 0% */
-  animation: flip 100s -99.9s linear 2 paused;
 }
 
 </style>
@@ -27,14 +25,6 @@
 
 <script>
 
-document.getElementById("test").addEventListener("animationstart", StartListener);
-
-function StartListener(event) {
-  var test = document.getElementById("test");
-  test.style.animationPlayState = 'running';
-  test.addEventListener("animationiteration", IterationListener);
-}
-
 function IterationListener(event) {
   setTimeout(RemoveReftestWait, 0);
 }
@@ -43,4 +33,13 @@
   document.documentElement.classList.remove("reftest-wait");
 }
 
+document.addEventListener('MozReftestInvalidate', () => {
+  test.addEventListener("animationstart", () => {
+    test.style.animationPlayState = 'running';
+    test.addEventListener("animationiteration", IterationListener);
+  });
+  /* use a -99.9s delay to start at 99.9% and then move to 0% */
+  test.style.animation = 'flip 100s -99.9s linear 2 paused';
+}, false);
+
 </script>
diff --git a/layout/reftests/transform-3d/animate-preserve3d-child.html b/layout/reftests/transform-3d/animate-preserve3d-child.html
@@ -1,5 +1,5 @@
 <!DOCTYPE HTML>
-<html class="reftest-wait">
+<html class="reftest-wait reftest-no-flush">
 <title>Testcase, bug 1176969</title>
 <style>
 
@@ -17,8 +17,6 @@
   height: 200px; width: 200px;
   border: 1px solid black;
   transform-style: preserve-3d;
-  /* use a -99.9s delay to start at 99.9% and then move to 0% */
-  animation: spin 100s -99.9s linear 2;
 }
 
 @keyframes noop {
@@ -29,7 +27,6 @@
   height: 100px; width: 100px; margin: 50px;
   background: yellow;
   box-shadow: 3px 3px olive;
-  animation: noop infinite 10s linear;
 }
 
 </style>
@@ -43,8 +40,6 @@
 
 <script>
 
-document.getElementById("parent").addEventListener("animationiteration", IterationListener);
-
 function IterationListener(event) {
   setTimeout(RemoveReftestWait, 0);
 }
@@ -53,4 +48,13 @@
   document.documentElement.classList.remove("reftest-wait");
 }
 
+document.addEventListener('MozReftestInvalidate', () => {
+  const parentElement = document.getElementById('parent');
+  parentElement.addEventListener('animationiteration', IterationListener);
+
+  /* use a -99.9s delay to start at 99.9% and then move to 0% */
+  parentElement.style.animation = 'spin 100s -99.9s linear 2';
+  child.style.animation = 'noop infinite 10s linear';
+}, false);
+
 </script>
diff --git a/layout/reftests/transform-3d/animate-preserve3d-parent.html b/layout/reftests/transform-3d/animate-preserve3d-parent.html
@@ -1,5 +1,5 @@
 <!DOCTYPE HTML>
-<html class="reftest-wait">
+<html class="reftest-wait reftest-no-flush">
 <title>Testcase, bug 1176969</title>
 <style>
 
@@ -17,8 +17,6 @@
   height: 200px; width: 200px;
   border: 1px solid black;
   transform-style: preserve-3d;
-  /* use a -99.9s delay to start at 99.9% and then move to 0% */
-  animation: spin 100s -99.9s linear 2 paused;
 }
 
 #child {
@@ -39,14 +37,6 @@
 
 <script>
 
-document.getElementById("parent").addEventListener("animationstart", StartListener);
-
-function StartListener(event) {
-  var test = document.getElementById("parent");
-  test.style.animationPlayState = 'running';
-  test.addEventListener("animationiteration", IterationListener);
-}
-
 function IterationListener(event) {
   setTimeout(RemoveReftestWait, 0);
 }
@@ -55,4 +45,12 @@
   document.documentElement.classList.remove("reftest-wait");
 }
 
+document.addEventListener('MozReftestInvalidate', () => {
+  const test = document.getElementById("parent");
+  test.addEventListener("animationiteration", IterationListener);
+
+  /* use a -99.9s delay to start at 99.9% and then move to 0% */
+  test.style.animation = 'spin 100s -99.9s linear 2';
+}, false);
+
 </script>
diff --git a/layout/reftests/transform-3d/reftest.list b/layout/reftests/transform-3d/reftest.list
@@ -71,9 +71,9 @@ fuzzy(0-3,0-99) == animate-cube-degrees.html animate-cube-degrees-ref.html # sub
 == animate-cube-degrees-zoom.html animate-cube-degrees-zoom-ref.html
 != animate-cube-degrees-ref.html animate-cube-degrees-zoom-ref.html
 fuzzy-if(gtkWidget,0-128,0-100) fuzzy-if(Android||OSX==1010||(gtkWidget&&layersGPUAccelerated),0-143,0-100) fuzzy-if(winWidget||OSX<1010,0-141,0-100) == preserves3d-nested.html preserves3d-nested-ref.html
-fuzzy-if(cocoaWidget,0-128,0-9) random-if(/^Windows\x20NT\x206\.1/.test(http.oscpu)) == animate-preserve3d-parent.html animate-preserve3d-ref.html # intermittently fuzzy on Mac
-fuzzy-if(cocoaWidget,0-128,0-9) random-if(/^Windows\x20NT\x206\.1/.test(http.oscpu)) == animate-preserve3d-child.html animate-preserve3d-ref.html # intermittently fuzzy on Mac, bug 1461311 for Android
-== animate-backface-hidden.html about:blank
+skip-if(cocoaWidget&&webrender) fuzzy-if(cocoaWidget,0-128,0-9) random-if(/^Windows\x20NT\x206\.1/.test(http.oscpu)) == animate-preserve3d-parent.html animate-preserve3d-ref.html # intermittently fuzzy on Mac
+skip-if(cocoaWidget&&webrender) fuzzy-if(cocoaWidget,0-128,0-9) random-if(/^Windows\x20NT\x206\.1/.test(http.oscpu)) == animate-preserve3d-child.html animate-preserve3d-ref.html # intermittently fuzzy on Mac, bug 1461311 for Android
+skip-if(cocoaWidget&&webrender) == animate-backface-hidden.html about:blank # intermittent failure on MacOSX builds (bug 1505613)
 == 1245450-1.html green-rect.html
 fuzzy(0-1,0-2000) == opacity-preserve3d-1.html opacity-preserve3d-1-ref.html
 fuzzy(0-1,0-15000) == opacity-preserve3d-2.html opacity-preserve3d-2-ref.html