Bug 1392851 - A reftest to check that we don't share styles for elements that have animations which are about to be removed. r?birtles draft
authorHiroyuki Ikezoe <hikezoe@mozilla.com>
Thu, 24 Aug 2017 18:27:31 +0900
changeset 651971 c240c3b4e7ee6d1f470cd11cd0f4360d14b07216
parent 651970 54c62d6d63288d7c2f30013c7f6a3dab0abef0ad
child 727950 f74498fe733acb08dcb32ed15538ebdea47f8997
push id75906
push userhikezoe@mozilla.com
push dateThu, 24 Aug 2017 09:28:30 +0000
reviewersbirtles
bugs1392851, 1379203
milestone57.0a1
Bug 1392851 - A reftest to check that we don't share styles for elements that have animations which are about to be removed. r?birtles This was a test case for bug 1379203 (Google Inbox issue), but to pass this test also needs the fix in this series to cancel animations when changing animation-name to 'none' in the specified CSS rule. Actually the fix in this series also fixes the Google Inbox issue so that this test can pass without the fix for the Google Inbox issue. But even so without the fix for bug 1379203, the style data for the first div element in this test is cached and the second div element uses the cached data. MozReview-Commit-ID: GfKSDfTZef4
layout/reftests/css-animations/no-style-sharing-with-animations-ref.html
layout/reftests/css-animations/no-style-sharing-with-animations.html
layout/reftests/css-animations/reftest.list
new file mode 100644
--- /dev/null
+++ b/layout/reftests/css-animations/no-style-sharing-with-animations-ref.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html>
+<style>
+div {
+  background-color: green;
+  width: 100px;
+  height: 100px;
+}
+</style>
+<div></div>
+<div></div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/css-animations/no-style-sharing-with-animations.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+<style>
+.animation {
+  animation: anim 100s forwards;
+}
+@keyframes anim {
+  0% { background-color: red; }
+  100% { background-color: red; }
+}
+div {
+  background-color: green;
+  width: 100px;
+  height: 100px;
+}
+</style>
+<div class="animation"></div>
+<div class="animation"></div>
+<script>
+document.addEventListener('MozReftestInvalidate', () => {
+  requestAnimationFrame(() => {
+    document.styleSheets[0].cssRules[0].style.animationName = 'none';
+    document.documentElement.classList.remove('reftest-wait');
+  });
+}, false);
+</script>
--- a/layout/reftests/css-animations/reftest.list
+++ b/layout/reftests/css-animations/reftest.list
@@ -55,8 +55,9 @@ fails == background-position-important.h
 
 == updating-animation-on-pseudo-element.html updating-animation-on-pseudo-element-ref.html
 == content-on-pseudo-element-at-beginning.html content-on-pseudo-element-ref.html
 == content-on-pseudo-element-at-half.html content-on-pseudo-element-ref.html
 == reframe-and-animation-starts-at-the-same-time.html reframe-and-animation-starts-at-the-same-time-ref.html
 == change-animation-name-to-none-in-rule.html change-animation-name-in-rule-ref.html
 == change-animation-name-to-other-in-rule.html change-animation-name-in-rule-ref.html
 == change-animation-name-to-non-existent-in-rule.html change-animation-name-in-rule-ref.html
+== no-style-sharing-with-animations.html no-style-sharing-with-animations-ref.html