From 894d4c157a266e185e1fb4b45f35f65addbd8b3a Mon Sep 17 00:00:00 2001
From: Dave Stein <dave@behance.com>
Date: Mon, 18 Feb 2013 17:13:29 -0500
Subject: [PATCH] Draggable + Sortable: Fixed blockFrames. Added unit tests
 specifically for draggable since it should be moving up to "core" file
 shortly

---
 tests/unit/draggable/draggable_core.js | 81 ++++++++++++++++++++++++++
 ui/jquery.ui.draggable.js              | 10 ++--
 ui/jquery.ui.sortable.js               | 10 ++--
 3 files changed, 89 insertions(+), 12 deletions(-)

diff --git a/tests/unit/draggable/draggable_core.js b/tests/unit/draggable/draggable_core.js
index 0f0aa2e05..b50a72560 100644
--- a/tests/unit/draggable/draggable_core.js
+++ b/tests/unit/draggable/draggable_core.js
@@ -47,6 +47,87 @@ test("No options, absolute", function() {
 	TestHelpers.draggable.shouldMove(el);
 });
 
+test("_blockFrames, absolute parent", function() {
+	expect( 3 );
+	var el = $("#draggable1").draggable(),
+		parent = $("<div style='width: 600px; height: 600px; position: absolute; top: 300px; left; 400px;'>"),
+		iframe = $("<iframe src='about:blank' width='500' height='500' style='position: absolute; top: 25px; left: 30px;'>"),
+		left, top;
+
+	parent.append( iframe );
+
+	$("#qunit-fixture").prepend( parent );
+
+	el.on( "drag", function() {
+
+		var block = iframe.next();
+
+		left = block.css("left");
+		top = block.css("top");
+
+	});
+
+	TestHelpers.draggable.shouldMove(el);
+
+	equal( left, "30px" );
+	equal( top, "25px" );
+
+});
+
+test("_blockFrames, relative parent", function() {
+	expect( 3 );
+	var el = $("#draggable1").draggable(),
+		parent = $("<div style='width: 600px; height: 600px; position: relative; top: 300px; left; 400px;'>"),
+		iframe = $("<iframe src='about:blank' width='500' height='500' style='position: absolute; top: 25px; left: 30px;'>"),
+		left, top;
+
+	parent.append( iframe );
+
+	$("#qunit-fixture").prepend( parent );
+
+	el.on( "drag", function() {
+
+		var block = iframe.next();
+		
+		left = block.css("left");
+		top = block.css("top");
+
+	});
+
+	TestHelpers.draggable.shouldMove(el);
+	
+	equal( left, "30px" );
+	equal( top, "25px" );
+
+});
+
+test("_blockFrames, static parent", function() {
+	expect( 3 );
+	var el = $("#draggable1").draggable(),
+		parent = $("<div style='width: 600px; height: 600px; margin-top: 300px; margin-left: 400px;'>"),
+		iframe = $("<iframe src='about:blank' width='500' height='500' style='position: relative; top: 25px; left: 30px;'>"),
+		left, top;
+
+	parent.append( iframe );
+
+	$("#qunit-fixture").prepend( parent );
+
+	el.on( "drag", function() {
+
+		var block = iframe.next();
+		
+		left = block.css("left");
+		top = block.css("top");
+
+	});
+
+	TestHelpers.draggable.shouldMove(el);
+	
+	equal( left, "430px" );
+  equal( top, "325px" );
+
+});
+
 test("resizable handle with complex markup (#8756 / #8757)", function() {
 	expect( 2 );
 
diff --git a/ui/jquery.ui.draggable.js b/ui/jquery.ui.draggable.js
index ef8c7601d..38e141896 100644
--- a/ui/jquery.ui.draggable.js
+++ b/ui/jquery.ui.draggable.js
@@ -447,18 +447,16 @@ $.widget( "ui.draggable", $.ui.interaction, {
 	_blockFrames: function() {
 
 		this.iframeBlocks = this.document.find( "iframe" ).map(function() {
-			var iframe = $( this ),
-				iframeOffset = iframe.offset();
+			var iframe = $( this );
 
 			return $( "<div>" )
 				.css({
 					position: "absolute",
 					width: iframe.outerWidth(),
-					height: iframe.outerHeight(),
-					top: iframeOffset.top,
-					left: iframeOffset.left
+					height: iframe.outerHeight()
 				})
-				.appendTo( iframe.parent() )[0];
+				.appendTo( iframe.parent() )
+				.offset( iframe.offset() )[0];
 		});
 	},
 
diff --git a/ui/jquery.ui.sortable.js b/ui/jquery.ui.sortable.js
index 7682506d9..735dbf116 100644
--- a/ui/jquery.ui.sortable.js
+++ b/ui/jquery.ui.sortable.js
@@ -447,18 +447,16 @@ $.widget( "ui.sortable", $.ui.interaction, {
 	_blockFrames: function() {
 
 		this.iframeBlocks = this.document.find( "iframe" ).map(function() {
-			var iframe = $( this ),
-				iframeOffset = iframe.offset();
+			var iframe = $( this );
 
 			return $( "<div>" )
 				.css({
 					position: "absolute",
 					width: iframe.outerWidth(),
-					height: iframe.outerHeight(),
-					top: iframeOffset.top,
-					left: iframeOffset.left
+					height: iframe.outerHeight()
 				})
-				.appendTo( iframe.parent() )[0];
+				.appendTo( iframe.parent() )
+				.offset( iframe.offset() )[0];
 		});
 	},