third_party/WebKit/LayoutTests/accessibility/canvas-fallback-content-2.html

   1 <!DOCTYPE HTML>
   2 <html>
   3 <body>
   4 <script src="../resources/js-test.js"></script>
   5
   6 <div>
   7   <a id="link1" href="#">Link</a>
   8   <button id="button1">Button</button>
   9   <button id="labeled-button1" aria-label="Label">Button</button>
  10   <button id="button-with-title1" title="Title">Button</button>
  11   <input id="text1" type="text" value="Value">
  12   <input id="checkbox1" type="checkbox" checked>
  13   <input id="number1" type="number" value="123">
  14   <input id="radio1" type="radio" checked>
  15   <input id="slider1" type="range" min="1" max="10" value="5">
  16   <input id="submit1" type="submit">
  17   <select id="combobox1"><option>1<option selected>2</select>
  18   <select multiple id="listbox1"><option>1<option selected>2</select>
  19   <textarea id="textarea1">Textarea</textarea>
  20   <div id="focusable1" tabindex="0">Focusable</div>
  21   <h5 id="heading1" tabindex="0">Heading</h5>
  22   <div id="aria-button1" tabindex="0" role="button">ARIA button</div>
  23   <div id="aria-disabledbutton1" tabindex="0" role="button" aria-disabled="true">ARIA disabled button</div>
  24   <div id="aria-enabledbutton1" tabindex="0" role="button" aria-disabled="false">ARIA enabled button</div>
  25   <div id="aria-requiredbutton1" tabindex="0" role="button" aria-required="true">ARIA required button</div>
  26   <div id="aria-togglebutton1" tabindex="0" role="button" aria-pressed="false">ARIA toggle button</div>
  27   <div id="aria-link1" tabindex="0" role="link">ARIA link</div>
  28 </div>
  29
  30 <canvas id="myCanvas" width="300" height="300">
  31   <a id="link2" href="#">Link</a>
  32   <button id="button2">Button</button>
  33   <button id="labeled-button2" aria-label="Label">Button</button>
  34   <button id="button-with-title2" title="Title">Button</button>
  35   <input id="text2" type="text" value="Value">
  36   <input id="checkbox2" type="checkbox" checked>
  37   <input id="number2" type="number" value="123">
  38   <input id="radio2" type="radio" checked>
  39   <input id="slider2" type="range" min="1" max="10" value="5">
  40   <input id="submit2" type="submit">
  41   <select id="combobox2"><option>1<option selected>2</select>
  42   <select multiple id="listbox2"><option>1<option selected>2</select>
  43   <textarea id="textarea2">Textarea</textarea>
  44   <div id="focusable2" tabindex="0">Focusable</div>
  45   <h5 id="heading2" tabindex="0">Heading</h5>
  46   <div id="aria-button2" tabindex="0" role="button">ARIA button</div>
  47   <div id="aria-disabledbutton2" tabindex="0" role="button" aria-disabled="true">ARIA disabled button</div>
  48   <div id="aria-enabledbutton2" tabindex="0" role="button" aria-disabled="false">ARIA enabled button</div>
  49   <div id="aria-requiredbutton2" tabindex="0" role="button" aria-required="true">ARIA required button</div>
  50   <div id="aria-togglebutton2" tabindex="0" role="button" aria-pressed="false">ARIA toggle button</div>
  51   <div id="aria-link2" tabindex="0" role="link">ARIA link</div>
  52 </canvas>
  53
  54 <div id="console"></div>
  55 <script>
  56 description("This tests a number of different elements in canvas fallback content to make sure their accessible attributes are essentially identical to the corresponding elements outside of canvas fallback content.");
  57
  58 if (window.testRunner && window.accessibilityController) {
  59     window.testRunner.dumpAsText();
  60
  61     function check(id1, id2) {
  62         debug(id1);
  63         window.element1 = document.getElementById(id1);
  64         element1.focus();
  65         shouldBe("document.activeElement == element1", "true");
  66         window.axElement1 = accessibilityController.focusedElement;
  67
  68         debug(id2);
  69         window.element2 = document.getElementById(id2);
  70         element2.focus();
  71         shouldBe("document.activeElement == element2", "true");
  72         window.axElement2 = accessibilityController.focusedElement;
  73
  74         shouldBe("axElement2.role", "axElement1.role");
  75         shouldBe("axElement2.roleDescription", "axElement1.roleDescription");
  76         shouldBe("axElement2.deprecatedTitle", "axElement1.deprecatedTitle");
  77         shouldBe("axElement2.deprecatedDescription", "axElement1.deprecatedDescription");
  78         shouldBe("axElement2.deprecatedHelpText", "axElement1.deprecatedHelpText");
  79         shouldBe("axElement2.stringValue", "axElement1.stringValue");
  80         shouldBe("axElement2.isEnabled", "axElement1.isEnabled");
  81         shouldBe("axElement2.isRequired", "axElement1.isRequired");
  82         shouldBe("axElement2.isChecked", "axElement1.isChecked");
  83         shouldBe("axElement2.intValue", "axElement1.intValue");
  84         shouldBe("axElement2.minValue", "axElement1.minValue");
  85         shouldBe("axElement2.maxValue", "axElement1.maxValue");
  86         debug("");
  87     }
  88
  89     check("link1", "link2");
  90     check("button1", "button2");
  91     check("labeled-button1", "labeled-button2");
  92     check("button-with-title1", "button-with-title2");
  93     check("text1", "text2");
  94     check("checkbox1", "checkbox2");
  95     check("number1", "number2");
  96     check("radio1", "radio2");
  97     check("slider1", "slider2");
  98     check("submit1", "submit2");
  99     check("combobox1", "combobox2");
 100     check("listbox1", "listbox2");
 101     check("textarea1", "textarea2");
 102     check("focusable1", "focusable2");
 103     check("heading1", "heading2");
 104     check("aria-button1", "aria-button2");
 105     check("aria-disabledbutton1", "aria-disabledbutton2");
 106     check("aria-enabledbutton1", "aria-enabledbutton2");
 107     check("aria-requiredbutton1", "aria-requiredbutton2");
 108     check("aria-togglebutton1", "aria-togglebutton2");
 109     check("aria-link1", "aria-link2");
 110 }
 111
 112 </script>
 113
 114 </body>
 115 </html>