Fixed "calling remove() for dragging shape will throw an error". close #184

CHANGELOG.md

@@ -15,6 +15,7 @@ This project adheres to [Semantic Versioning](http://semver.org/).
 
 ### Fixed
 - Fixed bug when `Konva.Tag` width was not changing its width dynamically
+- Fixed "calling remove() for dragging shape will throw an error"
 
 ## [1.2.2][2016-09-15]
 

konva.js

@@ -3,7 +3,7 @@
  * Konva JavaScript Framework v1.2.2
  * http://konvajs.github.io/
  * Licensed under the MIT or GPL Version 2 licenses.
- * Date: Mon Oct 31 2016
+ * Date: Thu Nov 10 2016
  *
  * Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS)
  * Modified work Copyright (C) 2014 - 2015 by Anton Lavrenov (Konva)
@@ -3449,7 +3449,9 @@
         moveTo: function(newContainer) {
             // do nothing if new container is already parent
             if (this.getParent() !== newContainer) {
-                this.remove();
+                // this.remove my be overrided by drag and drop
+                // buy we need original
+                (this.__originalRemove || this.remove).call(this);
                 newContainer.add(this);
             }
             return this;
@@ -11345,9 +11347,10 @@
         this._dragChange();
     };
 
-    var origDestroy = Konva.Node.prototype.destroy;
+    var origRemove = Konva.Node.prototype.remove;
 
-    Konva.Node.prototype.destroy = function() {
+    Konva.Node.prototype.__originalRemove = origRemove;
+    Konva.Node.prototype.remove = function() {
         var dd = Konva.DD;
 
         // stop DD
@@ -11356,7 +11359,7 @@
             this.stopDrag();
         }
 
-        origDestroy.call(this);
+        origRemove.call(this);
     };
 
     /**

src/DragAndDrop.js

@@ -168,9 +168,10 @@
         this._dragChange();
     };
 
-    var origDestroy = Konva.Node.prototype.destroy;
+    var origRemove = Konva.Node.prototype.remove;
 
-    Konva.Node.prototype.destroy = function() {
+    Konva.Node.prototype.__originalRemove = origRemove;
+    Konva.Node.prototype.remove = function() {
         var dd = Konva.DD;
 
         // stop DD
@@ -179,7 +180,7 @@
             this.stopDrag();
         }
 
-        origDestroy.call(this);
+        origRemove.call(this);
     };
 
     /**

src/Node.js

@@ -1156,7 +1156,9 @@
         moveTo: function(newContainer) {
             // do nothing if new container is already parent
             if (this.getParent() !== newContainer) {
-                this.remove();
+                // this.remove my be overrided by drag and drop
+                // buy we need original
+                (this.__originalRemove || this.remove).call(this);
                 newContainer.add(this);
             }
             return this;

test/unit/DragAndDrop-test.js

@@ -369,4 +369,79 @@ suite('DragAndDrop', function() {
         }, 50);
 
     });
+
+    test('removing shape while drag and drop should no throw error', function() {
+         var stage = addStage();
+        var layer = new Konva.Layer();
+
+        var circle = new Konva.Circle({
+            x: stage.getWidth() / 2,
+            y: stage.getHeight() / 2,
+            radius: 70,
+            fill: 'green',
+            stroke: 'black',
+            strokeWidth: 4,
+            name: 'myCircle',
+            draggable: true
+        });
+
+        layer.add(circle);
+        stage.add(layer);
+
+        stage.simulateMouseDown({
+            x: 291,
+            y: 112
+        });
+
+        circle.remove();
+
+        stage.simulateMouseMove({
+            x: 311,
+            y: 112
+        });
+
+
+        stage.simulateMouseUp({
+            x: 291,
+            y: 112,
+            button: 2
+        });
+    });
+
+    test('destroying shape while drag and drop should no throw error', function() {
+         var stage = addStage();
+        var layer = new Konva.Layer();
+
+        var circle = new Konva.Circle({
+            x: stage.getWidth() / 2,
+            y: stage.getHeight() / 2,
+            radius: 70,
+            fill: 'green',
+            stroke: 'black',
+            strokeWidth: 4,
+            name: 'myCircle',
+            draggable: true
+        });
+
+        layer.add(circle);
+        stage.add(layer);
+
+        stage.simulateMouseDown({
+            x: 291,
+            y: 112
+        });
+
+        circle.destroy();
+
+        stage.simulateMouseMove({
+            x: 311,
+            y: 112
+        });
+
+
+        stage.simulateMouseUp({
+            x: 291,
+            y: 112,
+        });
+    });
 });