test: add a failing test for #76

test/resizable.spec.ts

@@ -1402,8 +1402,6 @@ describe('resizable directive', () => {
 
   it('should set the resize cursor on the body when resizing', () => {
     const fixture: ComponentFixture<TestComponent> = createComponent();
-    fixture.componentInstance.enableGhostResize = false;
-    fixture.detectChanges();
     const elm: HTMLElement =
       fixture.componentInstance.resizable.elm.nativeElement;
     triggerDomEvent('mousedown', elm, {
@@ -1421,4 +1419,29 @@ describe('resizable directive', () => {
     });
     expect(document.body.style.cursor).to.equal('');
   });
+
+  it('should respect the css transform on the element', () => {
+    const fixture: ComponentFixture<TestComponent> = createComponent();
+    const elm: HTMLElement =
+      fixture.componentInstance.resizable.elm.nativeElement;
+    elm.style.transform = 'translate(10px, 20px)';
+    triggerDomEvent('mousedown', elm, {
+      clientX: 110,
+      clientY: 220
+    });
+    expect(fixture.componentInstance.resizeStart).to.have.been.calledWith({
+      edges: {
+        left: 0,
+        top: 0
+      },
+      rectangle: {
+        top: 200,
+        left: 100,
+        width: 300,
+        height: 150,
+        right: 400,
+        bottom: 350
+      }
+    });
+  });
 });