dijit
Version:
Dijit provides a complete collection of user interface controls based on Dojo, giving you the power to create web applications that are highly optimized for usability, performance, internationalization, accessibility, but above all deliver an incredible u
449 lines (373 loc) • 14.8 kB
HTML
<html>
<head>
<title>robot TooltipDialog A11y Test</title>
<style>
@import "../../../util/doh/robot/robot.css";
</style>
<!-- required: dojo.js -->
<script type="text/javascript" src="../../../dojo/dojo.js"
data-dojo-config="isDebug: true"></script>
<script type="text/javascript">
require([
"doh/runner", "dojo/robotx", "dojo/keys",
"dojo/domReady!"
], function(doh, robot, keys){
robot.initRobot('../test_TooltipDialog.html');
doh.register(function setup(){
// get pointer to registry in the iframe
registry = robot.window.require("dijit/registry");
dfocus = robot.window.require("dijit/focus");
});
doh.register("TooltipDialog normal operation", [
{
name: "aria roles and attributes",
timeout: 5000,
button: null,
runTest: function(){
var d = new doh.Deferred();
button = registry.byId("tooltipDlgButton");
doh.is("button", button._popupStateNode.getAttribute("role"), "button _popupStateNode role");
doh.t(button._popupStateNode.getAttribute("aria-haspopup"), "aria-haspopup on button");
doh.is("tooltipDlgButton_label", button._popupStateNode.getAttribute("aria-labelledby"), "aria-labelledby");
doh.f(button._popupStateNode.getAttribute("aria-expanded"), "initially missing aria-expanded");
doh.f(button._popupStateNode.getAttribute("aria-owns"), "initally missing aria-owns");
// now open the drop down
robot.sequence(function(){
button.focus();
}, 500, 500);
robot.keyPress(keys.SPACE, 500, {});
robot.sequence(d.getTestCallback(function(){
doh.t(button._popupStateNode.getAttribute("aria-expanded"), "now aria-expanded should be true");
doh.is("tooltipDlg", button._popupStateNode.getAttribute("aria-owns"), "should aria-own the Dlg");
// Check roles and attributes on the dialog
var dlg = registry.byId("tooltipDlg");
doh.is("alertdialog", dlg.domNode.getAttribute("role"), "Dlg.domNode should have a role");
doh.is("tooltipDlgButton", dlg.domNode.getAttribute("aria-labelledby"), "aria-labelledby should point back to button");
var dd = dlg.domNode;
doh.is("region", dd.parentNode.getAttribute("role"), "TooltipDialog's wrapper needs role=region since the node gets appended to the end");
doh.is("tooltipDlg", dd.parentNode.getAttribute("aria-label"), "TooltipDialog's wrapper needs aria-label since role=region");
}), 1000);
return d;
},
tearDown: function(){
button.closeDropDown();
}
},
{
name: "basic navigation",
timeout: 10000,
runTest: function(){
var d = new doh.Deferred();
var button = registry.byId("tooltipDlgButton");
// open TooltipDialog
robot.sequence(function(){
button.focus();
}, 1000, 1000);
robot.keyPress(keys.SPACE, 500, {});
robot.sequence(d.getTestErrback(function(){
doh.t(button._opened, "TooltipDialog should be showing");
}), 1000);
// shift-tab should loop around to last field
robot.keyPress(keys.TAB, 500, {shift: true});
robot.sequence(d.getTestErrback(function(){
doh.is("submit", dfocus.curNode.id, "focused on button");
}), 1000);
// tab should loop around to first field
robot.keyPress(keys.TAB, 500, {});
robot.sequence(d.getTestErrback(function(){
doh.is("inline", dfocus.curNode.id, "focused on InlineEditBox");
}), 1000);
// close TooltipDialog
robot.keyPress(keys.ESCAPE, 500, {});
robot.sequence(d.getTestCallback(function(){
doh.f(button._opened, "TooltipDialog should not be showing after Esc");
}), 1000);
return d;
}
},
{
name: "nested popup",
timeout: 10000,
runTest: function(){
var d = new doh.Deferred();
var button = registry.byId("tooltipDlgButton"),
select = registry.byId("combo");
// open TooltipDialog, advance to FilteringSelect
robot.sequence(function(){
button.focus();
}, 500);
robot.keyPress(keys.SPACE, 500, {});
robot.keyPress(keys.TAB, 500, {});
robot.keyPress(keys.TAB, 500, {});
robot.keyPress(keys.TAB, 500, {});
robot.keyPress(keys.TAB, 500, {});
robot.sequence(d.getTestErrback(function(){
doh.t(button._opened, "TooltipDialog should be showing");
doh.is("combo", dfocus.curNode.id, "focused on combo");
}), 1000);
// pick second option
robot.keyPress(keys.DOWN_ARROW, 0, {});
robot.keyPress(keys.DOWN_ARROW, 1000, {});
robot.keyPress(keys.DOWN_ARROW, 500, {});
robot.keyPress(keys.ENTER, 500, {});
robot.sequence(d.getTestErrback(function(){
doh.t(button._opened, "TooltipDialog should still be showing");
doh.is("pepperoni", select.get("value"), "selected pepperoni");
}), 1000);
// close TooltipDialog
robot.keyPress(keys.ESCAPE, 0, {});
robot.sequence(d.getTestCallback(function(){
doh.f(button._opened, "TooltipDialog closed");
}), 500);
return d;
}
}
]);
doh.register("interacton with autosave InlineEditBox", [
{
name: "InlineEditBox edit mode, change value, then Esc",
timeout: 10000,
runTest: function(){
var d = new doh.Deferred();
var button = registry.byId("tooltipDlgButton"),
inlineEditBox = registry.byId("inline"),
initialValue = inlineEditBox.get("value");
// open TooltipDialog
robot.sequence(function(){
button.focus();
}, 500);
robot.keyPress(keys.SPACE, 500, {});
robot.sequence(d.getTestErrback(function(){
doh.t(button._opened, "TooltipDialog should be showing");
doh.f(inlineEditBox.editing, "InlineEditBox not in edit mode yet");
}), 1000);
// edit InlineEditBox
robot.keyPress(keys.SPACE, 0, {});
robot.sequence(d.getTestErrback(function(){
doh.t(button._opened, "TooltipDialog should still be showing");
doh.t(inlineEditBox.editing, "InlineEditBox in edit mode");
}), 1000);
// type something
robot.typeKeys("esc", 0, 600);
// abort edit
robot.keyPress(keys.ESCAPE, 500, {});
robot.sequence(d.getTestErrback(function(){
doh.t(button._opened, "TooltipDialog should still still be showing");
doh.f(inlineEditBox.editing, "Esc should have exited InlineEditBox edit mode");
doh.is(initialValue, inlineEditBox.get("value"), "initial value was inline");
}), 1000);
// close TooltipDialog
robot.keyPress(keys.ESCAPE, 0, {});
robot.sequence(d.getTestCallback(function(){
doh.f(button._opened, "TooltipDialog closed");
}), 500);
return d;
}
},
{
name: "InlineEditBox edit mode, change value, then Tab",
timeout: 10000,
runTest: function(){
var d = new doh.Deferred();
var button = registry.byId("tooltipDlgButton"),
inlineEditBox = registry.byId("inline");
// open TooltipDialog
robot.sequence(function(){
button.focus();
}, 500);
robot.keyPress(keys.SPACE, 500, {});
robot.sequence(d.getTestErrback(function(){
doh.t(button._opened, "TooltipDialog should be showing");
doh.f(inlineEditBox.editing, "InlineEditBox not in edit mode yet");
}), 1000);
// edit InlineEditBox
robot.keyPress(keys.SPACE, 0, {});
robot.sequence(d.getTestErrback(function(){
doh.t(button._opened, "TooltipDialog should still be showing");
doh.t(inlineEditBox.editing, "InlineEditBox in edit mode");
}), 1000);
// type something
robot.typeKeys("tab", 0, 600);
// save edit
robot.keyPress(keys.TAB, 500, {});
robot.sequence(d.getTestErrback(function(){
doh.t(button._opened, "TooltipDialog should still still be showing");
doh.f(inlineEditBox.editing, "Tab should have exited InlineEditBox edit mode");
doh.is("tab", inlineEditBox.get("value"), "value changed to tab");
}), 1000);
// close TooltipDialog
robot.keyPress(keys.ESCAPE, 0, {});
robot.sequence(d.getTestCallback(function(){
doh.f(button._opened, "TooltipDialog closed");
}), 500);
return d;
}
},
{
name: "InlineEditBox edit mode, change value, then Enter",
timeout: 10000,
runTest: function(){
var d = new doh.Deferred();
var button = registry.byId("tooltipDlgButton"),
inlineEditBox = registry.byId("inline");
// open TooltipDialog
robot.sequence(function(){
button.focus();
}, 500);
robot.keyPress(keys.SPACE, 500, {});
robot.sequence(d.getTestErrback(function(){
doh.t(button._opened, "TooltipDialog should be showing");
doh.f(inlineEditBox.editing, "InlineEditBox not in edit mode yet");
}), 1000);
// edit InlineEditBox
robot.keyPress(keys.SPACE, 0, {});
robot.sequence(d.getTestErrback(function(){
doh.t(button._opened, "TooltipDialog should still be showing");
doh.t(inlineEditBox.editing, "InlineEditBox in edit mode");
}), 1000);
// type something
robot.typeKeys("enter", 0, 600);
// save edit
robot.keyPress(keys.ENTER, 500, {});
robot.sequence(d.getTestErrback(function(){
doh.t(button._opened, "TooltipDialog should still still be showing");
doh.f(inlineEditBox.editing, "Tab should have exited InlineEditBox edit mode");
doh.is("enter", inlineEditBox.get("value"), "value changed to enter");
}), 1000);
// close TooltipDialog
robot.keyPress(keys.ESCAPE, 0, {});
robot.sequence(d.getTestCallback(function(){
doh.f(button._opened, "TooltipDialog closed");
}), 500);
return d;
}
},
{
name: "InlineEditBox double edit (esc, enter)",
timeout: 10000,
runTest: function(){
var d = new doh.Deferred();
var button = registry.byId("tooltipDlgButton");
inlineEditBox = registry.byId("inline");
// open TooltipDialog
robot.sequence(function(){
button.focus();
}, 500);
robot.keyPress(keys.SPACE, 500, {});
robot.sequence(d.getTestErrback(function(){
doh.t(button._opened, "TooltipDialog should be showing");
}), 1000);
// start editing
robot.keyPress(keys.SPACE, 500, {});
// abort editing, then re-enter edit mode
robot.keyPress(keys.ESCAPE, 1000, {});
robot.keyPress(keys.ENTER, 1000, {});
robot.sequence(d.getTestCallback(function(){
doh.t(button._opened, "TooltipDialog should still be showing");
doh.t(inlineEditBox.editing, "Enter should have reentered edit mode");
inlineEditBox.cancel(true);
button.closeDropDown(true);
}), 2000);
return d;
}
},
{
name: "InlineEditBox double edit (enter, enter)",
timeout: 10000,
runTest: function(){
var d = new doh.Deferred();
var button = registry.byId("tooltipDlgButton"),
inlineEditBox = registry.byId("inline");
// open TooltipDialog
robot.sequence(function(){
button.focus();
}, 1000, 1000);
robot.keyPress(keys.SPACE, 500, {});
robot.sequence(d.getTestErrback(function(){
doh.t(button._opened, "TooltipDialog should be showing");
}), 1000);
// start editing
robot.keyPress(keys.SPACE, 500, {});
robot.typeKeys("enter #2", 1000, 1000);
// save via ENTER key, the press ENTER again to re-edit
robot.keyPress(keys.ENTER, 200, {});
robot.keyPress(keys.ENTER, 1000, {});
robot.sequence(d.getTestCallback(function(){
doh.t(button._opened, "TooltipDialog should still be showing");
doh.t(inlineEditBox.editing, "2nd Enter should have reentered edit mode");
inlineEditBox.cancel(true);
button.closeDropDown(true);
}), 2000);
return d;
}
},
{
name: "InlineEditBox focused after Tab/Shift+Tab",
timeout: 10000,
runTest: function(){
var d = new doh.Deferred();
var button = registry.byId("tooltipDlgButton"),
inlineEditBox = registry.byId("inline");
// open TooltipDialog
robot.sequence(function(){
button.focus();
}, 1000, 1000);
robot.keyPress(keys.SPACE, 500, {});
robot.sequence(d.getTestErrback(function(){
doh.t(button._opened, "TooltipDialog should be showing");
}), 1000);
// start editing
robot.keyPress(keys.SPACE, 500, {});
robot.typeKeys("tab", 1000, 600);
// tab forward, then back (first tab will cancel edit)
robot.keyPress(keys.TAB, 100, {});
robot.keyPress(keys.TAB, 1000, {shift:true});
// re-enter edit mode
robot.keyPress(keys.ENTER, 500, {});
robot.sequence(d.getTestCallback(function(){
doh.t(button._opened, "TooltipDialog should still be showing");
doh.t(inlineEditBox.editing, "Enter after shift+Tab should have reentered edit mode");
inlineEditBox.cancel(true);
button.closeDropDown(true);
}), 2000);
return d;
}
},
{
name: "href",
timeout: 10000,
runTest: function(){
var d = new doh.Deferred();
var button = registry.byId("slowLoadButton"),
dialog = registry.byId("slowLoad");
// Setup handler to continue test after dialog is opened and content loaded
dialog.onLoad = function(){
setTimeout(d.getTestErrback(function(){
doh.t(button._opened, "TooltipDialog should be showing");
doh.t(/Delayed by 0.5 sec/.test(dialog.domNode.innerHTML), "data was loaded");
// Close TooltipDialog
robot.keyPress(keys.ESCAPE, 500, {});
robot.sequence(d.getTestCallback(function(){
doh.f(button._opened, "TooltipDialog should not be showing after Esc");
}), 1000);
}), 0);
};
// Open TooltipDialog
robot.sequence(function(){
button.focus();
}, 0);
robot.keyPress(keys.SPACE, 500, {});
return d;
},
tearDown: function(){
registry.byId("slowLoad").onLoad = function(){};
}
}
]);
doh.run();
});
</script>
</head>
</html>