third_party/WebKit/LayoutTests/accessibility/element-role-mapping-focusable.html

   1 <html>
   2 <script src="../resources/js-test.js"></script>
   3 <script>
   4 function mouseDown() {
   5     document.getElementById("mousedown_link").style.color = "red";
   6 }
   7 </script>
   8 <a id="normal_link_id" href="http://www.chromium.org">Visit Chromium</a>
   9 <a id="mousedown_link_id" onmousedown="mouseDown()">Click the text!</a>
  10 <button id="button_id" type="button">Button</button>
  11 <details id="details_id">
  12   <summary id="summary_id">Copyright 2015.</summary>
  13   <p>The Chromium Authors. All rights reserved.</p>
  14 </details>
  15 <input id="input_datalist_id" list="fruits">
  16 <datalist id="fruits">
  17   <option value="Apple">
  18   <option value="Banana">
  19 </datalist>
  20 <input id="input_button_id" type="button" value="Click input button">
  21 <input id="input_checkbox_id" type="checkbox" value="CheckBox"> I have a checkbox
  22 <input id="input_radio_id" type="radio" value="Radio"> Radio
  23 <input type="radio" value="Button"> Button
  24 <menu>
  25   <input id="menu_button_id" type="button" role="button" value="Click menuitem">
  26   <input id="menu_checkbox_id" type="checkbox" name="vehicle" value="menuItemCheckbox"> I have a menuItem
  27   <input id="menu_radio_id" type="radio" name="gender" value="Menu"> Menu
  28   <input type="radio" name="gender" value="ItemRadio"> ItemRadio
  29 </menu>
  30 Birthday: <input id="input_date_id" type="date" name="bday">
  31 Birthday(date and time): <input id="input_datetime_id" type="datetime" name="bdaytime">
  32 Birthday(datetime-local): <input id="input_datetime-local_id" type="datetime-local" name="bdaytime">
  33 Birthday (month and year): <input id="input_month_id" type="month" name="bdaymonth">
  34 Select a week: <input id="input_week_id" type="week" name="week_year">
  35 Select a file: <input id="input_file_id" type="file" name="img">
  36 Min-Max: <input id="input_number_id" type="number" min="1" max="5">
  37 <input id="input_range_id" type="range" name="points" min="0" max="10">Color: <input id="input_color_id" type="color" name="color">Select a time: <input id="input_time_id" type="time" name="time">
  38 <input id="input_reset_id" type="reset">
  39 <select id="select_id">
  40   <option id="select_option_id" value="Pacific">Pacific</option>
  41   <option value="Atlantic">Atlantic</option>
  42   <option value="Indian">Indian</option>
  43   <option value="Southern">Southern</option>
  44   <option value="Arctic">Arctic</option>
  45 </select>
  46 <select id="select_multiple_id" multiple>
  47   <option id="select_multiple_option_id" value="Milk">Milk</option>
  48   <option value="Soda">Soda</option>
  49   <option value="Coffee">Coffee</option>
  50   <option value="Water">Water</option>
  51 </select>
  52 <textarea id="textarea_id" rows="2" cols="10">
  53 TextArea
  54 </textarea>
  55 <meter id="meter_id" value="0.6">60%</meter>
  56 <form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
  57   <input type="range" id="a" value="50">100
  58   +<input type="number" id="b" value="50">
  59   =<output id="output_id" name="x" for="a b"></output>
  60 </form>
  61 <form>
  62   <label for="blue">Blue</label>
  63   <input id="input_radio_id" type="radio" name="color" id="blue" value="blue">
  64   <label for="red">Red</label>
  65   <input type="radio" name="color" id="red" value="red">
  66 </form>
  67 <fieldset>
  68   <legend id="legend_id">Text Input Controls</legend>
  69   Text: <input id="input_text_id" type="text" name="texttest"><br>
  70   Password: <input id="input_password_id" type="password" name="passtest"><br>
  71 </fieldset>
  72 <p id="description"></p>
  73 <div id="console"></div>
  74 <script>
  75 description("This test make sure that focusable elements are mapped implicitly to AX roles.");
  76
  77 if (window.testRunner && window.accessibilityController) {
  78     window.testRunner.dumpAsText();
  79
  80     function hasRole(id, expectedRole) {
  81         debug(id);
  82         window.elem = accessibilityController.accessibleElementById(id);
  83         shouldBe("elem.role", "\"" + expectedRole + "\"");
  84     }
  85
  86     function hasSingleSelectRole(select_id, option_id) {
  87         debug(select_id);
  88         window.elem = accessibilityController.accessibleElementById(select_id);
  89         shouldBe("elem.role", "\"AXRole: AXPopUpButton\"");
  90
  91         window.axMenuListPopup = elem.childAtIndex(0);
  92         shouldBe("axMenuListPopup.role", "\"AXRole: AXMenuListPopup\"");
  93
  94         debug(option_id);
  95         window.axMenuListOption = axMenuListPopup.childAtIndex(0);
  96         shouldBe("axMenuListOption.role", "\"AXRole: AXMenuListOption\"");
  97     }
  98
  99     hasRole("normal_link_id", "AXRole: AXLink");
 100     hasRole("mousedown_link_id", "AXRole: AXLink");
 101
 102     hasRole("button_id", "AXRole: AXButton");
 103     hasRole("details_id", "AXRole: AXDetails");
 104     hasRole("summary_id", "AXRole: AXDisclosureTriangle");
 105
 106     hasRole("input_datalist_id", "AXRole: AXComboBox");
 107     hasRole("input_button_id", "AXRole: AXButton");
 108     hasRole("input_checkbox_id", "AXRole: AXCheckBox");
 109     hasRole("input_radio_id", "AXRole: AXRadioButton");
 110
 111     hasRole("menu_button_id", "AXRole: AXButton");
 112     hasRole("menu_checkbox_id", "AXRole: AXMenuItemCheckBox");
 113     hasRole("menu_radio_id", "AXRole: AXMenuItemRadio");
 114
 115     hasRole("input_date_id", "AXRole: AXDateField");
 116     hasRole("input_datetime_id", "AXRole: AXTextField");
 117     hasRole("input_datetime-local_id", "AXRole: AXDateTimeField");
 118     hasRole("input_month_id", "AXRole: AXDateTimeField");
 119     hasRole("input_week_id", "AXRole: AXDateTimeField");
 120
 121     hasRole("input_file_id", "AXRole: AXButton");
 122     hasRole("input_number_id", "AXRole: AXSpinButton");
 123     hasRole("input_range_id", "AXRole: AXSlider");
 124     hasRole("input_color_id", "AXRole: AXColorWell");
 125     hasRole("input_time_id", "AXRole: AXInputTime");
 126     hasRole("input_reset_id", "AXRole: AXButton");
 127
 128     hasSingleSelectRole("select_id", "select_option_id");
 129     hasRole("select_multiple_id", "AXRole: AXListBox");
 130     hasRole("select_multiple_option_id", "AXRole: AXListBoxOption");
 131
 132     hasRole("textarea_id", "AXRole: AXTextField");
 133
 134     hasRole("meter_id", "AXRole: AXMeter");
 135     hasRole("output_id", "AXRole: AXStatus");
 136     hasRole("input_radio_id", "AXRole: AXRadioButton");
 137     hasRole("legend_id", "AXRole: AXLegend");
 138     hasRole("input_text_id", "AXRole: AXTextField");
 139     hasRole("input_password_id", "AXRole: AXTextField");
 140 }
 141 </script>
 142 </html>