layout/style/test/test_transitions_dynamic_changes.html

Wed, 31 Dec 2014 13:27:57 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Wed, 31 Dec 2014 13:27:57 +0100
branch
TOR_BUG_3246
changeset 6
8bccb770b82d
permissions
-rw-r--r--

Ignore runtime configuration files generated during quality assurance.

     1 <!DOCTYPE HTML>
     2 <html>
     3 <!--
     4 https://bugzilla.mozilla.org/show_bug.cgi?id=525530
     5 -->
     6 <head>
     7   <title>Test for Bug 525530</title>
     8   <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
     9   <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
    10 </head>
    11 <body>
    12 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=525530">Mozilla Bug 525530</a>
    13 <p id="display" style="text-indent: 100px"></p>
    14 <pre id="test">
    15 <script type="application/javascript">
    17 /** Test for Bug 525530 **/
    19 var p = document.getElementById("display");
    20 var cs = getComputedStyle(p, "");
    22 p.style.transitionProperty = "all";
    23 p.style.transitionDuration = "4s";
    24 p.style.transitionDelay = "-2s";
    25 p.style.transitionTimingFunction = "linear";
    27 is(cs.textIndent, "100px", "initial value");
    29 p.style.textIndent = "0";
    30 is(cs.textIndent, "50px", "transition is halfway");
    31 p.style.transitionDuration = "0s";
    32 is(cs.textIndent, "50px", "changing duration doesn't change transitioning");
    33 p.style.transitionDelay = "0s";
    34 is(cs.textIndent, "50px", "changing delay doesn't change transitioning");
    35 p.style.transitionProperty = "text-indent";
    36 is(cs.textIndent, "50px",
    37    "irrelevant change to transition property doesn't change transitioning");
    38 p.style.transitionProperty = "font";
    39 is(cs.textIndent, "0px",
    40    "relevant change to transition property does change transitioning");
    42 /** Test for Bug 522643 */
    43 p.style.transitionDuration = "4s";
    44 p.style.transitionDelay = "-2s";
    45 p.style.transitionProperty = "text-indent";
    46 p.style.textIndent = "100px";
    47 is(cs.textIndent, "50px", "transition is halfway");
    48 p.style.transitionDuration = "0s";
    49 p.style.transitionDelay = "0s";
    50 is(cs.textIndent, "50px",
    51    "changing duration and delay doesn't change transitioning");
    52 p.style.textIndent = "0px";
    53 is(cs.textIndent, "0px",
    54    "changing property after changing duration and delay stops transition");
    56 </script>
    57 </pre>
    58 </body>
    59 </html>

mercurial