Bug 1273042 - Part 3: Reftest for checking transform:none animations create a stacking context. r=birtles
authorHiroyuki Ikezoe <hiikezoe@mozilla-japan.org>
Wed, 01 Jun 2016 16:24:34 +0900
changeset 340928 8976b91b9ad2bbb143a204adf07565d23cea1f3b
parent 340927 df16848a29e356152b3374344a4e279a0dc05235
child 340929 958fde8511872c5fbf59c3b27a120fbb31a6f9ae
push id1183
push userraliiev@mozilla.com
push dateMon, 05 Sep 2016 20:01:49 +0000
treeherdermozilla-release@3148731bed45 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersbirtles
bugs1273042
milestone49.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1273042 - Part 3: Reftest for checking transform:none animations create a stacking context. r=birtles This patch has two test cases one if for CSS animations and one is for web animations. For CSS animations test cases: @keyframes { from, to { transform: none; } } For web animtions test cases, the target element is appended after animate(). MozReview-Commit-ID: Gy1sY41jV7G
layout/reftests/css-animations/reftest.list
layout/reftests/css-animations/stacking-context-transform-animation-ref.html
layout/reftests/css-animations/stacking-context-transform-none-animation.html
layout/reftests/web-animations/reftest.list
layout/reftests/web-animations/stacking-context-animation-ref.html
layout/reftests/web-animations/stacking-context-transform-none-animation-before-appending-element.html
--- a/layout/reftests/css-animations/reftest.list
+++ b/layout/reftests/css-animations/reftest.list
@@ -3,8 +3,9 @@
 fails == print-no-animations.html print-no-animations-ref.html # reftest harness doesn't actually make pres context non-dynamic for reftest-print tests
 fails != print-no-animations.html print-no-animations-notref.html # reftest harness doesn't actually make pres context non-dynamic for reftest-print tests
 == animate-opacity.html animate-opacity-ref.html
 == animate-preserves3d.html animate-preserves3d-ref.html
 == in-visibility-hidden-animation.html in-visibility-hidden-animation-ref.html
 == in-visibility-hidden-animation-pseudo-element.html in-visibility-hidden-animation-pseudo-element-ref.html
 == partially-out-of-view-animation.html partially-out-of-view-animation-ref.html
 == animate-display-table-opacity.html animate-display-table-opacity-ref.html
+== stacking-context-transform-none-animation.html  stacking-context-transform-animation-ref.html
new file mode 100644
--- /dev/null
+++ b/layout/reftests/css-animations/stacking-context-transform-animation-ref.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<title>Reference of testcases for bug 1273042</title>
+<style>
+span {
+  height: 100px;
+  width: 100px;
+  background: green;
+  position: fixed;
+  top: 50px;
+  z-index: -1;
+}
+#test {
+  height: 100px;
+  width: 100px;
+  background: blue;
+}
+</style>
+<span></span>
+<div id="test"></div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/css-animations/stacking-context-transform-none-animation.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<title>Transform animation creates a stacking context even though it has only 'transform:none' keyframes</title>
+<style>
+span {
+  height: 100px;
+  width: 100px;
+  position: fixed;
+  background: green;
+  top: 50px;
+}
+@keyframes TransformNone {
+  from, to { transform: none }
+}
+#test {
+  width: 100px; height: 100px;
+  background: blue;
+  animation: TransformNone 100s infinite;
+}
+</style>
+<span></span>
+<div id="test"></div>
--- a/layout/reftests/web-animations/reftest.list
+++ b/layout/reftests/web-animations/reftest.list
@@ -1,2 +1,3 @@
 test-pref(dom.animations-api.core.enabled,true) == 1246046-1.html green-box.html
 test-pref(dom.animations-api.core.enabled,true) == 1267937-1.html 1267937-ref.html
+test-pref(dom.animations-api.core.enabled,true) == stacking-context-transform-none-animation-before-appending-element.html stacking-context-animation-ref.html
new file mode 100644
--- /dev/null
+++ b/layout/reftests/web-animations/stacking-context-animation-ref.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<title>Reference of testcases for bug 1273042</title>
+<style>
+span {
+  height: 100px;
+  width: 100px;
+  background: green;
+  position: fixed;
+  top: 50px;
+  z-index: -1;
+}
+#test {
+  height: 100px;
+  width: 100px;
+  background: blue;
+}
+</style>
+<span></span>
+<div id="test"></div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/web-animations/stacking-context-transform-none-animation-before-appending-element.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+<title>Transform animation whose target is not initially associated with any document creates a stacking context even if it has only 'transform:none' in its keyframe</title>
+<style>
+span {
+  height: 100px;
+  width: 100px;
+  position: fixed;
+  background: green;
+  top: 50px;
+}
+div {
+  width: 100px; height: 100px;
+  background: blue;
+}
+</style>
+<span></span>
+<script>
+  var div = document.createElement("div")
+  var anim = div.animate({ transform: ['none', 'none'] },
+                         { duration: 100000 });
+  document.body.appendChild(div);
+  anim.ready.then(function() {
+    document.documentElement.classList.remove("reftest-wait");
+  });
+</script>