From 5191cdbe267cea32e3189d2900a2d84bb24effaa Mon Sep 17 00:00:00 2001
From: Alex Kim <45559664+alex-kim-dev@users.noreply.github.com>
Date: Tue, 5 Sep 2023 20:50:27 +0500
Subject: [PATCH] fix: stale labeled arrow bounds cache after editing the label
 (#6893)

* fix stale labeled arrow bounds cache after editing the label

* add arrow bounds test

* fix test to check the arrow version

* fix

* fix test - remove unused import

* Update src/element/textWysiwyg.test.tsx

---------

Co-authored-by: Aakansha Doshi <aakansha1216@gmail.com>
---
 src/element/textWysiwyg.test.tsx | 26 ++++++++++++++++++++++++++
 src/element/textWysiwyg.tsx      |  5 ++++-
 2 files changed, 30 insertions(+), 1 deletion(-)

diff --git a/src/element/textWysiwyg.test.tsx b/src/element/textWysiwyg.test.tsx
index a2301b96..c855de35 100644
--- a/src/element/textWysiwyg.test.tsx
+++ b/src/element/textWysiwyg.test.tsx
@@ -1509,4 +1509,30 @@ describe("textWysiwyg", () => {
       expect(text.text).toBe("Excalidraw");
     });
   });
+
+  it("should bump the version of labelled arrow when label updated", async () => {
+    await render(<ExcalidrawApp />);
+    const arrow = UI.createElement("arrow", {
+      width: 300,
+      height: 0,
+    });
+
+    mouse.select(arrow);
+    Keyboard.keyPress(KEYS.ENTER);
+    let editor = getTextEditor();
+    await new Promise((r) => setTimeout(r, 0));
+    updateTextEditor(editor, "Hello");
+    editor.blur();
+
+    const { version } = arrow;
+
+    mouse.select(arrow);
+    Keyboard.keyPress(KEYS.ENTER);
+    editor = getTextEditor();
+    await new Promise((r) => setTimeout(r, 0));
+    updateTextEditor(editor, "Hello\nworld!");
+    editor.blur();
+
+    expect(arrow.version).toEqual(version + 1);
+  });
 });
diff --git a/src/element/textWysiwyg.tsx b/src/element/textWysiwyg.tsx
index b60fdeed..d7fed698 100644
--- a/src/element/textWysiwyg.tsx
+++ b/src/element/textWysiwyg.tsx
@@ -20,7 +20,7 @@ import {
   ExcalidrawTextContainer,
 } from "./types";
 import { AppState } from "../types";
-import { mutateElement } from "./mutateElement";
+import { bumpVersion, mutateElement } from "./mutateElement";
 import {
   getBoundTextElementId,
   getContainerElement,
@@ -541,6 +541,9 @@ export const textWysiwyg = ({
               id: element.id,
             }),
           });
+        } else if (isArrowElement(container)) {
+          // updating an arrow label may change bounds, prevent stale cache:
+          bumpVersion(container);
         }
       } else {
         mutateElement(container, {