diff --git a/src/element/textWysiwyg.test.tsx b/src/element/textWysiwyg.test.tsx index a2301b964..c855de357 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(); + 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 b60fdeed2..d7fed6981 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, {