diff options
| author | Scott González <scott.gonzalez@gmail.com> | 2012-12-10 15:31:56 -0500 |
|---|---|---|
| committer | Scott González <scott.gonzalez@gmail.com> | 2012-12-10 15:31:56 -0500 |
| commit | 245a82d5aad6e2b721bfb24c9e118f2d92b8696a (patch) | |
| tree | 1df683a116d11c2c3f9e70f84518c4a8fd76b5d6 | |
| parent | d5f06c319a0508bfa342717cb7b50b97acddfb15 (diff) | |
| download | jquery-ui-245a82d5aad6e2b721bfb24c9e118f2d92b8696a.tar.gz jquery-ui-245a82d5aad6e2b721bfb24c9e118f2d92b8696a.zip | |
Dialog tests: More async focus handling to deal with IE8.
| -rw-r--r-- | tests/unit/dialog/dialog_core.js | 83 |
1 files changed, 54 insertions, 29 deletions
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 = $( "<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); |