Source code
Revision control
Copy as Markdown
Other Tools
Test Info:
<!DOCTYPE html>
<html>
<head>
<title>test nsHyperTextAccessible accesible objects creation and their roles</title>
<link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css" />
<script type="application/javascript"
src="../common.js"></script>
<script type="application/javascript"
src="../role.js"></script>
<script type="application/javascript"
src="../attributes.js"></script>
<script type="application/javascript">
function doTests() {
// landmark tests section
testRole("frm", ROLE_FORM);
// nsHyperTextAcc tests section
// Test html:form.
testRole("nav", ROLE_LANDMARK);
testRole("header", ROLE_LANDMARK);
testRole("footer", ROLE_LANDMARK);
testRole("article", ROLE_ARTICLE);
testRole("aside", ROLE_LANDMARK);
testRole("section", ROLE_SECTION);
// Check that landmark elements get accessibles with styled overflow.
testRole("section_overflow", ROLE_SECTION);
testRole("nav_overflow", ROLE_LANDMARK);
testRole("header_overflow", ROLE_SECTION);
testRole("aside_overflow", ROLE_LANDMARK);
testRole("footer_overflow", ROLE_SECTION);
testRole("article_overflow", ROLE_ARTICLE);
// test html:div
testRole("sec", ROLE_SECTION);
// Test html:blockquote
testRole("quote", ROLE_BLOCKQUOTE);
// Test html:h, all levels
testRole("head1", ROLE_HEADING);
testRole("head2", ROLE_HEADING);
testRole("head3", ROLE_HEADING);
testRole("head4", ROLE_HEADING);
testRole("head5", ROLE_HEADING);
testRole("head6", ROLE_HEADING);
// Test that an html:input @type="file" is exposed as ROLE_PUSHBUTTON.
testRole("data", ROLE_PUSHBUTTON);
// Test that input type="checkbox" and type="radio" are
// exposed as such regardless of appearance style.
testRole("checkbox_regular", ROLE_CHECKBUTTON);
testRole("checkbox_appearance_none", ROLE_CHECKBUTTON);
testRole("radio_regular", ROLE_RADIOBUTTON);
testRole("radio_appearance_none", ROLE_RADIOBUTTON);
// Test regular paragraph by comparison to make sure exposure does not
// get broken.
testRole("p", ROLE_PARAGRAPH);
// Test dl, dt, dd
testRole("definitionlist", ROLE_DEFINITION_LIST);
testRole("definitionterm", ROLE_TERM);
testRole("definitiondescription", ROLE_DEFINITION);
// Has click, mousedown or mouseup listeners.
testRole("span1", ROLE_TEXT);
testRole("span2", ROLE_TEXT);
testRole("span3", ROLE_TEXT);
// Test role of listbox inside combobox
testRole("listbox1", ROLE_COMBOBOX_LIST);
testRole("listbox2", ROLE_COMBOBOX_LIST);
// Test role of menu and li items in menu
testRole("menu", ROLE_LIST);
testRole("menuItem", ROLE_LISTITEM);
SimpleTest.finish();
}
SimpleTest.waitForExplicitFinish();
addA11yLoadEvent(doTests);
</script>
</head>
<body>
title="html:input of type "file" no longer rendered to screen readers">
</a><br>
title="Test remaining implementations in nsHyperTextAccessible::GetRole">
</a><br>
<a target="_blank"
title="Expose click action if mouseup and mousedown are registered">
</a>
<a target="_blank"
title="Provide mappings for html5 <nav> <header> <footer> <article>"
</a><br/>
<a target="_blank"
title="Map <article> like we do aria role article">
</a>
<a target="_blank"
title="Change implementation of HTML5 landmark elements to conform">
</a>
<a target="_blank"
title="Map section to pane (like role=region)">
</a>
<a target="_blank"
title="Map ARIA role FORM">
</a>
<a target="_blank"
title="Listbox owned by combobox has the wrong role">
</a>
<p id="display"></p>
<div id="content" style="display: none"></div>
<pre id="test">
</pre>
<form id="frm" action="submit.php" method="post">
<label for="data">File</label>:
<input type="file" id="data" name="data" size="50"/>
<input type="checkbox" id="checkbox_regular" value="Check me"/>
<input type="checkbox" style="-moz-appearance: none;" id="checkbox_appearance_none" value="Check me"/>
<input type="radio" id="radio_regular" value="Check me"/>
<input type="radio" style="-moz-appearance: none;" id="radio_appearance_none" value="Check me"/>
</form>
<nav id="nav">a nav</nav>
<header id="header">a header</header>
<footer id="footer">a footer</footer>
<article id="article">an article</article>
<aside id="aside">by the way I am an aside</aside>
<section id="section">a section</section>
<section style="overflow: hidden;" id="section_overflow">
<nav style="overflow: hidden;"
id="nav_overflow">overflow nav</nav>
<header style="overflow: hidden;"
id="header_overflow">overflow header</header>
<aside style="overflow: hidden;" aria-label="aside"
id="aside_overflow">overflow aside</aside>
<footer style="overflow: hidden;"
id="footer_overflow">overflow footer</footer>
</section>
<article style="overflow: hidden;"
id="article_overflow">overflow article</article>
<p id="p">A paragraph for comparison.</p>
<div id="sec">A normal div</div>
<blockquote id="quote">A citation</blockquote>
<h1 id="head1">A heading level 1</h1>
<h2 id="head2">A heading level 2</h2>
<h3 id="head3">A heading level 3</h3>
<h4 id="head4">A heading level 4</h4>
<h5 id="head5">A heading level 5</h5>
<h6 id="head6">A heading level 6</h6>
<dl id="definitionlist">
<dt id="definitionterm">gecko</dt>
<dd id="definitiondescription">geckos have sticky toes</dd>
</dl>
<span id="span1" onclick="">clickable span</span>
<span id="span2" onmousedown="">clickable span</span>
<span id="span3" onmouseup="">clickable span</span>
<div id="combobox1" role="combobox">
<div id="listbox1" role="listbox"></div>
</div>
<div id="combobox2" role="combobox" aria-owns="listbox2"></div>
<div id="listbox2" role="listbox"></div>
<menu id="menu">
<li id="menuItem">menu item!</li>
</menu>
</body>
</html>