Draggable: Improve detection for when to blur the active element

Fixes #12472
Fixes #14905
Closes gh-1548

1 files changed, 21 insertions, 1 deletions

diff --git a/tests/unit/draggable/core.js b/tests/unit/draggable/core.js
index 61d8503ea..a36852ebb 100644
--- a/tests/unit/draggable/core.js
+++ b/tests/unit/draggable/core.js
@@ -291,7 +291,7 @@ test( "#8399: A draggable should become the active element after you are finishe
 	strictEqual( document.activeElement, element.get( 0 ), "finishing moving a draggable anchor made it the active element" );
 } );
 
-asyncTest( "blur behavior", function() {
+asyncTest( "blur behavior - handle is main element", function() {
 	expect( 3 );
 
 	var element = $( "#draggable1" ).draggable(),
@@ -315,6 +315,26 @@ asyncTest( "blur behavior", function() {
 	} );
 } );
 
+asyncTest( "blur behavior - descendant of handle", function() {
+	expect( 2 );
+
+	var element = $( "#draggable2" ).draggable( { handle: "span" } ),
+
+		// The handle is a descendant, but we also want to grab a descendant of the handle
+		handle = element.find( "span em" ),
+		focusElement = $( "<div tabindex='1'></div>" ).appendTo( element );
+
+	testHelper.onFocus( focusElement, function() {
+		strictEqual( document.activeElement, focusElement.get( 0 ), "test element is focused before mousing down on a draggable" );
+
+		testHelper.move( handle, 50, 50 );
+
+		// Elements outside of the handle should blur (#12472, #14905)
+		notStrictEqual( document.activeElement, focusElement.get( 0 ), "test element is no longer focused after mousing down on a draggable" );
+		start();
+	} );
+} );
+
 test( "ui-draggable-handle assigned to appropriate element", function( assert ) {
 	expect( 5 );