Dialog: Move call to _focusTabbable and triggering of open and focus events into the _show callback. Fixes #6756 - Dialog: show: "blind" with link in content doesn't animate properly. Fixes #8051 - Dialog: 'Explode' dialog animation causes crash in IE 6, 7 and 8. Fixes #4421 - Dialog: Focus lost from dialog which uses show-effect

Author: kborchers

tests/unit/dialog/dialog.html

@@ -24,7 +24,9 @@
 			"ui/jquery.ui.resizable.js",
 			"ui/jquery.ui.button.js",
 			"ui/jquery.ui.effect.js",
+			"ui/jquery.ui.effect-blind.js",
 			"ui/jquery.ui.effect-clip.js",
+			"ui/jquery.ui.effect-explode.js",
 			"ui/jquery.ui.dialog.js"
 		]
 	});

tests/unit/dialog/dialog_options.js

@@ -531,4 +531,44 @@ test("#4826: setting resizable false toggles resizable on dialog", function() {
 
 });
 
+asyncTest( "#8051 - 'Explode' dialog animation causes crash in IE 6, 7 and 8", function() {
+	expect( 1 );
+	var el = $( "<div></div>" ).dialog({
+		show: "explode",
+		focus: function() {
+			ok( true, "dialog opened with animation" );
+			el.remove();
+			start();
+		}
+	});
+});
+
+asyncTest( "#4421 - Focus lost from dialog which uses show-effect", function() {
+	expect( 1 );
+	var el = $( "<div></div>" ).dialog({
+		show: "blind",
+		focus: function() {
+			equal( el.dialog( "widget" ).find( ":focus" ).length, 1, "dialog maintains focus" );
+			el.remove();
+			start();
+		}
+	});
+});
+
+asyncTest( "Open followed by close during show effect", function() {
+	expect( 1 );
+	var el = $( "<div></div>" ).dialog({
+		show: "blind",
+		close: function() {
+			ok( true, "dialog closed properly during animation" );
+			el.remove();
+			start();
+		}
+	});
+
+	setTimeout( function() {
+		el.dialog("close");
+	}, 100 );
+});
+
 })(jQuery);

ui/jquery.ui.dialog.js

@@ -207,6 +207,7 @@ $.widget( "ui.dialog", {
 	},
 
 	open: function() {
+		var that = this;
 		if ( this._isOpen ) {
 			if ( this._moveToTop() ) {
 				this._focusTabbable();
@@ -220,13 +221,13 @@ $.widget( "ui.dialog", {
 		this._position();
 		this._createOverlay();
 		this._moveToTop( null, true );
-		this._show( this.uiDialog, this.options.show );
-
-		this._focusTabbable();
+		this._show( this.uiDialog, this.options.show, function() {
+			that._focusTabbable();
+			that._trigger("focus");
+		});
 
 		this._isOpen = true;
 		this._trigger("open");
-		this._trigger("focus");
 	},
 
 	_focusTabbable: function() {