dom/svg/test/test_tabindex.html

   1 <html xmlns="http://www.w3.org/1999/xhtml">
   2 <head>
   3   <title>Test for SVG tabIndex - Bug 778654</title>
   4   <link rel="stylesheet" type="text/css"
   5         href="chrome://mochikit/content/tests/SimpleTest/test.css" />
   6
   7   <script src="/tests/SimpleTest/SimpleTest.js"></script>
   8   <script src="/tests/SimpleTest/EventUtils.js"></script>
   9 </head>
  10 <body>
  11 <svg xmlns="http://www.w3.org/2000/svg" overflow="visible">
  12   <foreignObject id="f" x="0" y="0" width="200" height="60" tabindex="0">
  13     <body xmlns="http://www.w3.org/1999/xhtml">
  14       <p>Here is a paragraph that requires word wrap</p>
  15     </body>
  16   </foreignObject>
  17   <rect id="r" x="0" y="70" width="100" height="100" fill="yellow" tabindex="1"/>
  18   <text id="t" x="0" y="200" tabindex="2">
  19     This is SVG text
  20   </text>
  21   <a xlink:href="#" id="l1" tabindex="3">
  22     <circle cx="10" cy="230" r="10"/>
  23   </a>
  24   <a id="l2" tabindex="4">
  25     <circle cx="10" cy="260" r="10"/>
  26   </a>
  27   <rect id="r6" x="0" y="70" width="100" height="100" fill="yellow" tabindex="6"/>
  28   <rect id="r7" x="0" y="70" width="100" height="100" fill="yellow" tabindex="7"/>
  29 </svg>
  30 <pre id="test">
  31 <script class="testbody" type="text/javascript">
  32 SimpleTest.waitForExplicitFinish();
  33
  34 function main() {
  35   var f = document.getElementById("f");
  36   var r = document.getElementById("r");
  37   var t = document.getElementById("t");
  38   var l1 = document.getElementById("l1");
  39   var l2 = document.getElementById("l2");
  40
  41   try {
  42     // Step 1: Checking by assigning tabIndex
  43     is(f.tabIndex, 0, "foreignObject initial tabIndex");
  44     f.tabIndex = 1;
  45     is(f.tabIndex, 1, "foreignObject tabIndex is set to 1");
  46
  47     is(r.tabIndex, 1, "rect initial tabIndex");
  48     r.tabIndex = 2;
  49     is(r.tabIndex, 2, "rect tabIndex is set to 2");
  50
  51     is(t.tabIndex, 2, "text initial tabIndex");
  52     t.tabIndex = 3;
  53     is(t.tabIndex, 3, "text is set to 3");
  54
  55     is(l1.tabIndex, 3, "link initial tabIndex");
  56     l1.tabIndex = 4;
  57     is(l1.tabIndex, 4, "link is set to 4");
  58
  59     is(l2.tabIndex, 4, "non-link initial tabIndex");
  60     l2.tabIndex = 5;
  61     is(l2.tabIndex, 5, "non-link is set to 4");
  62
  63     // Step 2: Checking by triggering TAB event
  64     is(document.activeElement.tabIndex, -1, "In the beginning, the active element tabindex is -1");
  65
  66     synthesizeKey("KEY_Tab");
  67     is(document.activeElement.tabIndex, 1, "The active element tabindex is 1");
  68
  69     synthesizeKey("KEY_Tab");
  70     is(document.activeElement.tabIndex, 2, "The active element tabindex is 2");
  71
  72     synthesizeKey("KEY_Tab");
  73     is(document.activeElement.tabIndex, 3, "The active element tabindex is 3");
  74
  75     synthesizeKey("KEY_Tab");
  76     is(document.activeElement.tabIndex, 4, "The active element tabindex is 4");
  77
  78     synthesizeKey("KEY_Tab");
  79     is(document.activeElement.tabIndex, 5, "The active element tabindex is 5");
  80   } catch (e) {
  81     ok(false, "Got unexpected exception" + e);
  82   }
  83
  84   SimpleTest.finish();
  85 }
  86
  87 SimpleTest.waitForFocus(main);
  88
  89 </script>
  90 </pre>
  91 </body>
  92 </html>