Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Fixes an issue where triggering a dialog close through the overlay wo…

…uld only close the first dialog. We do this by registering a click handler for each overlay and putting in place a guard so only the top overlay gets triggered. Unit tests updated for new scenario.
  • Loading branch information...
commit 690582b876c3ef7333ac02be9be26180a802c661 1 parent f6c0b71
Jay Merrifield authored
Showing with 71 additions and 17 deletions.
  1. +56 −6 tests/unit/dialog/dialog_tickets.js
  2. +15 −11 ui/jquery.ui.dialog.js
62 tests/unit/dialog/dialog_tickets.js
View
@@ -117,26 +117,76 @@ test("#6645: Missing element not found check in overlay", function(){
});
test("#6966: Escape key closes all dialogs, not the top one", function(){
- expect(8);
- // test with close function removing dialog
- d1 = $('<div title="dialog 1">Dialog 1</div>').dialog({modal: true});
+ expect(24);
+ // test with close function removing dialog triggered through the overlay
+ d1 = $('<div title="dialog 1">Dialog 1</div>').dialog({modal: true, close: function(){ d1.remove(); }});
+ d2 = $('<div title="dialog 2">Dialog 2</div>').dialog({modal: true, close: function(){ d2.remove(); }});
+
+ ok(d1.data('dialog') && d1.dialog('isOpen'), 'first dialog is open');
+ ok(d2.data('dialog') && d2.dialog('isOpen'), 'second dialog is open');
+
+ $( document ).simulate('keydown', {keyCode: $.ui.keyCode.ESCAPE});
+ ok(d1.data('dialog') && d1.dialog('isOpen'), 'first dialog still open');
+ ok(!d2.data('dialog'), 'second dialog is closed');
+
+ $( document ).simulate('keydown', {keyCode: $.ui.keyCode.ESCAPE});
+ ok(!d1.data('dialog'), 'first dialog is closed');
+ ok(!d2.data('dialog'), 'second dialog is closed');
+
+ d2.remove();
+ d1.remove();
+
+ // test with close function removing dialog triggered through the dialog
+ d1 = $('<div title="dialog 1">Dialog 1</div>').dialog({modal: true, close: function(){ d1.remove(); }});
d2 = $('<div title="dialog 2">Dialog 2</div>').dialog({modal: true, close: function(){ d2.remove(); }});
+
+ ok(d1.data('dialog') && d1.dialog('isOpen'), 'first dialog is open');
+ ok(d2.data('dialog') && d2.dialog('isOpen'), 'second dialog is open');
+
+ d2.simulate('keydown', {keyCode: $.ui.keyCode.ESCAPE});
+ ok(d1.data('dialog') && d1.dialog('isOpen'), 'first dialog still open');
+ ok(!d2.data('dialog'), 'second dialog is closed');
+
+ d1.simulate('keydown', {keyCode: $.ui.keyCode.ESCAPE});
+ ok(!d1.data('dialog'), 'first dialog is closed');
+ ok(!d2.data('dialog'), 'second dialog is closed');
+
+ d2.remove();
+ d1.remove();
+
+ // test without close function removing dialog
+ d1 = $('<div title="dialog 1">Dialog 1</div>').dialog({modal: true});
+ d2 = $('<div title="dialog 2">Dialog 2</div>').dialog({modal: true});
+
ok(d1.dialog("isOpen"), 'first dialog is open');
ok(d2.dialog("isOpen"), 'second dialog is open');
+
d2.simulate("keydown", {keyCode: $.ui.keyCode.ESCAPE});
ok(d1.dialog("isOpen"), 'first dialog still open');
- ok(!d2.data('dialog'), 'second dialog is closed');
+ ok(!d2.dialog("isOpen"), 'second dialog is closed');
+
+ d1.simulate("keydown", {keyCode: $.ui.keyCode.ESCAPE});
+ ok(!d1.dialog("isOpen"), 'first dialog is closed');
+ ok(!d2.dialog("isOpen"), 'second dialog is closed');
+
d2.remove();
d1.remove();
- // test without close function removing dialog
+ // test without close function removing dialog triggered through the overlay
d1 = $('<div title="dialog 1">Dialog 1</div>').dialog({modal: true});
d2 = $('<div title="dialog 2">Dialog 2</div>').dialog({modal: true});
+
ok(d1.dialog("isOpen"), 'first dialog is open');
ok(d2.dialog("isOpen"), 'second dialog is open');
- d2.simulate("keydown", {keyCode: $.ui.keyCode.ESCAPE});
+
+ $( document ).simulate("keydown", {keyCode: $.ui.keyCode.ESCAPE});
ok(d1.dialog("isOpen"), 'first dialog still open');
ok(!d2.dialog("isOpen"), 'second dialog is closed');
+
+ $( document ).simulate("keydown", {keyCode: $.ui.keyCode.ESCAPE});
+ ok(!d1.dialog("isOpen"), 'first dialog is closed');
+ ok(!d2.dialog("isOpen"), 'second dialog is closed');
+
d2.remove();
d1.remove();
});
26 ui/jquery.ui.dialog.js
View
@@ -713,21 +713,25 @@ $.extend( $.ui.dialog.overlay, {
}
}, 1 );
- // allow closing by pressing the escape key
- $( document ).bind( "keydown.dialog-overlay", function( event ) {
- if ( dialog.options.closeOnEscape && !event.isDefaultPrevented() && event.keyCode &&
- event.keyCode === $.ui.keyCode.ESCAPE ) {
-
- dialog.close( event );
- event.preventDefault();
- }
- });
-
// handle window resize
$( window ).bind( "resize.dialog-overlay", $.ui.dialog.overlay.resize );
}
-
+
var $el = ( this.oldInstances.pop() || $( "<div>" ).addClass( "ui-widget-overlay" ) );
+
+ // allow closing by pressing the escape key
+ $( document ).bind( "keydown.dialog-overlay", function( event ) {
+ var instances = $.ui.dialog.overlay.instances;
+ // only react to the event if we're the top overlay
+ if ( instances.length !== 0 && instances[ instances.length - 1 ] === $el &&
+ dialog.options.closeOnEscape && !event.isDefaultPrevented() && event.keyCode &&
+ event.keyCode === $.ui.keyCode.ESCAPE ) {
+
+ dialog.close( event );
+ event.preventDefault();
+ }
+ });
+
$el.appendTo( document.body ).css({
width: this.width(),
height: this.height()
Please sign in to comment.
Something went wrong with that request. Please try again.