smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: z-index change by one causes app to freeze (#8314)

Browse source
This commit is contained in:
Clarence Chan 2024-08-09 09:26:08 -04:00 • committed by GitHub
parent 261304c1a4
commit d5f4ee7b3f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 36 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

14
packages/excalidraw/tests/zindex.test.tsx
View file

@ -246,6 +246,20 @@ describe("z-index manipulation", () => {
], ],
}); });
// elements should not duplicate
assertZindex({
elements: [
{ id: "A", containerId: "C" },
{ id: "B" },
{ id: "C", isSelected: true },
],
operations: [
[actionSendBackward, ["A", "C", "B"]],
// noop
[actionSendBackward, ["A", "C", "B"]],
],
});
// grouped elements should be atomic // grouped elements should be atomic
// ------------------------------------------------------------------------- // -------------------------------------------------------------------------

28
packages/excalidraw/zindex.ts
View file

@ -80,29 +80,37 @@ const getTargetIndexAccountingForBinding = (
direction: "left" | "right", direction: "left" | "right",
) => { ) => {
if ("containerId" in nextElement && nextElement.containerId) { if ("containerId" in nextElement && nextElement.containerId) {
if (direction === "left") {
const containerElement = Scene.getScene(nextElement)!.getElement( const containerElement = Scene.getScene(nextElement)!.getElement(
nextElement.containerId, nextElement.containerId,
); );
if (containerElement) { if (containerElement) {
return elements.indexOf(containerElement); return direction === "left"
} ? Math.min(
} else { elements.indexOf(containerElement),
return elements.indexOf(nextElement); elements.indexOf(nextElement),
)
: Math.max(
elements.indexOf(containerElement),
elements.indexOf(nextElement),
);
} }
} else { } else {
const boundElementId = nextElement.boundElements?.find( const boundElementId = nextElement.boundElements?.find(
(binding) => binding.type !== "arrow", (binding) => binding.type !== "arrow",
)?.id; )?.id;
if (boundElementId) { if (boundElementId) {
if (direction === "left") {
return elements.indexOf(nextElement);
}
const boundTextElement = const boundTextElement =
Scene.getScene(nextElement)!.getElement(boundElementId); Scene.getScene(nextElement)!.getElement(boundElementId);
if (boundTextElement) { if (boundTextElement) {
return elements.indexOf(boundTextElement); return direction === "left"
? Math.min(
elements.indexOf(boundTextElement),
elements.indexOf(nextElement),
)
: Math.max(
elements.indexOf(boundTextElement),
elements.indexOf(nextElement),
);
} }
} }
} }