<!DOCTYPE html> <html> <head> <title>Test weak ARIA roles</title> <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css" /> <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script> <script type="application/javascript" src="../common.js"></script> <script type="application/javascript" src="../role.js"></script> <script type="application/javascript"> function doTest() { // ARIA role map. testRole("aria_alert", ROLE_ALERT); testRole("aria_alertdialog", ROLE_DIALOG); testRole("aria_application", ROLE_APPLICATION); testRole("aria_article", ROLE_DOCUMENT); testRole("aria_button", ROLE_PUSHBUTTON); testRole("aria_checkbox", ROLE_CHECKBUTTON); testRole("aria_columnheader", ROLE_COLUMNHEADER); testRole("aria_combobox", ROLE_COMBOBOX); testRole("aria_dialog", ROLE_DIALOG); testRole("aria_directory", ROLE_LIST); testRole("aria_document", ROLE_DOCUMENT); testRole("aria_form", ROLE_FORM); testRole("aria_feed", ROLE_GROUPING); testRole("aria_grid", ROLE_TABLE); testRole("aria_gridcell", ROLE_GRID_CELL); testRole("aria_group", ROLE_GROUPING); testRole("aria_heading", ROLE_HEADING); testRole("aria_img", ROLE_GRAPHIC); testRole("aria_link", ROLE_LINK); testRole("aria_list", ROLE_LIST); testRole("aria_listbox", ROLE_LISTBOX); testRole("aria_listitem", ROLE_LISTITEM); testRole("aria_log", ROLE_TEXT); // weak role testRole("aria_marquee", ROLE_ANIMATION); testRole("aria_math", ROLE_FLAT_EQUATION); testRole("aria_menu", ROLE_MENUPOPUP); testRole("aria_menubar", ROLE_MENUBAR); testRole("aria_menuitem", ROLE_MENUITEM); testRole("aria_menuitemcheckbox", ROLE_CHECK_MENU_ITEM); testRole("aria_menuitemradio", ROLE_RADIO_MENU_ITEM); testRole("aria_note", ROLE_NOTE); testRole("aria_presentation", ROLE_TEXT); // weak role testRole("aria_progressbar", ROLE_PROGRESSBAR); testRole("aria_radio", ROLE_RADIOBUTTON); testRole("aria_radiogroup", ROLE_RADIO_GROUP); testRole("aria_region", ROLE_PANE); testRole("aria_row", ROLE_ROW); testRole("aria_rowheader", ROLE_ROWHEADER); testRole("aria_scrollbar", ROLE_SCROLLBAR); testRole("aria_searchbox", ROLE_ENTRY); testRole("aria_separator", ROLE_SEPARATOR); testRole("aria_slider", ROLE_SLIDER); testRole("aria_spinbutton", ROLE_SPINBUTTON); testRole("aria_status", ROLE_STATUSBAR); testRole("aria_switch", ROLE_SWITCH); testRole("aria_tab", ROLE_PAGETAB); testRole("aria_tablist", ROLE_PAGETABLIST); testRole("aria_tabpanel", ROLE_PROPERTYPAGE); testRole("aria_textbox", ROLE_ENTRY); testRole("aria_timer", ROLE_TEXT); // weak role testRole("aria_toolbar", ROLE_TOOLBAR); testRole("aria_tooltip", ROLE_TOOLTIP); testRole("aria_tree", ROLE_OUTLINE); testRole("aria_treegrid", ROLE_TREE_TABLE); testRole("aria_treeitem", ROLE_OUTLINEITEM); // Note: // The phrase "weak foo" here means that there is no good foo-to-platform // role mapping. Similarly "strong foo" means there is a good foo-to- // platform role mapping. testRole("articlemain", ROLE_DOCUMENT); testRole("articleform", ROLE_FORM); // Test article exposed as document testRole("testArticle", ROLE_DOCUMENT); // weak roles that are forms of "live regions" testRole("log_table", ROLE_TABLE); testRole("timer_div", ROLE_SECTION); // other roles that are forms of "live regions" testRole("marquee_h1", ROLE_ANIMATION); // strong landmark testRole("application", ROLE_APPLICATION); testRole("form", ROLE_FORM); testRole("application_table", ROLE_APPLICATION); // weak landmarks var weak_landmarks = ["banner", "complementary", "contentinfo", "main", "navigation", "search"]; for (l in weak_landmarks) testRole(weak_landmarks[l], ROLE_SECTION); for (l in weak_landmarks) { var id = weak_landmarks[l] + "_table"; testRole(id, ROLE_TABLE); var accessibleTable = getAccessible(id, [nsIAccessibleTable], null, DONOTFAIL_IF_NO_INTERFACE); ok(accessibleTable ? true : false, "landmarked table should have nsIAccessibleTable"); if (accessibleTable) is(accessibleTable.getCellAt(0,0).firstChild.name, "hi", "no cell"); } ////////////////////////////////////////////////////////////////////////// // test gEmptyRoleMap testRole("buttontable_row", ROLE_NOTHING); testRole("buttontable_cell", ROLE_NOTHING); // abstract roles var abstract_roles = ["composite", "landmark", "structure", "widget", "window", "input", "range", "select", "section", "sectionhead"]; for (a in abstract_roles) testRole(abstract_roles[a], ROLE_SECTION); ////////////////////////////////////////////////////////////////////////// // roles transformed by ARIA state attributes testRole("togglebutton", ROLE_TOGGLE_BUTTON); ////////////////////////////////////////////////////////////////////////// // ignore unknown roles, take first known testRole("unknown_roles", ROLE_PUSHBUTTON); ////////////////////////////////////////////////////////////////////////// // misc roles testRole("note", ROLE_NOTE); testRole("scrollbar", ROLE_SCROLLBAR); testRole("dir", ROLE_LIST); ////////////////////////////////////////////////////////////////////////// // test document role map update var testDoc = getAccessible(document, [nsIAccessibleDocument]); testRole(testDoc, ROLE_DOCUMENT); document.body.setAttribute("role", "application"); testRole(testDoc, ROLE_APPLICATION); // Test equation image testRole("img_eq", ROLE_FLAT_EQUATION); // Test textual equation testRole("txt_eq", ROLE_FLAT_EQUATION); SimpleTest.finish(); } SimpleTest.waitForExplicitFinish(); addA11yLoadEvent(doTest); </script> </head> <body> <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=428479">Mozilla Bug 428479</a> <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=429666">Mozilla Bug 429666</a> <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=481114">Mozilla Bug 481114</a> <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=469688">Mozilla Bug 469688</a> <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=469688">Mozilla Bug 520188</a> <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=529289">Mozilla Bug 529289</a> <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=529289">Mozilla Bug 607219</a> <a target="_blank" title="HTML buttons with aria-pressed not exposing IA2 TOGGLE_BUTTON role" href="https://bugzilla.mozilla.org/show_bug.cgi?id=725432"> Bug 725432 </a> <a target="_blank" title="Map ARIA role FORM" href="https://bugzilla.mozilla.org/show_bug.cgi?id=735645"> Bug 735645 </a> <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1136563" title="Support ARIA 1.1 switch role"> Bug 1136563 </a> <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1121518" title="Support ARIA 1.1 searchbox role"> Bug 1121518 </a> <p id="display"></p> <div id="content" style="display: none"></div> <pre id="test"> </pre> <span id="aria_alert" role="alert"/> <span id="aria_alertdialog" role="alertdialog"/> <span id="aria_application" role="application"/> <span id="aria_article" role="article"/> <span id="aria_button" role="button"/> <span id="aria_checkbox" role="checkbox"/> <span id="aria_columnheader" role="columnheader"/> <span id="aria_combobox" role="combobox"/> <span id="aria_dialog" role="dialog"/> <span id="aria_directory" role="directory"/> <span id="aria_document" role="document"/> <span id="aria_form" role="form"/> <span id="aria_feed" role="feed"/> <span id="aria_grid" role="grid"/> <span id="aria_gridcell" role="gridcell"/> <span id="aria_group" role="group"/> <span id="aria_heading" role="heading"/> <span id="aria_img" role="img"/> <span id="aria_link" role="link"/> <span id="aria_list" role="list"/> <span id="aria_listbox" role="listbox"/> <span id="aria_listitem" role="listitem"/> <span id="aria_log" role="log"/> <span id="aria_marquee" role="marquee"/> <span id="aria_math" role="math"/> <span id="aria_menu" role="menu"/> <span id="aria_menubar" role="menubar"/> <span id="aria_menuitem" role="menuitem"/> <span id="aria_menuitemcheckbox" role="menuitemcheckbox"/> <span id="aria_menuitemradio" role="menuitemradio"/> <span id="aria_note" role="note"/> <span id="aria_presentation" role="presentation" tabindex="0"/> <span id="aria_progressbar" role="progressbar"/> <span id="aria_radio" role="radio"/> <span id="aria_radiogroup" role="radiogroup"/> <span id="aria_region" role="region"/> <span id="aria_row" role="row"/> <span id="aria_rowheader" role="rowheader"/> <span id="aria_scrollbar" role="scrollbar"/> <span id="aria_searchbox" role="textbox"/> <span id="aria_separator" role="separator"/> <span id="aria_slider" role="slider"/> <span id="aria_spinbutton" role="spinbutton"/> <span id="aria_status" role="status"/> <span id="aria_switch" role="switch"/> <span id="aria_tab" role="tab"/> <span id="aria_tablist" role="tablist"/> <span id="aria_tabpanel" role="tabpanel"/> <span id="aria_textbox" role="textbox"/> <span id="aria_timer" role="timer"/> <span id="aria_toolbar" role="toolbar"/> <span id="aria_tooltip" role="tooltip"/> <span id="aria_tree" role="tree"/> <span id="aria_treegrid" role="treegrid"/> <span id="aria_treeitem" role="treeitem"/> <article id="articlemain" role="main">a main area</article> <article id="articleform" role="form">a form area</article> <div id="testArticle" role="article" title="Test article"> <p>This is a paragraph inside the article.</p> </div> <!-- "live" roles --> <table role="log" id="log_table"> <tr><td>Table based log</td></tr> </table> <h1 role="marquee" id="marquee_h1">marquee</h1> <div role="timer" id="timer_div">timer</div> <!-- landmarks --> <div role="application" id="application">application</div> <div role="form" id="form">form</div> <!-- weak landmarks --> <div role="banner" id="banner">banner</div> <div role="complementary" id="complementary">complementary</div> <div role="contentinfo" id="contentinfo">contentinfo</div> <div role="main" id="main">main</div> <div role="navigation" id="navigation">navigation</div> <div role="search" id="search">search</div> <!-- landmarks are tables --> <table role="application" id="application_table">application table <tr><td>hi<td></tr></table> <table role="banner" id="banner_table">banner table <tr><td>hi<td></tr></table> <table role="complementary" id="complementary_table">complementary table <tr><td>hi<td></tr></table> <table role="contentinfo" id="contentinfo_table">contentinfo table <tr><td>hi<td></tr></table> <table role="main" id="main_table">main table <tr><td>hi<td></tr></table> <table role="navigation" id="navigation_table">navigation table <tr><td>hi<td></tr></table> <table role="search" id="search_table">search table <tr><td>hi<td></tr></table> <!-- test gEmptyRoleMap --> <table role="button"> <tr id="buttontable_row"> <td id="buttontable_cell">cell</td> </tr> </table> <!-- user agents must not map abstract roles to platform API --> <!-- test abstract base type roles --> <div role="composite" id="composite">composite</div> <div role="landmark" id="landmark">landmark</div> <div role="roletype" id="roletype">roletype</div> <div role="structure" id="structure">structure</div> <div role="widget" id="widget">widget</div> <div role="window" id="window">window</div> <!-- test abstract input roles --> <div role="input" id="input">input</div> <div role="range" id="range">range</div> <div role="select" id="select">select</div> <!-- test abstract structure roles --> <div role="section" id="section">section</div> <div role="sectionhead" id="sectionhead">sectionhead</div> <!-- roles transformed by ARIA state attributes --> <button aria-pressed="true" id="togglebutton"> <!-- take the first known mappable role --> <div role="wiggly:worm abc123 button" id="unknown_roles">worm button</div> <!-- misc roles --> <div role="note" id="note">note</div> <div role="scrollbar" id="scrollbar">scrollbar</div> <div id="dir" role="directory"> <div role="listitem">A</div> <div role="listitem">B</div> <div role="listitem">C</div> </div> <p>Image: <img id="img_eq" role="math" src="foo" alt="x^2 + y^2 + z^2"> </p> <p>Text: <span id="txt_eq" role="math" title="x^2 + y^2 + z^2">x<sup>2</sup> + y<sup>2</sup> + z<sup>2</sup></span> </body> </html>