fix(onResizeEnd): call with co-ordinates of last valid resize rather …

…than where the mouse up event w

src/resizable.directive.ts

@@ -215,15 +215,15 @@ export class Resizable implements OnInit {
       }
     });
 
-    this.mouseup.subscribe(({mouseX, mouseY}) => {
+    this.mouseup.subscribe(() => {
       if (currentResize) {
         this.onResizeEnd.emit({
           edges: currentResize.edges,
           rectangle: getNewBoundingRectangle(
-            currentResize.startingRect,
-            currentResize.edges,
-            mouseX - currentResize.startCoords.mouseX,
-            mouseY - currentResize.startCoords.mouseY
+            this.elm.nativeElement.getBoundingClientRect(),
+            {},
+            0,
+            0
           )
         });
         resetElementStyles();

test/resizable.spec.ts

@@ -648,4 +648,35 @@ describe('resizable directive', () => {
     });
   }));
 
+  it('should fire the resize end event with the last valid bounding rectangle', async(() => {
+    componentPromise.then((fixture: ComponentFixture<TestCmp>) => {
+      const elm: HTMLElement = fixture.componentInstance.resizable.elm.nativeElement;
+      triggerDomEvent('mousedown', elm, {
+        clientX: 100,
+        clientY: 210
+      });
+      triggerDomEvent('mousemove', elm, {
+        clientX: 99,
+        clientY: 210
+      });
+      triggerDomEvent('mouseup', elm, {
+        clientX: 500,
+        clientY: 210
+      });
+      expect(fixture.componentInstance.onResizeEnd).toHaveBeenCalledWith({
+        edges: {
+          left: true
+        },
+        rectangle: {
+          top: 200,
+          left: 99,
+          width: 301,
+          height: 150,
+          right: 400,
+          bottom: 350
+        }
+      });
+    });
+  }));
+
 });