summaryrefslogtreecommitdiffstats
path: root/layout/style/test/test_transitions_cancel_near_end.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_transitions_cancel_near_end.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_transitions_cancel_near_end.html')
-rw-r--r--layout/style/test/test_transitions_cancel_near_end.html82
1 files changed, 82 insertions, 0 deletions
diff --git a/layout/style/test/test_transitions_cancel_near_end.html b/layout/style/test/test_transitions_cancel_near_end.html
new file mode 100644
index 000000000..4fca67ada
--- /dev/null
+++ b/layout/style/test/test_transitions_cancel_near_end.html
@@ -0,0 +1,82 @@
+<!DOCTYPE HTML>
+<html>
+<!--
+https://bugzilla.mozilla.org/show_bug.cgi?id=613888
+-->
+<head>
+ <title>Test for Bug 613888</title>
+ <script type="text/javascript" src="/MochiKit/MochiKit.js"></script>
+ <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
+ <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
+ <style type="text/css">
+ #animated-elements-container > span {
+ color: black;
+ background: white;
+ transition:
+ color 10s ease-out,
+ background 1s ease-out;
+ }
+ #animated-elements-container > span.another {
+ color: white;
+ background: black;
+ }
+ </style>
+</head>
+<body>
+<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=613888">Mozilla Bug 613888</a>
+<pre id="animated-elements-container">
+ <span should-restyle="true">canceled on a half of the animation</span>
+ <span should-restyle="true">canceled too fast, and restyled on transitionend</span>
+ <span>canceled too fast, but not restyled on transitionend</span>
+</pre>
+<pre id="test">
+<script class="testbody" type="text/javascript">
+
+/** Test for Bug 613888: that we don't cancel transitions when they're
+ about to end (current interpolated value rounds to ending value) and
+ they get an unrelated style change. **/
+
+var count_remaining = 6;
+
+window.addEventListener('load', function() {
+ var cases = Array.slice(document.querySelectorAll('#animated-elements-container > span'));
+
+ cases.forEach(function(aTarget) {
+ aTarget.addEventListener('transitionend', function(aEvent) {
+ if (aTarget.hasAttribute('should-restyle'))
+ aTarget.style.outline = '1px solid';
+ var attr = 'transitionend-' + aEvent.propertyName;
+ if (aTarget.hasAttribute(attr)) {
+ // It's possible, given bad timers, that we might get a
+ // transition that completed before we reversed it, which could
+ // lead to two transitionend events for the same thing. We
+ // don't want to decrement count_remaining in this case.
+ return;
+ }
+ aTarget.setAttribute(attr, "true");
+ if (--count_remaining == 0) {
+ cases.forEach(function(aCase, aIndex) {
+ ok(aCase.hasAttribute('transitionend-color'),
+ "transitionend for color was fired for case "+aIndex);
+ ok(aCase.hasAttribute('transitionend-background-color'),
+ "transitionend for background-color was fired for case "+aIndex);
+ });
+ SimpleTest.finish();
+ }
+ }, false);
+ });
+
+ cases.forEach(aCase => aCase.className = 'another' );
+
+ window.setTimeout(() => cases[0].className = '', 500);
+ window.setTimeout(() => cases[1].className = cases[2].className = '', 250);
+
+}, false);
+
+SimpleTest.waitForExplicitFinish();
+SimpleTest.requestFlakyTimeout("untriaged");
+
+</script>
+</pre>
+</body>
+</html>