diff --git a/packages/excalidraw/data/restore.ts b/packages/excalidraw/data/restore.ts index cb6116a785..d685d5290a 100644 --- a/packages/excalidraw/data/restore.ts +++ b/packages/excalidraw/data/restore.ts @@ -509,17 +509,16 @@ export const restoreElement = ( name: element.name ?? null, }); case "frame": - const hasBackgroundEnabled = - typeof (element as any).backgroundEnabled === "boolean"; - const backgroundEnabled = hasBackgroundEnabled - ? (element as any).backgroundEnabled - : false; + const backgroundEnabled = + typeof (element as any).backgroundEnabled === "boolean" + ? (element as any).backgroundEnabled + : false; return restoreElementWithProperties(element, { name: element.name ?? null, backgroundEnabled, - ...(hasBackgroundEnabled - ? {} - : { backgroundColor: DEFAULT_ELEMENT_PROPS.backgroundColor }), + ...(!backgroundEnabled + ? { backgroundColor: DEFAULT_ELEMENT_PROPS.backgroundColor } + : {}), }); // Don't use default case so as to catch a missing an element type case. diff --git a/packages/excalidraw/tests/data/restore.test.ts b/packages/excalidraw/tests/data/restore.test.ts index 707080f8b7..268473dac2 100644 --- a/packages/excalidraw/tests/data/restore.test.ts +++ b/packages/excalidraw/tests/data/restore.test.ts @@ -118,6 +118,22 @@ describe("restoreElements", () => { expect(restoredFrame.backgroundEnabled).toBe(false); }); + it("should normalize frame background color when backgroundEnabled is false", () => { + const frame = API.createElement({ + type: "frame", + backgroundColor: "#ffc9c9", + }); + frame.backgroundEnabled = false; + + const restoredFrame = restore.restoreElements( + [frame], + null, + )[0] as ExcalidrawFrameElement; + + expect(restoredFrame.backgroundColor).toBe("transparent"); + expect(restoredFrame.backgroundEnabled).toBe(false); + }); + it("should preserve frame backgroundEnabled when present", () => { const frame = API.createElement({ type: "frame", @@ -130,6 +146,7 @@ describe("restoreElements", () => { null, )[0] as ExcalidrawFrameElement; + expect(restoredFrame.backgroundColor).toBe("#ffc9c9"); expect(restoredFrame.backgroundEnabled).toBe(true); });