Datepicker Tests: Fix IE tests by accounting for async nature of focus/blur and by correctly not double focusing a programmatically focused date picker.

A partial fix was implemented to resolve #6694, and this commit completes the fix so we can programmatically focus a date picker without focus being fired twice.(cherry picked from commit 1c1b64fcf0)

tests/unit/datepicker/datepicker_options.js

@@ -100,15 +100,13 @@ asyncTest("invocation", function() {
 		ok( button.length === 0, "Focus - button absent" );
 		image = inp.siblings( "img" );
 		ok( image.length === 0, "Focus - image absent" );
-		inp[0].focus();
+
-		setTimeout(function() {
+		inp.one( "focus", function() {
 			ok( dp.is( ":visible" ), "Focus - rendered on focus" );
 			inp.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE } );
 			ok( !dp.is( ":visible" ), "Focus - hidden on exit" );
-			inp[0].blur();
+
-			setTimeout(function() {
+			TestHelpers.datepicker.onBlurThenFocus( inp, function() {
-				inp[0].focus();
-				setTimeout(function() {
 				ok( dp.is( ":visible" ), "Focus - rendered on focus" );
 				body.simulate( "mousedown", {} );
 				ok( !dp.is( ":visible" ), "Focus - hidden on external click" );
@@ -116,8 +114,7 @@ asyncTest("invocation", function() {
 
 				step2();
 			});
-			});
+		})[ 0 ].focus();
-		});
 	}
 
 	function step2() {
@@ -129,8 +126,8 @@ asyncTest("invocation", function() {
 		ok( button.length === 1, "Button - button present" );
 		ok( image.length === 0, "Button - image absent" );
 		equal( button.text(), "Popup", "Button - button text" );
-		inp[0].focus();
+
-		setTimeout(function() {
+		TestHelpers.datepicker.onBlurThenFocus( inp, function() {
 			ok( !dp.is( ":visible" ), "Button - not rendered on focus" );
 			button.click();
 			ok( dp.is( ":visible" ), "Button - rendered on button click" );
@@ -144,8 +141,12 @@ asyncTest("invocation", function() {
 
 	function step3() {
 		// On image button
-		inp = TestHelpers.datepicker.init("#inp", {showOn: "button", buttonImageOnly: true,
+		inp = TestHelpers.datepicker.init( "#inp", {
-			buttonImage: "images/calendar.gif", buttonText: "Cal"});
+			showOn: "button",
+			buttonImageOnly: true,
+			buttonImage: "images/calendar.gif",
+			buttonText: "Cal"
+		});
 		ok( !dp.is( ":visible" ), "Image button - initially hidden" );
 		button = inp.siblings( "button" );
 		ok( button.length === 0, "Image button - button absent" );
@@ -153,8 +154,8 @@ asyncTest("invocation", function() {
 		ok( image.length === 1, "Image button - image present" );
 		equal( image.attr( "src" ), "images/calendar.gif", "Image button - image source" );
 		equal( image.attr( "title" ), "Cal", "Image button - image text" );
-		inp[0].focus();
+
-		setTimeout(function() {
+		TestHelpers.datepicker.onBlurThenFocus( inp, function() {
 			ok( !dp.is( ":visible" ), "Image button - not rendered on focus" );
 			image.click();
 			ok( dp.is( ":visible" ), "Image button - rendered on image click" );
@@ -176,10 +177,8 @@ asyncTest("invocation", function() {
 		ok( image.length === 0, "Both - image absent" );
 		image = button.children( "img" );
 		ok( image.length === 1, "Both - button image present" );
-		inp[0].blur();
+
-		setTimeout(function() {
+		TestHelpers.datepicker.onBlurThenFocus( inp, function() {
-			inp[0].focus();
-			setTimeout(function() {
 			ok( dp.is( ":visible" ), "Both - rendered on focus" );
 			body.simulate( "mousedown", {} );
 			ok( !dp.is( ":visible" ), "Both - hidden on external click" );
@@ -191,7 +190,6 @@ asyncTest("invocation", function() {
 
 			start();
 		});
-		});
 	}
 
 	step1();

tests/unit/datepicker/datepicker_test_helpers.js

@@ -18,5 +18,12 @@ TestHelpers.datepicker = {
 		$.datepicker.setDefaults($.datepicker.regional[""]);
 		return $(id).datepicker($.extend({showAnim: ""}, options || {}));
 	},
+	onBlurThenFocus: function( element, callback ) {
+		element.one( "blur", function(){
+			element.one( "focus", function(){
+				callback();
+			})[ 0 ].focus();
+		})[ 0 ].blur();
+	},
 	PROP_NAME: "datepicker"
 };

ui/jquery.ui.datepicker.js

@@ -752,9 +752,10 @@ $.extend(Datepicker.prototype, {
 				inst.dpDiv[showAnim || "show"](showAnim ? duration : null);
 			}
 
-			if (inst.input.is(":visible") && !inst.input.is(":disabled")) {
+			if ( $.datepicker._shouldFocusInput( inst ) ) {
 				inst.input.focus();
 			}
+
 			$.datepicker._curInst = inst;
 		}
 	},
@@ -781,10 +782,7 @@ $.extend(Datepicker.prototype, {
 		inst.dpDiv[(this._get(inst, "isRTL") ? "add" : "remove") +
 			"Class"]("ui-datepicker-rtl");
 
-		// #6694 - don't focus the input if it's already focused
+		if (inst === $.datepicker._curInst && $.datepicker._datepickerShowing && $.datepicker._shouldFocusInput( inst ) ) {
-		// this breaks the change event in IE
-		if (inst === $.datepicker._curInst && $.datepicker._datepickerShowing && inst.input &&
-			inst.input.is(":visible") && !inst.input.is(":disabled") && inst.input[0] !== document.activeElement) {
 			inst.input.focus();
 		}
 
@@ -801,6 +799,13 @@ $.extend(Datepicker.prototype, {
 		}
 	},
 
+	// #6694 - don't focus the input if it's already focused
+	// this breaks the change event in IE
+	// Support: IE and jQuery <1.9
+	_shouldFocusInput: function( inst ) {
+		return inst.input && inst.input.is( ":visible" ) && !inst.input.is( ":disabled" ) && !inst.input.is( ":focus" );
+	},
+
 	/* Check positioning to remain on screen. */
 	_checkOffset: function(inst, offset, isFixed) {
 		var dpWidth = inst.dpDiv.outerWidth(),