From e263ebda99f3d414bae91a4a47e74a37ff93ba9c Mon Sep 17 00:00:00 2001 From: =?utf8?q?Jo=CC=88rn=20Zaefferer?= Date: Fri, 27 Sep 2013 18:53:15 +0200 Subject: [PATCH] Dialog: Switch back to shuffling z-index, but only look at .ui-front siblings. Fixes #9166 - Dialog: moveToTop implementation resets flash/video/iframe/scroll Fixes #9364 - Dialog: Click of element with tooltip scrolls the dialog to the top --- tests/unit/dialog/dialog_methods.js | 21 ++++++++-- tests/visual/dialog/stacking.html | 62 +++++++++++++++++++++++++++++ tests/visual/index.html | 4 ++ ui/jquery.ui.dialog.js | 12 +++++- 4 files changed, 94 insertions(+), 5 deletions(-) create mode 100644 tests/visual/dialog/stacking.html diff --git a/tests/unit/dialog/dialog_methods.js b/tests/unit/dialog/dialog_methods.js index 60a7aa4d8..8918e8d36 100644 --- a/tests/unit/dialog/dialog_methods.js +++ b/tests/unit/dialog/dialog_methods.js @@ -144,8 +144,8 @@ test("moveToTop", function() { expect( 5 ); function order() { var actual = $( ".ui-dialog" ).map(function() { - return +$( this ).find( ".ui-dialog-content" ).attr( "id" ).replace( /\D+/, "" ); - }).get().reverse(); + return +$( this ).css( "z-index" ); + }).get(); deepEqual( actual, $.makeArray( arguments ) ); } var dialog1, dialog2, @@ -161,10 +161,23 @@ test("moveToTop", function() { equal( focusOn, "dialog2" ); } }); - order( 2, 1 ); + order( 100, 101 ); focusOn = "dialog1"; dialog1.dialog( "moveToTop" ); - order( 1, 2 ); + order( 102, 101 ); +}); + +test( "moveToTop: content scroll stays intact", function() { + expect( 2 ); + var otherDialog = $( "#dialog1" ).dialog(), + scrollDialog = $( "#form-dialog" ).dialog({ + height: 200 + }); + scrollDialog.scrollTop( 50 ); + equal( scrollDialog.scrollTop(), 50 ); + + otherDialog.dialog( "moveToTop" ); + equal( scrollDialog.scrollTop(), 50 ); }); test("open", function() { diff --git a/tests/visual/dialog/stacking.html b/tests/visual/dialog/stacking.html new file mode 100644 index 000000000..dcb7de280 --- /dev/null +++ b/tests/visual/dialog/stacking.html @@ -0,0 +1,62 @@ + + + + + Dialog Visual Test + + + + + + + + + + + + + + + + +

WHAT: Two dialogs, one embedding an iframe, one having just scrollable content.

+

EXPECTED: When focusing on one or the other dialog, it shouldn't affect how the content is displayed on the other dialog. It shouldn't reload the iframe or reset the scroll.

+ + +
+ +
+ +
+

a bunch of content

+
+ +
Just another dialog to test stacking
+ + + diff --git a/tests/visual/index.html b/tests/visual/index.html index 730eb4553..bb46137f4 100644 --- a/tests/visual/index.html +++ b/tests/visual/index.html @@ -33,7 +33,11 @@

Dialog

Effects

diff --git a/ui/jquery.ui.dialog.js b/ui/jquery.ui.dialog.js index f7265e605..0669cd852 100644 --- a/ui/jquery.ui.dialog.js +++ b/ui/jquery.ui.dialog.js @@ -212,7 +212,17 @@ $.widget( "ui.dialog", { }, _moveToTop: function( event, silent ) { - var moved = !!this.uiDialog.nextAll(":visible").insertBefore( this.uiDialog ).length; + var moved = false, + zIndicies = this.uiDialog.siblings( ".ui-front:visible" ).map(function() { + return +$( this ).css( "z-index" ); + }).get(), + zIndexMax = Math.max.apply( null, zIndicies ); + + if ( zIndexMax >= +this.uiDialog.css( "z-index" ) ) { + this.uiDialog.css( "z-index", zIndexMax + 1 ); + moved = true; + } + if ( moved && !silent ) { this._trigger( "focus", event ); } -- 2.39.5