From 8f16cc304a97c7c3c2b5ab69678d666ec9ebd75a Mon Sep 17 00:00:00 2001 From: Corey Frang Date: Fri, 19 Aug 2011 06:07:47 -0500 Subject: [PATCH] Dialog: Tabbing out of a modal dialog was possible because keypress doesn't fire for tabs everywhere, switched to keyup. Added Unit Test - Caught by @DomenicDenicola - Fixes #3123 - Tabbing stops in modal dialog (cherry picked from commit 96e5c241e1b26224c53738b590e07290db7a3e54) --- tests/unit/dialog/dialog_tickets.js | 31 ++++++++++++++++++++++++++++- ui/jquery.ui.dialog.js | 6 +++--- 2 files changed, 33 insertions(+), 4 deletions(-) diff --git a/tests/unit/dialog/dialog_tickets.js b/tests/unit/dialog/dialog_tickets.js index def2452de..acfddab43 100644 --- a/tests/unit/dialog/dialog_tickets.js +++ b/tests/unit/dialog/dialog_tickets.js @@ -3,7 +3,36 @@ */ (function($) { -module("dialog: tickets"); +module( "dialog: tickets" ); + +asyncTest( "#3123: Prevent tabbing out of modal dialogs", function() { + expect( 3 ); + + var el = $( "
" ).dialog({ modal: true }), + inputs = el.find( "input" ), + widget = el.dialog( "widget" ); + + inputs.eq( 1 ).focus(); + equal( document.activeElement, inputs[1], "Focus set on second input" ); + inputs.eq( 1 ).simulate( "keyup", { keyCode: $.ui.keyCode.TAB }); + + setTimeout( checkTab, 2 ); + + function checkTab() { + ok( $.contains( widget, document.activeElement ), "Tab key event moved focus within the modal" ); + + // check shift tab + $( document.activeElement ).simulate( "keydown", { keyCode: $.ui.keyCode.TAB, shiftKey: true }); + setTimeout( checkShiftTab, 2 ); + } + + function checkShiftTab() { + ok( $.contains( widget, document.activeElement ), "Shift-Tab key event moved focus within the modal" ); + + el.remove(); + start(); + } +}); test("#4826: setting resizable false toggles resizable on dialog", function() { expect(6); diff --git a/ui/jquery.ui.dialog.js b/ui/jquery.ui.dialog.js index 32846d3fd..3d11cf948 100644 --- a/ui/jquery.ui.dialog.js +++ b/ui/jquery.ui.dialog.js @@ -329,9 +329,9 @@ $.widget("ui.dialog", { self.moveToTop(true); // prevent tabbing out of modal dialogs - if (options.modal) { - uiDialog.bind('keypress.ui-dialog', function(event) { - if (event.keyCode !== $.ui.keyCode.TAB) { + if ( options.modal ) { + uiDialog.bind( "keyup.ui-dialog", function( event ) { + if ( event.keyCode !== $.ui.keyCode.TAB ) { return; } -- 2.39.5