summaryrefslogtreecommitdiffstats
path: root/layout/style/test/test_animations_omta_start.html
diff options
context:
space:
mode:
authorMatt A. Tobin <mattatobin@localhost.localdomain>2018-02-02 04:16:08 -0500
committerMatt A. Tobin <mattatobin@localhost.localdomain>2018-02-02 04:16:08 -0500
commit5f8de423f190bbb79a62f804151bc24824fa32d8 (patch)
tree10027f336435511475e392454359edea8e25895d /layout/style/test/test_animations_omta_start.html
parent49ee0794b5d912db1f95dce6eb52d781dc210db5 (diff)
downloadUXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.gz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.lz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.xz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.zip
Add m-esr52 at 52.6.0
Diffstat (limited to 'layout/style/test/test_animations_omta_start.html')
-rw-r--r--layout/style/test/test_animations_omta_start.html189
1 files changed, 189 insertions, 0 deletions
diff --git a/layout/style/test/test_animations_omta_start.html b/layout/style/test/test_animations_omta_start.html
new file mode 100644
index 000000000..235c32342
--- /dev/null
+++ b/layout/style/test/test_animations_omta_start.html
@@ -0,0 +1,189 @@
+<!DOCTYPE HTML>
+<html>
+<!--
+https://bugzilla.mozilla.org/show_bug.cgi?id=975261
+-->
+<head>
+ <meta charset="utf-8">
+ <title>Test OMTA animations start correctly (Bug 975261)</title>
+ <script type="application/javascript"
+ src="/tests/SimpleTest/SimpleTest.js"></script>
+ <script type="application/javascript"
+ src="/tests/SimpleTest/paint_listener.js"></script>
+ <script type="application/javascript" src="animation_utils.js"></script>
+ <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+ <style type="text/css">
+ @keyframes anim-opacity {
+ 0% { opacity: 0.5 }
+ 100% { opacity: 0.5 }
+ }
+ @keyframes anim-opacity-2 {
+ 0% { opacity: 0.0 }
+ 100% { opacity: 1.0 }
+ }
+ @keyframes anim-transform {
+ 0% { transform: translate(50px); }
+ 100% { transform: translate(50px); }
+ }
+ @keyframes anim-transform-2 {
+ 0% { transform: translate(0px); }
+ 100% { transform: translate(100px); }
+ }
+ .target {
+ /* These two lines are needed so that an opacity/transform layer
+ * already exists when the animation is applied. */
+ opacity: 0.99;
+ transform: translate(99px);
+
+ /* Element needs geometry in order to be animated on the
+ * compositor. */
+ width: 100px;
+ height: 100px;
+ background-color: white;
+ }
+ </style>
+</head>
+<body>
+<a target="_blank"
+ href="https://bugzilla.mozilla.org/show_bug.cgi?id=975261">Mozilla Bug
+ 975261</a>
+<div id="display"></div>
+<pre id="test">
+<script type="application/javascript">
+"use strict";
+
+var gUtils = SpecialPowers.DOMWindowUtils;
+
+SimpleTest.waitForExplicitFinish();
+runOMTATest(testDelay, SimpleTest.finish);
+
+function newTarget() {
+ var target = document.createElement("div");
+ target.classList.add("target");
+ document.getElementById("display").appendChild(target);
+ return target;
+}
+
+function testDelay() {
+ gUtils.advanceTimeAndRefresh(0);
+
+ var target = newTarget();
+ target.setAttribute("style", "animation: 10s 10s anim-opacity linear");
+ gUtils.advanceTimeAndRefresh(0);
+
+ waitForAllPaints(function() {
+ gUtils.advanceTimeAndRefresh(10100);
+ waitForAllPaints(function() {
+ var opacity = gUtils.getOMTAStyle(target, "opacity");
+ is(opacity, "0.5",
+ "opacity is set on compositor thread after delayed start");
+ target.removeAttribute("style");
+ gUtils.restoreNormalRefresh();
+ testTransform();
+ });
+ });
+}
+
+function testTransform() {
+ gUtils.advanceTimeAndRefresh(0);
+
+ var target = newTarget();
+ target.setAttribute("style", "animation: 10s 10s anim-transform linear");
+ gUtils.advanceTimeAndRefresh(0);
+
+ waitForAllPaints(function() {
+ gUtils.advanceTimeAndRefresh(10100);
+ waitForAllPaints(function() {
+ var transform = gUtils.getOMTAStyle(target, "transform");
+ ok(matricesRoughlyEqual(convertTo3dMatrix(transform),
+ convertTo3dMatrix("matrix(1, 0, 0, 1, 50, 0)")),
+ "transform is set on compositor thread after delayed start");
+ target.remove();
+ gUtils.restoreNormalRefresh();
+ testBackwardsFill();
+ });
+ });
+}
+
+function testBackwardsFill() {
+ gUtils.advanceTimeAndRefresh(0);
+
+ var target = newTarget();
+ target.setAttribute("style",
+ "transform: translate(30px); " +
+ "animation: 10s 10s anim-transform-2 linear backwards");
+
+ gUtils.advanceTimeAndRefresh(0);
+ waitForAllPaints(function() {
+ gUtils.advanceTimeAndRefresh(10000);
+ waitForAllPaints(function() {
+ gUtils.advanceTimeAndRefresh(100);
+ waitForAllPaints(function() {
+ var transform = gUtils.getOMTAStyle(target, "transform");
+ ok(matricesRoughlyEqual(convertTo3dMatrix(transform),
+ convertTo3dMatrix("matrix(1, 0, 0, 1, 1, 0)")),
+ "transform is set on compositor thread after delayed start " +
+ "with backwards fill");
+ target.remove();
+ gUtils.restoreNormalRefresh();
+ testTransitionTakingOver();
+ });
+ });
+ });
+}
+
+function testTransitionTakingOver() {
+ gUtils.advanceTimeAndRefresh(0);
+
+ var parent = newTarget();
+ var child = newTarget();
+ parent.appendChild(child);
+ parent.style.opacity = "0.0";
+ parent.style.animation = "10s anim-opacity-2 linear";
+ child.style.opacity = "inherit";
+ child.style.transition = "10s opacity linear";
+
+ var childCS = getComputedStyle(child, "");
+
+ gUtils.advanceTimeAndRefresh(0);
+ waitForAllPaints(function() {
+ gUtils.advanceTimeAndRefresh(4000);
+ waitForAllPaints(function() {
+ child.style.opacity = "1.0";
+ var opacity = gUtils.getOMTAStyle(child, "opacity");
+ // FIXME Bug 1039799 (or lower priority followup): Animations
+ // inherited from an animating parent element don't get shipped to
+ // the compositor thread.
+ todo_is(opacity, "0.4",
+ "transition that interrupted animation is correct");
+
+ // Trigger to start the transition, without this the transition will
+ // be pending in advanceTimeAndRefresh(0) so the transition will not
+ // be sent to the compositor until we call advanceTimeAndRefresh with
+ // a positive time value.
+ getComputedStyle(child).opacity;
+ gUtils.advanceTimeAndRefresh(0);
+ waitForAllPaints(function() {
+ var opacity = gUtils.getOMTAStyle(child, "opacity");
+ is(opacity, "0.4",
+ "transition that interrupted animation is correct");
+ gUtils.advanceTimeAndRefresh(5000);
+ waitForAllPaints(function() {
+ opacity = gUtils.getOMTAStyle(child, "opacity");
+ is(opacity, "0.7",
+ "transition that interrupted animation is correct");
+ is(childCS.opacity, "0.7",
+ "transition that interrupted animation is correct");
+ parent.remove();
+ gUtils.restoreNormalRefresh();
+ SimpleTest.finish();
+ });
+ });
+ });
+ });
+}
+
+</script>
+</pre>
+</body>
+</html>
generated by cgit v1.2.3 (git 2.25.1) at 2024-12-20 06:52:22 +0000