From 96e5c241e1b26224c53738b590e07290db7a3e54 Mon Sep 17 00:00:00 2001 From: Corey Frang Date: Fri, 19 Aug 2011 06:03:59 -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 --- tests/unit/dialog/dialog_tickets.js | 31 ++++++++++++++++++++++++++++- ui/jquery.ui.dialog.js | 2 +- 2 files changed, 31 insertions(+), 2 deletions(-) diff --git a/tests/unit/dialog/dialog_tickets.js b/tests/unit/dialog/dialog_tickets.js index 1cfdcefea..e65f939e0 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 493ed07e6..e8107db7c 100644 --- a/ui/jquery.ui.dialog.js +++ b/ui/jquery.ui.dialog.js @@ -293,7 +293,7 @@ $.widget("ui.dialog", { // prevent tabbing out of modal dialogs if ( options.modal ) { - uiDialog.bind( "keypress.ui-dialog", function( event ) { + uiDialog.bind( "keyup.ui-dialog", function( event ) { if ( event.keyCode !== $.ui.keyCode.TAB ) { return; }