diff options
Diffstat (limited to 'accessible/tests/mochitest/name/test_general.html')
| -rw-r--r-- | accessible/tests/mochitest/name/test_general.html | 732 |
1 files changed, 732 insertions, 0 deletions
diff --git a/accessible/tests/mochitest/name/test_general.html b/accessible/tests/mochitest/name/test_general.html new file mode 100644 index 0000000000..89314712fb --- /dev/null +++ b/accessible/tests/mochitest/name/test_general.html @@ -0,0 +1,732 @@ +<html> + +<head> + <title>nsIAccessible::name calculation</title> + <link rel="stylesheet" type="text/css" + href="chrome://mochikit/content/tests/SimpleTest/test.css" /> + + <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script> + + <script type="application/javascript" + src="../common.js"></script> + <script type="application/javascript" + src="../name.js"></script> + + <script type="application/javascript"> + + function doTest() { + // aria-label + + // Simple label provided via ARIA + testName("btn_simple_aria_label", "I am a button"); + + // aria-label and aria-labelledby, expect aria-labelledby + testName("btn_both_aria_labels", "text I am a button, two"); + + // //////////////////////////////////////////////////////////////////////// + // aria-labelledby + + // Single relation. The value of 'aria-labelledby' contains the ID of + // an element. Gets the name from text node of that element. + testName("btn_labelledby_text", "text"); + + // Multiple relations. The value of 'aria-labelledby' contains the IDs + // of elements. Gets the name from text nodes of those elements. + testName("btn_labelledby_texts", "text1 text2"); + + // //////////////////////////////////////////////////////////////////////// + // Name from named accessible + + testName("input_labelledby_namedacc", "Data"); + + // //////////////////////////////////////////////////////////////////////// + // Name from subtree (single relation labelled_by). + + // Gets the name from text nodes contained by nested elements + testName("btn_labelledby_mixed", "nomore text"); + + // Gets the name from text nodes contained by nested elements, ignores + // hidden elements (bug 443081). + testName("btn_labelledby_mixed_hidden_child", "nomore text2"); + + // Gets the name from hidden text nodes contained by nested elements, + // (label element is hidden entirely), (bug 443081). + testName("btn_labelledby_mixed_hidden", "lala more hidden text"); + + // Gets the name from text nodes contained by nested elements having block + // representation (every text node value in the name should be devided by + // spaces) + testName("btn_labelledby_mixed_block", "text more text"); + + // Gets the name from text nodes contained by html:td. The text nodes + // should not be divided by spaces. + testName("btn_labelledby_mixed_table", "textTEXTtext"); + + // Gets the name from image accessible. + testName("btn_labelledby_mixed_img", "text image"); + + // Gets the name from input accessibles + // Note: if input have label elements then the name isn't calculated + // from them. + testName("btn_labelledby_mixed_input", + "input button Submit Query Reset Submit Query"); + + // Gets the name from the title of object element. + testName("btn_labelledby_mixed_object", "object"); + + // Gets the name from text nodes. Element br adds space between them. + testName("btn_labelledby_mixed_br", "text text"); + + // Gets the name from label content which allows name from subtree, + // ignore @title attribute on label + testName("from_label_ignoretitle", "Country:"); + + // Gets the name from html:p content, which doesn't allow name from + // subtree, ignore @title attribute on label + testName("from_p_ignoretitle", "Choose country from."); + + // Gets the name from html:input value, ignore @title attribute on input + testName("from_input_ignoretitle", "Custom country"); + + // Insert spaces around the control's value to not jamm sibling text nodes + testName("insert_spaces_around_control", "start value end"); + + // Gets the name from @title, ignore whitespace content + testName("from_label_ignore_ws_subtree", "about"); + + // role="alert" doesn't get name from subtree... + testName("alert", null); + // but the subtree is used if referenced by aria-labelledby. + testName("inputLabelledByAlert", "Error"); + + // //////////////////////////////////////////////////////////////////////// + // label element + + // The label element contains the button. The name is calculated from + // this button. + // Note: the name contains the content of the button. + testName("btn_label_inside", "text10text"); + + // The label element and the button are placed in the same form. Gets + // the name from the label subtree. + testName("btn_label_inform", "in form"); + + // The label element is placed outside of form where the button is. + // Take into account the label. + testName("btn_label_outform", "out form"); + + // The label element and the button are in the same document. Gets the + // name from the label subtree. + testName("btn_label_indocument", "in document"); + + // Multiple label elements for single button + testName("btn_label_multi", "label1label2"); + + // Multiple controls inside a label element + testName("ctrl_in_label_1", "Enable a button control"); + testName("ctrl_in_label_2", "button"); + + + // //////////////////////////////////////////////////////////////////////// + // name from children + + // ARIA role button is presented allowing the name calculation from + // children. + testName("btn_children", "14"); + + // html:button, no name from content + testName("btn_nonamefromcontent", null); + + // ARIA role option is presented allowing the name calculation from + // visible children (bug 443081). + testName("lb_opt1_children_hidden", "i am visible"); + + // Get the name from subtree of menuitem crossing role nothing to get + // the name from its children. + testName("tablemenuitem", "menuitem 1"); + + // Get the name from child acronym title attribute rather than from + // acronym content. + testName("label_with_acronym", "O A T F World Wide Web"); + + testName("testArticle", "Test article"); + + testName("h1", "heading"); + testName("aria_heading", "aria_heading"); + + // //////////////////////////////////////////////////////////////////////// + // title attribute + + // If nothing is left. Let's try title attribute. + testName("btn_title", "title"); + + // //////////////////////////////////////////////////////////////////////// + // textarea name + + // textarea's name should have the value, which initially is specified by + // a text child. + testName("textareawithchild", "Story Foo is ended."); + + // new textarea name should reflect the value change. + var elem = document.getElementById("textareawithchild"); + elem.value = "Bar"; + + testName("textareawithchild", "Story Bar is ended."); + + // //////////////////////////////////////////////////////////////////////// + // controls having a value used as a part of computed name + + testName("ctrlvalue_progressbar:input", "foo 5 baz"); + testName("ctrlvalue_scrollbar:input", "foo 5 baz"); + testName("ctrlvalue_slider:input", "foo 5 baz"); + testName("ctrlvalue_spinbutton:input", "foo 5 baz"); + testName("ctrlvalue_combobox:input", "foo 5 baz"); + testName("ctrlvalue_meter:input", "foo 5 baz"); + + + // /////////////////////////////////////////////////////////////////////// + // label with nested combobox (test for 'f' item of name computation guide) + + testName("comboinstart", "One day(s)."); + testName("combo3", "day(s)."); + + testName("textboxinstart", "Two days."); + testName("textbox1", "days."); + + testName("comboinmiddle", "Subscribe to ATOM feed."); + testName("combo4", "Subscribe to ATOM feed."); + + testName("comboinmiddle2", "Play the Haliluya sound when new mail arrives"); + testName("combo5", null); // label isn't used as a name for control + testName("checkbox", "Play the Haliluya sound when new mail arrives"); + testName("comboinmiddle3", "Play the Haliluya sound when new mail arrives"); + testName("combo6", "Play the Haliluya sound when new mail arrives"); + + testName("comboinend", "This day was sunny"); + testName("combo7", "This day was"); + + testName("textboxinend", "This day was sunny"); + testName("textbox2", "This day was"); + + // placeholder + testName("ph_password", "a placeholder"); + testName("ph_text", "a placeholder"); + testName("ph_textarea", "a placeholder"); + testName("ph_text2", "a label"); + testName("ph_textarea2", "a label"); + testName("ph_text3", "a label"); + + // Test equation image + testName("img_eq", "x^2 + y^2 + z^2"); + testName("input_img_eq", "x^2 + y^2 + z^2"); + testName("txt_eq", "x^2 + y^2 + z^2"); + + // ////////////////////////////////////////////////////////////////////// + // tests for duplicate announcement of content + + testName("test_note", null); + + // ////////////////////////////////////////////////////////////////////// + // Tests for name from sub tree of tr element. + + // By default, we want no name. + testName("NoNameForTR", null); + testName("NoNameForNonStandardTR", null); + + // But we want it if the tr has an ARIA role. + testName("NameForTRBecauseStrongARIA", "a b"); + + // But not if it is a weak (landmark) ARIA role + testName("NoNameForTRBecauseWeakARIA", null); + + // Name from sub tree of grouping if requested by other accessible. + testName("grouping", null); + testName("requested_name_from_grouping", "label"); + testName("listitem_containing_block_tbody", "label"); + // Groupings shouldn't be included when calculating from the subtree of + // a treeitem. + testName("treeitem_containing_grouping", "root"); + + // Name from subtree of grouping labelled by an ancestor. + testName("grouping_labelledby_ancestor", "label"); + + // Name from subtree of a container containing text nodes and inline + // elements. There should be no spaces because everyhing is inline. + testName("container_text_inline", "abc"); + // Name from subtree of a container containing text nodes and block + // elements. There should be a space on both sides of the block. + testName("container_text_block", "a b c"); + // Name from subtree of a container containing text nodes and empty + // block elements. There should be space on either side of the blocks, but + // not a double space. + testName("container_text_emptyblock", "a b"); + + SimpleTest.finish(); + } + + SimpleTest.waitForExplicitFinish(); + addA11yLoadEvent(doTest); + </script> + +</head> + +<body> + + <a target="_blank" + href="https://bugzilla.mozilla.org/show_bug.cgi?id=428479" + title="Bug 428479 - Support ARIA role=math"> + Bug 428479 + </a> + <a target="_blank" + href="https://bugzilla.mozilla.org/show_bug.cgi?id=429666" + title="Expose ROLE_DOCUMENT for ARIA landmarks that inherit from document"> + Bug 429666 + </a> + <a target="_blank" + href="https://bugzilla.mozilla.org/show_bug.cgi?id=444279" + title="mochitest for accessible name calculating"> + Bug 444279 + </a> + <a target="_blank" + href="https://bugzilla.mozilla.org/show_bug.cgi?id=459635" + title="nsIAccessible::name calculation for HTML buttons"> + Bug 459635 + </a> + <a target="_blank" + href="https://bugzilla.mozilla.org/show_bug.cgi?id=530081" + title="Clean up our tree walker"> + Bug 530081 + </a><br> + <a target="_blank" + href="https://bugzilla.mozilla.org/show_bug.cgi?id=604391" + title="Use placeholder as name if name is otherwise empty"> + Bug 604391 + </a> + <a target="_blank" + href="https://bugzilla.mozilla.org/show_bug.cgi?id=669312" + title="Accessible name is duplicated when input has a label associated uisng for/id and is wrapped around the input"> + Bug 669312 + </a> + <a target="_blank" + href="https://bugzilla.mozilla.org/show_bug.cgi?id=704416" + title="HTML acronym and abbr names should be provided by @title"> + Bug 704416 + </a> + <a target="_blank" + href="https://bugzilla.mozilla.org/show_bug.cgi?id=812041" + title="ARIA slider and spinbutton don't provide a value for name computation"> + Bug 812041 + </a> + <a target="_blank" + href="https://bugzilla.mozilla.org/show_bug.cgi?id=823927" + title="Text is jammed with control's text in name computation"> + Bug 823927 + </a> + <a target="_blank" + href="https://bugzilla.mozilla.org/show_bug.cgi?id=835666" + title="ARIA combobox selected value is not a part of name computation"> + Bug 835666 + </a> + <a target="_blank" + href="https://bugzilla.mozilla.org/show_bug.cgi?id=833256" + title="role note shouldn't pick up the name from subtree"> + Mozilla Bug 833256 + </a> + <p id="display"></p> + <div id="content" style="display: none"></div> + <pre id="test"> + </pre> + + <!-- aria-label, simple label --> + <span id="btn_simple_aria_label" role="button" aria-label="I am a button"/> + <br/> + <!-- aria-label plus aria-labelledby --> + <span id="btn_both_aria_labels" role="button" aria-label="I am a button, two" + aria-labelledby="labelledby_text btn_both_aria_labels"/> + <br/> + + <!-- aria-labelledby, single relation --> + <span id="labelledby_text">text</span> + <button id="btn_labelledby_text" + aria-labelledby="labelledby_text">1</button> + <br/> + + <!-- aria-labelledby, multiple relations --> + <span id="labelledby_text1">text1</span> + <span id="labelledby_text2">text2</span> + <button id="btn_labelledby_texts" + aria-labelledby="labelledby_text1 labelledby_text2">2</button> + <br/> + + <!-- name from named accessible --> + <input id="labelledby_namedacc" type="checkbox" + aria-label="Data" /> + <input id="input_labelledby_namedacc" + aria-labelledby="labelledby_namedacc" /> + + <!-- the name from subtree, mixed content --> + <span id="labelledby_mixed">no<span>more text</span></span> + <button id="btn_labelledby_mixed" + aria-labelledby="labelledby_mixed">3</button> + <br/> + + <!-- the name from subtree, mixed/hidden content --> + <span id="labelledby_mixed_hidden_child"> + no<span>more + <span style="display: none;">hidden</span> + text2 + <span style="visibility: hidden">hidden2</span> + </span> + </span> + <button id="btn_labelledby_mixed_hidden_child" + aria-labelledby="labelledby_mixed_hidden_child">3.1</button> + <br/> + + <!-- the name from subtree, mixed/completely hidden content --> + <span id="labelledby_mixed_hidden" + style="display: none;">lala <span>more hidden </span>text</span></span> + <button id="btn_labelledby_mixed_hidden" + aria-labelledby="labelledby_mixed_hidden">3.2</button> + <br/> + + <!-- the name from subtree, mixed content, block structure --> + <div id="labelledby_mixed_block"><div>text</div>more text</div></div> + <button id="btn_labelledby_mixed_block" + aria-labelledby="labelledby_mixed_block">4</button> + <br/> + + <!-- the name from subtree, mixed content, table structure --> + <table><tr> + <td id="labelledby_mixed_table">text<span>TEXT</span>text</td> + </tr></table> + <button id="btn_labelledby_mixed_table" + aria-labelledby="labelledby_mixed_table">5</button> + <br/> + + <!-- the name from subtree, child img --> + <span id="labelledby_mixed_img">text<img alt="image"/></span> + <button id="btn_labelledby_mixed_img" + aria-labelledby="labelledby_mixed_img">6</button> + <br/> + + <!-- the name from subtree, child inputs --> + <span id="labelledby_mixed_input"> + <input type="button" id="input_button" title="input button"/> + <input type="submit" id="input_submit"/> + <input type="reset" id="input_reset"/> + <input type="image" id="input_image" title="input image"/> + </span> + <button id="btn_labelledby_mixed_input" + aria-labelledby="labelledby_mixed_input">7</button> + <br/> + + <!-- the name from subtree, child object --> + <span id="labelledby_mixed_object"> + <object data="about:blank" title="object"></object> + </span> + <button id="btn_labelledby_mixed_object" + aria-labelledby="labelledby_mixed_object">8</button> + <br/> + + <!-- the name from subtree, child br --> + <span id="labelledby_mixed_br">text<br/>text</span> + <button id="btn_labelledby_mixed_br" + aria-labelledby="labelledby_mixed_br">9</button> + <br/> + + <!-- the name from subtree, name from label content rather than from its title + attribute --> + <label for="from_label_ignoretitle" + title="Select your country of origin">Country:</label> + <select id="from_label_ignoretitle"> + <option>Germany</option> + <option>Russia</option> + </select> + + <!-- the name from subtree, name from html:p content rather than from its + title attribute --> + <p id="p_ignoretitle" + title="Select your country of origin">Choose country from.</p> + <select id="from_p_ignoretitle" aria-labelledby="p_ignoretitle"> + <option>Germany</option> + <option>Russia</option> + </select> + + <!-- the name from subtree, name from html:input value rather than from its + title attribute --> + <p id="from_input_ignoretitle" aria-labelledby="input_ignoretitle">Country</p> + <input id="input_ignoretitle" + value="Custom country" + title="Input your country of origin"/ > + + <!-- name from subtree, surround control by spaces to not jamm the text --> + <label id="insert_spaces_around_control"> + start<input value="value">end + </label> + + <!-- no name from subtree because it holds whitespaces only --> + <a id="from_label_ignore_ws_subtree" href="about:mozilla" title="about"> </a> + + <!-- Don't use subtree unless referenced by aria-labelledby. --> + <div id="alert" role="alert">Error</div> + <input type="text" id="inputLabelledByAlert" aria-labelledby="alert"> + + <!-- label element, label contains control --> + <label>text<button id="btn_label_inside">10</button>text</label> + <br/> + + <!-- label element, label and the button are in the same form --> + <form> + <label for="btn_label_inform">in form</label> + <button id="btn_label_inform">11</button> + </form> + + <!-- label element, label is outside of the form of the button --> + <label for="btn_label_outform">out form</label> + <form> + <button id="btn_label_outform">12</button> + </form> + + <!-- label element, label and the button are in the same document --> + <label for="btn_label_indocument">in document</label> + <button id="btn_label_indocument">13</button> + + <!-- multiple label elements for single button --> + <label for="btn_label_multi">label1</label> + <label for="btn_label_multi">label2</label> + <button id="btn_label_multi">button</button> + + <!-- a label containing more than one controls --> + <label> + Enable <input id="ctrl_in_label_1" type="checkbox"> a + <input id="ctrl_in_label_2" type="button" value="button"> control + </label> + + <!-- name from children --> + <span id="btn_children" role="button">14</span> + + <!-- no name from content, ARIA role overrides this rule --> + <button id="btn_nonamefromcontent" role="img">1</button> + + <!-- name from children, hidden children --> + <div role="listbox" tabindex="0"> + <div id="lb_opt1_children_hidden" role="option" tabindex="0"> + <span>i am visible</span> + <span style="display:none">i am hidden</span> + </div> + </div> + + <table role="menu"> + <tr role="menuitem" id="tablemenuitem"> + <td>menuitem 1</td> + </tr> + <tr role="menuitem"> + <td>menuitem 2</td> + </tr> + </table> + + <label id="label_with_acronym"> + <acronym title="O A T F">OATF</acronym> + <abbr title="World Wide Web">WWW</abbr> + </label> + + <div id="testArticle" role="article" title="Test article"> + <p>This is a paragraph inside the article.</p> + </div> + + <h1 id="h1" title="oops">heading</h1> + <div role="heading" id="aria_heading">aria_heading</div> + + <!-- name from title attribute --> + <span id="btn_title" role="group" title="title">15</span> + + <!-- A textarea nested in a label with a text child (bug #453371). --> + <form> + <label>Story + <textarea id="textareawithchild" name="name">Foo</textarea> + is ended. + </label> + </form> + + <!-- controls having a value used as part of computed name --> + <input type="checkbox" id="ctrlvalue_progressbar:input"> + <label for="ctrlvalue_progressbar:input"> + foo <span role="progressbar" + aria-valuenow="5" aria-valuemin="1" + aria-valuemax="10">5</span> baz + </label> + + <input type="checkbox" id="ctrlvalue_scrollbar:input" /> + <label for="ctrlvalue_scrollbar:input"> + foo <span role="scrollbar" + aria-valuenow="5" aria-valuemin="1" + aria-valuemax="10">5</span> baz + </label> + + <input type="checkbox" id="ctrlvalue_slider:input"> + <label for="ctrlvalue_slider:input"> + foo <input role="slider" type="range" + value="5" min="1" max="10" + aria-valuenow="5" aria-valuemin="1" + aria-valuemax="10"> baz + </label> + + <input type="checkbox" id="ctrlvalue_spinbutton:input"> + <label for="ctrlvalue_spinbutton:input"> + foo <input role="spinbutton" type="number" + value="5" min="1" max="10" + aria-valuenow="5" aria-valuemin="1" + aria-valuemax="10"> + baz + </label> + + <input type="checkbox" id="ctrlvalue_combobox:input"> + <label for="ctrlvalue_combobox:input"> + foo + <div role="combobox"> + <div role="textbox"></div> + <ul role="listbox" style="list-style-type: none;"> + <li role="option">1</li> + <li role="option" aria-selected="true">5</li> + <li role="option">3</li> + </ul> + </div> + baz + </label> + + <input type="checkbox" id="ctrlvalue_meter:input"> + <label for="ctrlvalue_meter:input"> + foo + <meter>5</meter> + </div> + baz + </label> + + <!-- a label with a nested control in the start, middle and end --> + <form> + <!-- at the start (without and with whitespaces) --> + <label id="comboinstart"><select id="combo3"> + <option>One</option> + <option>Two</option> + </select> + day(s). + </label> + + <label id="textboxinstart"> + <input id="textbox1" value="Two"> + days. + </label> + + <!-- in the middle --> + <label id="comboinmiddle"> + Subscribe to + <select id="combo4" name="occupation"> + <option>ATOM</option> + <option>RSS</option> + </select> + feed. + </label> + + <label id="comboinmiddle2" for="checkbox">Play the + <select id="combo5"> + <option>Haliluya</option> + <option>Hurra</option> + </select> + sound when new mail arrives + </label> + <input id="checkbox" type="checkbox" /> + + <label id="comboinmiddle3" for="combo6">Play the + <select id="combo6"> + <option>Haliluya</option> + <option>Hurra</option> + </select> + sound when new mail arrives + </label> + + <!-- at the end (without and with whitespaces) --> + <label id="comboinend"> + This day was + <select id="combo7" name="occupation"> + <option>sunny</option> + <option>rainy</option> + </select></label> + + <label id="textboxinend"> + This day was + <input id="textbox2" value="sunny"> + </label> + </form> + + <!-- placeholder --> + <input id="ph_password" type="password" value="" placeholder="a placeholder" /> + <input id="ph_text" type="text" placeholder="a placeholder" /> + <textarea id="ph_textarea" cols="5" placeholder="a placeholder"></textarea> + + <!-- placeholder does not win --> + <input id="ph_text2" type="text" aria-label="a label" placeholder="meh" /> + <textarea id="ph_textarea2" cols="5" aria-labelledby="ph_text2" + placeholder="meh"></textarea> + + <label for="ph_text3">a label</label> + <input id="ph_text3" placeholder="meh" /> + + <p>Image: + <img id="img_eq" role="math" src="foo" alt="x^2 + y^2 + z^2"> + <input type="image" id="input_img_eq" 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> + + <!-- duplicate announcement --> + <div id="test_note" role="note">subtree</div> + + <!-- No name for tr from its sub tree --> + <table><tr id="NoNameForTR"><th>a</th><td>b</td></tr></table> + <table style="display: block;"> + <tr id="NoNameForNonStandardTR" style="display:block;"> + <th>a</th><td>b</td> + </tr> + </table> + + <!-- Name from sub tree of tr, because it has a strong ARIA role --> + <table><tr id="NameForTRBecauseStrongARIA" role="row"><th>a</th><td>b</td></tr></table> + + <!-- No name for tr because of weak (landmark) role --> + <table><tr id="NoNameForTRBecauseWeakARIA" role="main"><th>a</th><td>b</td></tr></table> + + <!-- Name from subtree of grouping if requested by other object --> + <div id="grouping" role="group">label</div> + <button id="requested_name_from_grouping"aria-labelledby="grouping"></button> + <!-- Name from sub tree of tbody marked as display:block;, which is also a grouping --> + <div id="listitem_containing_block_tbody" role="listitem"> + <table> + <tbody style="display: block;"> + <tr><td>label</td></tr> + </tbody> + </table> + </div> + <!-- Name from subtree of treeitem containing grouping --> + <div id="treeitem_containing_grouping" role="treeitem" aria-level="1" aria-expanded="true">root + <div role="group"> + <div role="treeitem" aria-level="2">sub</div> + </div> + </div> + + <!-- Name from subtree of grouping labelled by an ancestor. --> + <div id="grouping_ancestor_label">label + <div id="grouping_labelledby_ancestor" role="group" aria-labelledby="grouping_ancestor_label"> + This content should not be included in the grouping's label. + </div> + </div> + + <!-- Text nodes and inline elements. --> + <div id="container_text_inline" role="option">a<strong>b</strong>c</div> + <!-- Text nodes and block elements. --> + <div id="container_text_block" role="option">a<p>b</p>c</div> + <!-- Text nodes and empty block elements. --> + <div id="container_text_emptyblock" role="option">a<p></p><p></p>b</div> +</body> +</html> |