<
html>
<
head>
<
title>
HTML selects accessible states tests</
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 src=
"chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></
script>
<
script type=
"application/javascript"
src=
"../common.js"></
script>
<
script type=
"application/javascript"
src=
"../role.js"></
script>
<
script type=
"application/javascript"
src=
"../states.js"></
script>
<
script type=
"application/javascript"
src=
"../events.js"></
script>
<
script type=
"application/javascript">
// gA11yEventDumpToConsole = true;
function doTest() {
// combobox
var combobox = getAccessible(
"combobox");
testStates(combobox,
STATE_HASPOPUP | STATE_COLLAPSED | STATE_FOCUSABLE, 0,
STATE_FOCUSED, 0);
var comboboxList = combobox.firstChild;
testStates(comboboxList, STATE_INVISIBLE, 0, STATE_FOCUSABLE, 0);
var opt1 = comboboxList.firstChild;
testStates(opt1, STATE_SELECTABLE | STATE_SELECTED | STATE_FOCUSABLE,
0, STATE_FOCUSED, 0);
var opt2 = comboboxList.lastChild;
testStates(opt2, STATE_SELECTABLE | STATE_FOCUSABLE, 0, STATE_SELECTED, 0,
STATE_FOCUSED, 0);
// collapsed combobox
testStates(
"collapsedcombobox",
STATE_COLLAPSED | STATE_FOCUSABLE, 0,
STATE_FOCUSED, 0);
testStates(
"collapsed-1",
STATE_FOCUSABLE | STATE_SELECTABLE, 0,
STATE_OFFSCREEN | STATE_INVISIBLE, 0);
testStates(
"collapsed-2",
STATE_OFFSCREEN, 0,
STATE_INVISIBLE, 0);
// listbox
testStates(
"listbox",
STATE_FOCUSABLE, 0,
STATE_HASPOPUP | STATE_COLLAPSED | STATE_FOCUSED);
testStates(
"listitem-active",
STATE_FOCUSABLE | STATE_SELECTABLE, EXT_STATE_ACTIVE,
STATE_SELECTED | STATE_FOCUSED);
testStates(
"listitem",
STATE_FOCUSABLE | STATE_SELECTABLE, 0,
STATE_SELECTED | STATE_FOCUSED, EXT_STATE_ACTIVE);
testStates(
"listitem-disabled",
STATE_UNAVAILABLE, 0,
STATE_SELECTABLE | STATE_SELECTED | STATE_FOCUSABLE,
EXT_STATE_ACTIVE);
testStates(
"listgroup",
0, 0,
STATE_UNAVAILABLE | STATE_SELECTABLE | STATE_SELECTED | STATE_FOCUSABLE,
EXT_STATE_ACTIVE);
testStates(
"listgroup-disabled",
STATE_UNAVAILABLE, 0,
STATE_SELECTABLE | STATE_SELECTED | STATE_FOCUSABLE,
EXT_STATE_ACTIVE);
todo(false,
"no unavailable state on option in disabled group (bug 759666)");
// testStates(
"listitem-disabledgroup",
// STATE_UNAVAILABLE, 0,
// STATE_SELECTABLE | STATE_SELECTED | STATE_FOCUSABLE,
// EXT_STATE_ACTIVE);
testStates(
"listbox-disabled",
STATE_UNAVAILABLE, 0,
STATE_FOCUSABLE);
todo(false,
"no unavailable state on option in disabled select (bug 759666)");
// testStates(
"listitem-disabledlistbox",
// STATE_UNAVAILABLE, 0,
// STATE_SELECTABLE | STATE_SELECTED | STATE_FOCUSABLE,
// EXT_STATE_ACTIVE);
SimpleTest.finish();
}
SimpleTest.waitForExplicitFinish();
addA11yLoadEvent(doTest);
</
script>
</
head>
<
body>
<a target=
"_blank"
href=
"https://bugzilla.mozilla.org/show_bug.cgi?id=443889"
title=
"mochitest for selects and lists">
Mozilla Bug 443889
</a>
<a target=
"_blank"
href=
"https://bugzilla.mozilla.org/show_bug.cgi?id=640716"
title=
"mochitest for selects and lists">
Mozilla Bug 640716
</a>
<a target=
"_blank"
href=
"https://bugzilla.mozilla.org/show_bug.cgi?id=689847"
title=
"Expose active state on current item of selectable widgets">
Mozilla Bug 689847
</a>
<a target=
"_blank"
href=
"https://bugzilla.mozilla.org/show_bug.cgi?id=756983"
title=
"Isolate focusable and unavailable states from State()">
Mozilla Bug 756983
</a>
<a target=
"_blank"
href=
"https://bugzilla.mozilla.org/show_bug.cgi?id=907682"
title=
" HTML:option group position is not correct when select is collapsed">
Mozilla Bug 907682
</a>
<p id=
"display"></p>
<
div id=
"content" style=
"display: none"></
div>
<
pre id=
"test">
</
pre>
<
select id=
"combobox">
<
option>item 1</
option>
<
option>item 2</
option>
</
select>
<
select id=
"collapsedcombobox">
<
option id=
"collapsed-1">item 1</
option>
<
option id=
"collapsed-2">item 2</
option>
</
select>
<
select id=
"listbox" name=
"component" size=
"3">
<
option id=
"listitem-active">Build</
option>
<
option id=
"listitem">Disability Access APIs</
option>
<
option id=
"listitem-disabled" disabled>General</
option>
<
optgroup id=
"listgroup" label=
"group">
<
option>
option</
option>
</
optgroup>
<
optgroup id=
"listgroup-disabled" disabled
label=
"group2">
<
option id=
"listitem-disabledgroup">UI</
option>
</
optgroup>
</
select>
<
select id=
"listbox-disabled" size=
"3" disabled>
<
option id=
"listitem-disabledlistbox">
option</
option>
</
select>
</
body>
</
html>