layout/reftests/css-transitions/transitions-inline-rewrap-2.html

   1 <html class="reftest-wait">
   2 <title>Test for CSS transitions and re-wrapping of inlines</title>
   3 <style type="text/css">
   4 #test { transition: 20ms color linear 0; }
   5 </style>
   6 <script type="text/javascript">
   7
   8 window.onload = run;
   9
  10 function run() {
  11   var test = document.getElementById("test");
  12   var unused = test.offsetWidth;
  13   unused = getComputedStyle(test, "").color;
  14   test.style.color = "green";
  15   unused = test.offsetWidth;
  16   unused = getComputedStyle(test, "").color;
  17   test.parentNode.style.width = "3em";
  18   unused = test.offsetWidth;
  19   unused = getComputedStyle(test, "").color;
  20   setTimeout(step2, 100); // give transition time to run
  21 }
  22 function step2() {
  23   document.documentElement.removeAttribute("class");
  24 }
  25
  26 </script>
  27 <div style="width: 50em">
  28 <span id="test" style="color: red">
  29 This is some text with a transition.
  30 </span>
  31 </div>