Bug 653601 - aria-selected ignored for ARIA tabs, patch=davidb, tbsaunde; tests=davidb, tbsaunde, marcoz; r=surkov, a=sheriff

This commit is contained in:
David Bolter 2011-05-24 16:02:44 +02:00
parent 0df7421e38
commit c3d02a4e2e
4 changed files with 149 additions and 5 deletions

View File

@ -477,7 +477,8 @@ nsRoleMapEntry nsARIAMap::gWAIRoleMap[] =
eNoValue,
eSwitchAction,
eNoLiveAttr,
kNoReqStates
kNoReqStates,
eARIASelectable
},
{
"tablist",

View File

@ -1533,15 +1533,20 @@ nsAccessible::State()
return states::DEFUNCT;
PRUint64 state = NativeState();
// Apply ARIA states to be sure accessible states will be overriden.
// Apply ARIA states to be sure accessible states will be overridden.
ApplyARIAState(&state);
if (mRoleMapEntry && mRoleMapEntry->role == nsIAccessibleRole::ROLE_PAGETAB) {
if (mRoleMapEntry && mRoleMapEntry->role == nsIAccessibleRole::ROLE_PAGETAB &&
!(state & states::SELECTED) &&
!mContent->AttrValueIs(kNameSpaceID_None,
nsAccessibilityAtoms::aria_selected,
nsAccessibilityAtoms::_false, eCaseMatters)) {
// Special case: for tabs, focused implies selected, unless explicitly
// false, i.e. aria-selected="false".
if (state & states::FOCUSED) {
state |= states::SELECTED;
} else {
// Expose 'selected' state on ARIA tab if the focus is on internal element
// of related tabpanel.
// If focus is in a child of the tab panel surely the tab is selected!
nsCOMPtr<nsIAccessible> tabPanel = nsRelUtils::
GetRelatedAccessible(this, nsIAccessibleRelation::RELATION_LABEL_FOR);

View File

@ -48,6 +48,7 @@ include $(topsrcdir)/config/rules.mk
_TEST_FILES =\
test_aria.html \
test_aria_imgmap.html \
test_aria_tabs.html \
test_doc.html \
test_docarticle.html \
test_editablebody.html \

View File

@ -0,0 +1,137 @@
<!DOCTYPE html>
<html>
<head>
<title>Test ARIA tab accessible selected state</title>
<link rel="stylesheet" type="text/css"
href="chrome://mochikit/content/tests/SimpleTest/test.css" />
<script type="application/javascript"
src="chrome://mochikit/content/MochiKit/packed.js"></script>
<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="../states.js"></script>
<script type="application/javascript"
src="../events.js"></script>
<script type="application/javascript">
function focusARIATab(aID, aIsSelected)
{
this.DOMNode = getNode(aID);
this.invoke = function focusARIATab_invoke()
{
this.DOMNode.focus();
}
this.check = function focusARIATab_check(aEvent)
{
testStates(this.DOMNode, aIsSelected ? STATE_SELECTED : 0, 0,
aIsSelected ? 0 : STATE_SELECTED);
}
this.getID = function focusARIATab_getID()
{
return "Focused ARIA Tab with aria-selected=" +
(aIsSelected ? "true, should" : "false, shouldn't") +
" have selected state on " + prettyName(aID);
}
}
function focusActiveDescendantTab(aTabID, aTabListID, aIsSelected)
{
this.DOMNode = getNode(aTabID);
this.tabListDOMNode = getNode(aTabListID);
this.invoke = function focusActiveDescendantTab_invoke()
{
this.tabListDOMNode.setAttribute("aria-activedescendant", aTabID);
this.tabListDOMNode.focus();
}
this.check = function focusActiveDescendantTab_check(aEvent)
{
testStates(this.DOMNode, aIsSelected ? STATE_SELECTED : 0, 0,
aIsSelected ? 0 : STATE_SELECTED);
}
this.getID = function tabActiveDescendant_getID()
{
return "ARIA Tab with activedescendant " +
(aIsSelected ? "should" : "shouldn't") +
" have the selected state on " + prettyName(aTabID);
}
}
////////////////////////////////////////////////////////////////////////////
// Test
//gA11yEventDumpID = "eventdump"; // debug stuff
//gA11yEventDumpToConsole = true;
var gQueue = null;
function doTest()
{
// simple tabs
testStates("aria_tab1", 0, 0, STATE_SELECTED);
testStates("aria_tab2", STATE_SELECTED);
// To make sure our focus != selected is truly under test, we need to
// make sure our cache of what currently has focus is correct, which
// we update asyncronously.
gQueue = new eventQueue(EVENT_FOCUS);
gQueue.push(new focusARIATab("aria_tab1", true));
gQueue.push(new focusARIATab("aria_tab3", false));
gQueue.push(new focusARIATab("aria_tab2", true));
// selection through aria-activedescendant
// Make sure initially setting it selects the tab.
gQueue.push(new focusActiveDescendantTab("aria_tab5", "aria_tablist2", true));
// Now, make sure if one is selected selection gets transferred properly.
gQueue.push(new focusActiveDescendantTab("aria_tab6", "aria_tablist2", true));
// Now, make sure the focused but explicitly unselected one behaves.
gQueue.push(new focusActiveDescendantTab("aria_tab4", "aria_tablist2", false));
gQueue.invoke(); // SimpleTest.finish() will be called in the end
}
SimpleTest.waitForExplicitFinish();
addA11yLoadEvent(doTest);
</script>
</head>
<body>
<a target="_blank"
href="https://bugzilla.mozilla.org/show_bug.cgi?id=653601"
title="aria-selected ignored for ARIA tabs">
Mozilla Bug 653601
</a>
<p id="display"></p>
<div id="content" style="display: none"></div>
<pre id="test">
</pre>
<!-- tab -->
<div id="aria_tablist" role="tablist">
<div id="aria_tab1" role="tab" tabindex="0">unselected tab</div>
<div id="aria_tab2" role="tab" tabindex="0" aria-selected="true">selected tab</div>
<div id="aria_tab3" role="tab" tabindex="0" aria-selected="false">focused explicitly unselected tab</div>
</div>
<!-- test activeDescendant -->
<div id="aria_tablist2" role="tablist" tabindex="0">
<div id="aria_tab4" role="tab" aria-selected="false">focused explicitly unselected tab</div>
<div id="aria_tab5" role="tab">initially selected tab</div>
<div id="aria_tab6" role="tab">later selected tab</div>
</div>
</body>
</html>