Droppable: Changed drop event to loop over a copied array instead of the droppables...

diff --git a/tests/unit/droppable/droppable.html b/tests/unit/droppable/droppable.html
index 7cd5eb0f5405f84c800435c9cee2574bb9848cd4..d084464c2c694a37f320611d970356d3713a5540 100644 (file)
--- a/tests/unit/droppable/droppable.html
+++ b/tests/unit/droppable/droppable.html
@@ -42,6 +42,7 @@
 
 <div id="draggable1" style="width: 25px; height: 25px;">Draggable</div>
 <div id="droppable1" style="width: 100px; height: 100px;">Droppable</div>
+<div id="droppable2" style="width: 100px; height: 100px;">Droppable</div>
 <div style='width:1000px;height:1000px;'>&nbsp;</div>
 
 </div>

diff --git a/tests/unit/droppable/droppable_events.js b/tests/unit/droppable/droppable_events.js
index 8f842e9425f8c705e7c322008f59d182a627c833..707eea1f4a2b733f51c2e9d508cc9191241542bd 100644 (file)
--- a/tests/unit/droppable/droppable_events.js
+++ b/tests/unit/droppable/droppable_events.js
@@ -5,6 +5,39 @@
 
 module("droppable: events");
 
+test( "droppable destruction/recreation on drop event", function() {
+       expect( 1 );
+
+       var config = {
+                       activeClass: "active",
+                       drop: function() {
+                               var element = $( this ),
+                                       newDroppable = $( "<div>" )
+                                               .css({ width: 100, height: 100 })
+                                               .text( "Droppable" );
+                               element.after( newDroppable );
+                               element.remove();
+                               newDroppable.droppable( config );
+                       }
+               },
+
+               draggable = $( "#draggable1" ).draggable(),
+               droppable1 = $( "#droppable1" ).droppable( config ),
+               droppable2 = $( "#droppable2" ).droppable( config ),
+
+               droppableOffset = droppable1.offset(),
+               draggableOffset = draggable.offset(),
+               dx = droppableOffset.left - draggableOffset.left,
+               dy = droppableOffset.top - draggableOffset.top;
+
+       draggable.simulate( "drag", {
+               dx: dx,
+               dy: dy
+       });
+
+       ok( !droppable2.hasClass( "active" ), "subsequent droppable no longer active" );
+});
+
 // this is here to make JSHint pass "unused", and we don't want to
 // remove the parameter for when we finally implement
 $.noop();

diff --git a/ui/jquery.ui.droppable.js b/ui/jquery.ui.droppable.js
index 4fbfcde06cf807c79cd1cb9b871779672344c443..552b24a5850eb31e1cff2a542f34751a9448c122 100644 (file)
--- a/ui/jquery.ui.droppable.js
+++ b/ui/jquery.ui.droppable.js
@@ -278,7 +278,8 @@ $.ui.ddmanager = {
        drop: function(draggable, event) {
 
                var dropped = false;
-               $.each($.ui.ddmanager.droppables[draggable.options.scope] || [], function() {
+               // Create a copy of the droppables in case the list changes during the drop (#9116)
+               $.each(($.ui.ddmanager.droppables[draggable.options.scope] || []).slice(), function() {
 
                        if(!this.options) {
                                return;