roles.html (4319B)
1 <!doctype html> 2 <html> 3 <head> 4 <title>Simple Core ARIA Role Verification Tests</title> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <script src="/resources/testdriver.js"></script> 8 <script src="/resources/testdriver-vendor.js"></script> 9 <script src="/resources/testdriver-actions.js"></script> 10 <script src="/wai-aria/scripts/aria-utils.js"></script> 11 </head> 12 <body> 13 14 <h1>Tests most <a href="https://w3c.github.io/aria/#role_definitions">ARIA role definitions</a>. See comments for more info.</h1> 15 16 <!-- Tested via AriaUtils.assignAndVerifyRolesByRoleNames() in <script> block below --> 17 <!-- Also tests role capitalization styles, in addition to "role": "ROLE", "Role" --> 18 19 <script> 20 21 /* 22 23 Tests simple role assignment: <div role="alert">x</div> 24 25 - Nested role structures (table>row>cell, etc) and 26 Abstract roles (e.g. widget, composite) are 27 commented with pointers to a separate test file. 28 29 - ARIA extension specs (e.g. doc-*, graphics-*) are 30 commented with pointers to a separate spec directory. 31 32 */ 33 34 let ariaRoles = [ 35 "alert", 36 "alertdialog", 37 "application", 38 "article", 39 // "associationlist" [AT-RISK: ARIA #1662] or possibly -> ./list-roles.html 40 // "associationlistitemkey" [AT-RISK: ARIA #1662] or possibly -> ./list-roles.html 41 // "associationlistitemvalue" [AT-RISK: ARIA #1662] or possibly -> ./list-roles.html 42 "banner", 43 "blockquote", 44 "button", 45 "caption", 46 // "cell" -> ./grid-roles.html 47 "checkbox", 48 "code", 49 // "columnheader" -> ./grid-roles.html 50 "combobox", 51 // "command" -> ./abstract-roles.html 52 // "comment" -> [AT-RISK: ARIA #1885] 53 "complementary", 54 // "composite" -> ./abstract-roles.html 55 "contentinfo", 56 "definition", 57 "deletion", 58 "dialog", 59 // "directory" -> FAIL. WONTFIX. Deprecated in ARIA 1.2; re-mapped to list role. 60 "document", 61 // doc-* roles -> TBD /dpub-aria or /dpub-aam 62 "emphasis", 63 "feed", 64 "figure", 65 // form -> ./form-roles.html 66 "generic", 67 // graphics-* roles -> /graphics-aria 68 // "grid" -> ./grid-roles.html 69 // "gridcell" -> ./grid-roles.html 70 "group", 71 "heading", 72 // "image" -> ./synonym-roles.html 73 // "img" -> ./synonym-roles.html 74 // "input" -> ./abstract-roles.html 75 "insertion", 76 // "landmark" -> ./abstract-roles.html 77 "link", 78 // "list" -> ./list-roles.html 79 // "listitem" -> ./list-roles.html 80 // "listitemkey" [See: ARIA #1662] or possibly -> ./list-roles.html 81 // "listitemvalue" [See: ARIA #1662] or possibly -> ./list-roles.html 82 // "listbox" -> ./listbox-roles.html 83 "log", 84 "main", 85 "marquee", 86 "math", 87 // "menu" -> ./menu-roles.html 88 // "menuitem" -> ./menu-roles.html 89 // "menuitemcheckbox" -> ./menu-roles.html 90 // "menuitemradio" -> ./menu-roles.html 91 // "menubar" -> ./menu-roles.html 92 "meter", 93 "navigation", 94 // "none" -> ./synonym-roles.html 95 "note", 96 // "option" -> ./listbox-roles.html 97 "paragraph", 98 // "presentation" -> ./synonym-roles.html 99 "progressbar", 100 "radio", 101 "radiogroup", 102 // "range" -> ./abstract-roles.html 103 // "region" -> ./region-roles.html 104 // "roletype" -> ./abstract-roles.html 105 // "row" -> ./grid-roles.html 106 // "rowgroup" -> ./grid-roles.html 107 // "rowheader" -> ./grid-roles.html 108 "scrollbar", 109 "search", 110 "searchbox", 111 // "section" -> ./abstract-roles.html 112 // "sectionhead" -> ./abstract-roles.html 113 // "select" -> ./abstract-roles.html 114 "separator", 115 "slider", 116 "spinbutton", 117 "status", 118 "strong", 119 // "structure" -> ./abstract-roles.html 120 "subscript", 121 "suggestion", 122 "superscript", 123 "switch", 124 // "tab" -> ./tab-roles.html 125 // "table" -> ./grid-roles.html 126 // "tablist" -> ./tab-roles.html 127 // "tabpanel" -> ./tab-roles.html 128 "term", 129 "textbox", 130 "time", 131 "timer", 132 "toolbar", 133 "tooltip", 134 // "tree" -> ./tree-roles.html 135 // "treeitem" -> ./tree-roles.html 136 // "treegrid" -> ./treegrid-roles.html 137 // "widget" -> ./abstract-roles.html 138 // "window" -> ./abstract-roles.html 139 ]; 140 141 // Lower case 142 AriaUtils.assignAndVerifyRolesByRoleNames(ariaRoles); 143 144 // Upper case 145 AriaUtils.assignAndVerifyRolesByRoleNames( 146 ariaRoles.map(role => role.toUpperCase()) 147 ); 148 149 // Sentence case 150 AriaUtils.assignAndVerifyRolesByRoleNames( 151 ariaRoles.map(role => 152 role.charAt(0).toUpperCase() + role.slice(1).toLowerCase() 153 ) 154 ); 155 156 </script> 157 </body> 158 </html>