third_party/WebKit/LayoutTests/fast/lists/ol-reversed-dynamic.html

   1 <html>
   2     <head>
   3         <script src="resources/dump-list.js"></script>
   4         <script>
   5             function test()
   6             {
   7                 if (window.testRunner)
   8                     testRunner.dumpAsText();
   9
  10                 var list1 = document.getElementById("list1");
  11                 list1.offsetTop; // Force a relayout.
  12                 list1.firstElementChild.value = 10;
  13                 document.getElementById("console1").innerHTML = dumpList(list1);
  14
  15                 var list2 = document.getElementById("list2");
  16                 list2.querySelector("li[value=\"20\"]").removeAttribute("value");
  17                 document.getElementById("console2").innerHTML = dumpList(list2);
  18
  19                 var list3 = document.getElementById("list3");
  20                 list3.start = 20;
  21                 document.getElementById("console3").innerHTML = dumpList(list3);
  22
  23                 var list4 = document.getElementById("list4");
  24                 list4.removeAttribute("start");
  25                 document.getElementById("console4").innerHTML = dumpList(list4);
  26
  27                 var list5 = document.getElementById("list5");
  28                 list5.setAttribute("start","");
  29                 document.getElementById("console5").innerHTML = dumpList(list5);
  30
  31                 // Don't show the actual lists as they are useless in the text-only mode.
  32                 list1.parentNode.removeChild(list1);
  33                 list2.parentNode.removeChild(list2);
  34                 list3.parentNode.removeChild(list3);
  35                 list4.parentNode.removeChild(list4);
  36                 list5.parentNode.removeChild(list5);
  37             }
  38         </script>
  39     </head>
  40     <body onload="test()">
  41         <p>This tests that changing the value of an item updates markers accordingly.</p>
  42         <ol id="list1" reversed>
  43             <li>Ten</li>
  44             <li>Nine</li>
  45             <li>Eight</li>
  46             <li>Seven</li>
  47             <li>Six</li>
  48         </ol>
  49         <p id="console1"></p>
  50
  51         <p>This tests that resetting the value of an item updates markers accordingly.</p>
  52         <ol id="list2" reversed>
  53             <li>Five</li>
  54             <li>Four</li>
  55             <li value="20">Three</li>
  56             <li>Two</li>
  57             <li>One</li>
  58         </ol>
  59         <p id="console2"></p>
  60
  61         <p>This tests that changing the start value of the list updates markers accordingly.</p>
  62         <ol id="list3" reversed start="5">
  63             <li>Twenty</li>
  64             <li>Nineteen</li>
  65             <li>Eighteen</li>
  66             <li>Seventeen</li>
  67             <li>Sixteen</li>
  68         </ol>
  69         <p id="console3"></p>
  70
  71         <p>This tests that removing the custom start value of the list updates markers accordingly.</p>
  72         <ol id="list4" reversed start="20">
  73             <li>Five</li>
  74             <li>Four</li>
  75             <li>Three</li>
  76             <li>Two</li>
  77             <li>One</li>
  78         </ol>
  79         <p id="console4"></p>
  80
  81         <p>This tests that changing the custom start value from 1 to "" works.</p>
  82         <ol id="list5" reversed start="1">
  83             <li>Five</li>
  84             <li>Four</li>
  85             <li>Three</li>
  86             <li>Two</li>
  87             <li>One</li>
  88         </ol>
  89         <p id="console5"></p>
  90     </body>
  91 </html>