layout/style/test/test_bug667520.html

   1 <!DOCTYPE HTML>
   2 <html>
   3 <!--
   4 https://bugzilla.mozilla.org/show_bug.cgi?id=667520
   5 -->
   6 <head>
   7   <title>Test for Bug 667520</title>
   8   <script 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=667520">Mozilla Bug 667520</a>
  13 <p id="display">
  14   <!-- important: we need a <span> as the second element child and then
  15        non-span elements between that and the next </span> -->
  16   <i></i>
  17   <span id="2"></span>
  18   <i></i>
  19   <i></i>
  20   <i></i>
  21   <i></i>
  22   <span id="7"></span>
  23   <span id="8"></span>
  24 </p>
  25 <div id="content" style="display: none">
  26
  27 </div>
  28 <pre id="test">
  29 <script type="application/javascript">
  30
  31 /** Test for Bug 667520 **/
  32 var spans = $("display").querySelectorAll("span");
  33 is(spans.length, 3, "Should have 3 span kids");
  34
  35 is($("display").querySelector("span:nth-child(3)"), null, "Third child is not span");
  36 is($("display").querySelector("span:nth-child(4)"), null, "Fourth child is not span");
  37
  38 for (var i = 0; i < spans.length; ++i) {
  39   var id = spans[i].id;
  40   /* Important: need to include 'span' in that selector so we only match
  41      nth-child against spans. */
  42   var target = $("display").querySelector("span:nth-child("+id+")");
  43   is(target, spans[i], "Unexpected element");
  44   is(target.id, spans[i].id, "Unexpected id");
  45 }
  46
  47 </script>
  48 </pre>
  49 </body>
  50 </html>