Remove resized element if it is invisibly small (excalidraw#405)

src/element/index.ts

@@ -12,3 +12,4 @@ export { resizeTest } from "./resizeTest";
 export { isTextElement } from "./typeChecks";
 export { textWysiwyg } from "./textWysiwyg";
 export { redrawTextBoundingBox } from "./textElement";
+export { isInvisiblySmallElement } from "./sizeChecks";

src/element/sizeChecks.ts

@@ -0,0 +1,5 @@
+import { ExcalidrawElement } from "./types";
+
+export function isInvisiblySmallElement(element: ExcalidrawElement): boolean {
+  return element.width === 0 && element.height === 0;
+}

src/index.tsx

@@ -8,6 +8,7 @@ import {
   newElement,
   duplicateElement,
   resizeTest,
+  isInvisiblySmallElement,
   isTextElement,
   textWysiwyg,
   getElementAbsoluteCoords
@@ -978,7 +979,11 @@ export class App extends React.Component<{}, AppState> {
             };
 
             const onMouseUp = (e: MouseEvent) => {
-              const { draggingElement, elementType } = this.state;
+              const {
+                draggingElement,
+                resizingElement,
+                elementType
+              } = this.state;
 
               lastMouseUp = null;
               window.removeEventListener("mousemove", onMouseMove);
@@ -987,8 +992,7 @@ export class App extends React.Component<{}, AppState> {
               if (
                 elementType !== "selection" &&
                 draggingElement &&
-                draggingElement.width === 0 &&
-                draggingElement.height === 0
+                isInvisiblySmallElement(draggingElement)
               ) {
                 // remove invisible element which was added in onMouseDown
                 elements = elements.slice(0, -1);
@@ -999,6 +1003,10 @@ export class App extends React.Component<{}, AppState> {
                 return;
               }
 
+              if (resizingElement && isInvisiblySmallElement(resizingElement)) {
+                elements = elements.filter(el => el.id !== resizingElement.id);
+              }
+
               resetCursor();
 
               // If click occured on already selected element