diff --git a/tests/unit/dialog/dialog_core.js b/tests/unit/dialog/dialog_core.js index f10087912..817f76ea9 100644 --- a/tests/unit/dialog/dialog_core.js +++ b/tests/unit/dialog/dialog_core.js @@ -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 = $( "
" ).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, ends up being the activeElement - // so wait for that stupid browser - stop(); - setTimeout(function() { - el = $( "
" ).dialog( options ); - equal( document.activeElement, el.find( "input" )[ 0 ], "2. tabbable element inside the content element" ); - el.remove(); + function step1() { + checkFocus( "
", options, function() { + equal( document.activeElement, el.find( "input" )[ 1 ], + "1. first element inside the dialog matching [autofocus]" ); + }, step2 ); + } - el = $( "
text
" ).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( "
", options, function() { + equal( document.activeElement, el.find( "input" )[ 0 ], + "2. tabbable element inside the content element" ); + }, step3 ); + } - el = $( "
text
" ).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( "
text
", options, function() { + equal( document.activeElement, + el.dialog( "widget" ).find( ".ui-dialog-buttonpane button" )[ 0 ], + "3. tabbable element inside the buttonpane" ); + }, step4 ); + } + function step4() { + checkFocus( "
text
", {}, function() { + equal( document.activeElement, + el.dialog( "widget" ).find( ".ui-dialog-titlebar .ui-dialog-titlebar-close" )[ 0 ], + "4. the close button" ); + }, step5 ); + } + + function step5() { el = $( "
text
" ).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 = $( "
" ).dialog({ modal: true }), + var el = $( "
" ).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);