library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2024-11-21 11:04:24 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Dialog tests: More async focus handling to deal with IE8.

Browse Source
This commit is contained in:
Scott González 2012-12-10 15:31:56 -05:00
parent d5f06c319a
commit 245a82d5aa
1 changed files with 54 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

83
tests/unit/dialog/dialog_core.js
View File

@ -39,7 +39,7 @@ test("widget method", function() {
dialog.remove();
});
test( "focus tabbable", function() {
asyncTest( "focus tabbable", function() {
expect( 5 );
var el,
options = {
@ -49,36 +49,59 @@ test( "focus tabbable", function() {
}]
};
el = $( "<div><input><input autofocus></div>" ).dialog( options );
equal( document.activeElement, el.find( "input" )[ 1 ], "1. first element inside the dialog matching [autofocus]" );
el.remove();
function checkFocus( markup, options, testFn, next ) {
el = $( markup ).dialog( options );
setTimeout(function() {
testFn();
el.remove();
setTimeout( next );
});
}
// IE8 fails to focus the input, <body> ends up being the activeElement
// so wait for that stupid browser
stop();
setTimeout(function() {
el = $( "<div><input><input></div>" ).dialog( options );
equal( document.activeElement, el.find( "input" )[ 0 ], "2. tabbable element inside the content element" );
el.remove();
function step1() {
checkFocus( "<div><input><input autofocus></div>", options, function() {
equal( document.activeElement, el.find( "input" )[ 1 ],
"1. first element inside the dialog matching [autofocus]" );
}, step2 );
}
el = $( "<div>text</div>" ).dialog( options );
equal( document.activeElement, el.dialog( "widget" ).find( ".ui-dialog-buttonpane button" )[ 0 ], "3. tabbable element inside the buttonpane" );
el.remove();
function step2() {
checkFocus( "<div><input><input></div>", options, function() {
equal( document.activeElement, el.find( "input" )[ 0 ],
"2. tabbable element inside the content element" );
}, step3 );
}
el = $( "<div>text</div>" ).dialog();
equal( document.activeElement, el.dialog( "widget" ).find( ".ui-dialog-titlebar .ui-dialog-titlebar-close" )[ 0 ], "4. the close button" );
el.remove();
function step3() {
checkFocus( "<div>text</div>", options, function() {
equal( document.activeElement,
el.dialog( "widget" ).find( ".ui-dialog-buttonpane button" )[ 0 ],
"3. tabbable element inside the buttonpane" );
}, step4 );
}
function step4() {
checkFocus( "<div>text</div>", {}, function() {
equal( document.activeElement,
el.dialog( "widget" ).find( ".ui-dialog-titlebar .ui-dialog-titlebar-close" )[ 0 ],
"4. the close button" );
}, step5 );
}
function step5() {
el = $( "<div>text</div>" ).dialog({
autoOpen: false
});
el.dialog( "widget" ).find( ".ui-dialog-titlebar-close" ).hide();
el.dialog( "open" );
equal( document.activeElement, el.parent()[ 0 ], "5. the dialog itself" );
el.remove();
setTimeout(function() {
equal( document.activeElement, el.parent()[ 0 ], "5. the dialog itself" );
el.remove();
start();
});
}
start();
}, 13);
step1();
});
test( "#7960: resizable handles below modal overlays", function() {
@ -93,10 +116,10 @@ test( "#7960: resizable handles below modal overlays", function() {
dialog.dialog( "destroy" );
});
asyncTest( "#3123: Prevent tabbing out of modal dialogs", function() {
asyncTest( "Prevent tabbing out of dialogs", function() {
expect( 3 );
var el = $( "<div><input id='t3123-first'><input id='t3123-last'></div>" ).dialog({ modal: true }),
var el = $( "<div><input><input></div>" ).dialog(),
inputs = el.find( "input" ),
widget = el.dialog( "widget" )[ 0 ];
@ -105,21 +128,23 @@ asyncTest( "#3123: Prevent tabbing out of modal dialogs", function() {
// check shift tab
$( document.activeElement ).simulate( "keydown", { keyCode: $.ui.keyCode.TAB, shiftKey: true });
setTimeout( checkShiftTab, 2 );
setTimeout( checkShiftTab );
}
function checkShiftTab() {
ok( $.contains( widget, document.activeElement ), "Shift-Tab key event moved focus within the modal" );
el.remove();
start();
setTimeout( start );
}
inputs.eq( 1 ).focus();
equal( document.activeElement, inputs[1], "Focus set on second input" );
inputs.eq( 1 ).simulate( "keydown", { keyCode: $.ui.keyCode.TAB });
inputs[1].focus();
setTimeout(function() {
equal( document.activeElement, inputs[1], "Focus set on second input" );
inputs.eq( 1 ).simulate( "keydown", { keyCode: $.ui.keyCode.TAB });
setTimeout( checkTab, 2 );
setTimeout( checkTab );
});
});
})(jQuery);