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: Undo for elbow arrows create incorrect routing (#9046)

Browse source
This commit is contained in:
Márk Tolmács 2025-01-24 20:18:08 +01:00 • committed by GitHub
parent 8f20b29b73
commit 49f1276ef2
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 125 additions and 126 deletions
Download patch file Download diff file Expand all files Collapse all files

14
packages/excalidraw/element/elbowArrow.ts
View file

@ -909,6 +909,20 @@ export const updateElbowArrowPoints = (
); );
} }
// 0. During all element replacement in the scene, we just need to renormalize
// the arrow
// TODO (dwelle,mtolmacs): Remove this once Scene.getScene() is removed
if (elementsMap.size === 0 && updates.points) {
return normalizeArrowElementUpdate(
updates.points.map((p) =>
pointFrom<GlobalPoint>(arrow.x + p[0], arrow.y + p[1]),
),
arrow.fixedSegments,
arrow.startIsSpecial,
arrow.endIsSpecial,
);
}
const updatedPoints: readonly LocalPoint[] = updates.points const updatedPoints: readonly LocalPoint[] = updates.points
? updates.points && updates.points.length === 2 ? updates.points && updates.points.length === 2
? arrow.points.map((p, idx) => ? arrow.points.map((p, idx) =>

228
packages/excalidraw/tests/__snapshots__/history.test.tsx.snap
View file

@ -10896,12 +10896,7 @@ exports[`history > multiplayer undo/redo > should redraw arrows on undo > [end o
{ {
"angle": 0, "angle": 0,
"backgroundColor": "transparent", "backgroundColor": "transparent",
"boundElements": [ "boundElements": [],
{
"id": "6Rm4g567UQM4WjLwej2Vc",
"type": "arrow",
},
],
"customData": undefined, "customData": undefined,
"fillStyle": "solid", "fillStyle": "solid",
"frameId": null, "frameId": null,
@ -10909,7 +10904,7 @@ exports[`history > multiplayer undo/redo > should redraw arrows on undo > [end o
"height": 126, "height": 126,
"id": "KPrBI4g_v9qUB1XxYLgSz", "id": "KPrBI4g_v9qUB1XxYLgSz",
"index": "a0", "index": "a0",
"isDeleted": false, "isDeleted": true,
"link": null, "link": null,
"locked": false, "locked": false,
"opacity": 100, "opacity": 100,
@ -10922,7 +10917,7 @@ exports[`history > multiplayer undo/redo > should redraw arrows on undo > [end o
"strokeWidth": 2, "strokeWidth": 2,
"type": "rectangle", "type": "rectangle",
"updated": 1, "updated": 1,
"version": 6, "version": 4,
"width": 157, "width": 157,
"x": 600, "x": 600,
"y": 0, "y": 0,
@ -10933,12 +10928,7 @@ exports[`history > multiplayer undo/redo > should redraw arrows on undo > [end o
{ {
"angle": 0, "angle": 0,
"backgroundColor": "transparent", "backgroundColor": "transparent",
"boundElements": [ "boundElements": [],
{
"id": "6Rm4g567UQM4WjLwej2Vc",
"type": "arrow",
},
],
"customData": undefined, "customData": undefined,
"fillStyle": "solid", "fillStyle": "solid",
"frameId": null, "frameId": null,
@ -10946,7 +10936,7 @@ exports[`history > multiplayer undo/redo > should redraw arrows on undo > [end o
"height": 129, "height": 129,
"id": "u2JGnnmoJ0VATV4vCNJE5", "id": "u2JGnnmoJ0VATV4vCNJE5",
"index": "a1", "index": "a1",
"isDeleted": false, "isDeleted": true,
"link": null, "link": null,
"locked": false, "locked": false,
"opacity": 100, "opacity": 100,
@ -10959,7 +10949,7 @@ exports[`history > multiplayer undo/redo > should redraw arrows on undo > [end o
"strokeWidth": 2, "strokeWidth": 2,
"type": "diamond", "type": "diamond",
"updated": 1, "updated": 1,
"version": 6, "version": 4,
"width": 124, "width": 124,
"x": 1152, "x": 1152,
"y": 516, "y": 516,
@ -10983,15 +10973,15 @@ exports[`history > multiplayer undo/redo > should redraw arrows on undo > [end o
"focus": "-0.00161", "focus": "-0.00161",
"gap": "3.53708", "gap": "3.53708",
}, },
"endIsSpecial": null, "endIsSpecial": false,
"fillStyle": "solid", "fillStyle": "solid",
"fixedSegments": null, "fixedSegments": [],
"frameId": null, "frameId": null,
"groupIds": [], "groupIds": [],
"height": "448.10100", "height": "236.10000",
"id": "6Rm4g567UQM4WjLwej2Vc", "id": "6Rm4g567UQM4WjLwej2Vc",
"index": "a2", "index": "a2",
"isDeleted": false, "isDeleted": true,
"lastCommittedPoint": null, "lastCommittedPoint": null,
"link": null, "link": null,
"locked": false, "locked": false,
@ -11002,16 +10992,12 @@ exports[`history > multiplayer undo/redo > should redraw arrows on undo > [end o
0, 0,
], ],
[ [
"225.95000", "178.90000",
0, 0,
], ],
[ [
"225.95000", "178.90000",
"448.10100", "236.10000",
],
[
"451.90000",
"448.10100",
], ],
], ],
"roughness": 1, "roughness": 1,
@ -11028,16 +11014,16 @@ exports[`history > multiplayer undo/redo > should redraw arrows on undo > [end o
"focus": "-0.00159", "focus": "-0.00159",
"gap": 5, "gap": 5,
}, },
"startIsSpecial": null, "startIsSpecial": false,
"strokeColor": "#1e1e1e", "strokeColor": "#1e1e1e",
"strokeStyle": "solid", "strokeStyle": "solid",
"strokeWidth": 2, "strokeWidth": 2,
"type": "arrow", "type": "arrow",
"updated": 1, "updated": 1,
"version": 6, "version": 3,
"width": "451.90000", "width": "178.90000",
"x": 762, "x": 1035,
"y": "62.90000", "y": "274.90000",
} }
`; `;
@ -11049,8 +11035,7 @@ History {
[Function], [Function],
], ],
}, },
"redoStack": [], "redoStack": [
"undoStack": [
HistoryEntry { HistoryEntry {
"appStateChange": AppStateChange { "appStateChange": AppStateChange {
"delta": Delta { "delta": Delta {
@ -11059,86 +11044,12 @@ History {
}, },
}, },
"elementsChange": ElementsChange { "elementsChange": ElementsChange {
"added": Map {}, "added": Map {
"removed": Map {
"KPrBI4g_v9qUB1XxYLgSz" => Delta {
"deleted": {
"angle": 0,
"backgroundColor": "transparent",
"boundElements": null,
"customData": undefined,
"fillStyle": "solid",
"frameId": null,
"groupIds": [],
"height": 126,
"index": "a0",
"isDeleted": false,
"link": null,
"locked": false,
"opacity": 100,
"roughness": 1,
"roundness": {
"type": 3,
},
"strokeColor": "#1e1e1e",
"strokeStyle": "solid",
"strokeWidth": 2,
"type": "rectangle",
"width": 157,
"x": 873,
"y": 212,
},
"inserted": {
"isDeleted": true,
},
},
"u2JGnnmoJ0VATV4vCNJE5" => Delta {
"deleted": {
"angle": 0,
"backgroundColor": "transparent",
"boundElements": null,
"customData": undefined,
"fillStyle": "solid",
"frameId": null,
"groupIds": [],
"height": 129,
"index": "a1",
"isDeleted": false,
"link": null,
"locked": false,
"opacity": 100,
"roughness": 1,
"roundness": {
"type": 3,
},
"strokeColor": "#1e1e1e",
"strokeStyle": "solid",
"strokeWidth": 2,
"type": "diamond",
"width": 124,
"x": 1152,
"y": 516,
},
"inserted": {
"isDeleted": true,
},
},
},
"updated": Map {},
},
},
HistoryEntry {
"appStateChange": AppStateChange {
"delta": Delta {
"deleted": {},
"inserted": {},
},
},
"elementsChange": ElementsChange {
"added": Map {},
"removed": Map {
"6Rm4g567UQM4WjLwej2Vc" => Delta { "6Rm4g567UQM4WjLwej2Vc" => Delta {
"deleted": { "deleted": {
"isDeleted": true,
},
"inserted": {
"angle": 0, "angle": 0,
"backgroundColor": "transparent", "backgroundColor": "transparent",
"boundElements": null, "boundElements": null,
@ -11203,14 +11114,15 @@ History {
"x": 1035, "x": 1035,
"y": "274.90000", "y": "274.90000",
}, },
"inserted": {
"isDeleted": true,
},
}, },
}, },
"removed": Map {},
"updated": Map { "updated": Map {
"KPrBI4g_v9qUB1XxYLgSz" => Delta { "KPrBI4g_v9qUB1XxYLgSz" => Delta {
"deleted": { "deleted": {
"boundElements": [],
},
"inserted": {
"boundElements": [ "boundElements": [
{ {
"id": "6Rm4g567UQM4WjLwej2Vc", "id": "6Rm4g567UQM4WjLwej2Vc",
@ -11218,12 +11130,12 @@ History {
}, },
], ],
}, },
"inserted": {
"boundElements": [],
},
}, },
"u2JGnnmoJ0VATV4vCNJE5" => Delta { "u2JGnnmoJ0VATV4vCNJE5" => Delta {
"deleted": { "deleted": {
"boundElements": [],
},
"inserted": {
"boundElements": [ "boundElements": [
{ {
"id": "6Rm4g567UQM4WjLwej2Vc", "id": "6Rm4g567UQM4WjLwej2Vc",
@ -11231,14 +11143,88 @@ History {
}, },
], ],
}, },
"inserted": {
"boundElements": [],
},
}, },
}, },
}, },
}, },
HistoryEntry {
"appStateChange": AppStateChange {
"delta": Delta {
"deleted": {},
"inserted": {},
},
},
"elementsChange": ElementsChange {
"added": Map {
"KPrBI4g_v9qUB1XxYLgSz" => Delta {
"deleted": {
"isDeleted": true,
},
"inserted": {
"angle": 0,
"backgroundColor": "transparent",
"boundElements": null,
"customData": undefined,
"fillStyle": "solid",
"frameId": null,
"groupIds": [],
"height": 126,
"index": "a0",
"isDeleted": false,
"link": null,
"locked": false,
"opacity": 100,
"roughness": 1,
"roundness": {
"type": 3,
},
"strokeColor": "#1e1e1e",
"strokeStyle": "solid",
"strokeWidth": 2,
"type": "rectangle",
"width": 157,
"x": 600,
"y": 0,
},
},
"u2JGnnmoJ0VATV4vCNJE5" => Delta {
"deleted": {
"isDeleted": true,
},
"inserted": {
"angle": 0,
"backgroundColor": "transparent",
"boundElements": null,
"customData": undefined,
"fillStyle": "solid",
"frameId": null,
"groupIds": [],
"height": 129,
"index": "a1",
"isDeleted": false,
"link": null,
"locked": false,
"opacity": 100,
"roughness": 1,
"roundness": {
"type": 3,
},
"strokeColor": "#1e1e1e",
"strokeStyle": "solid",
"strokeWidth": 2,
"type": "diamond",
"width": 124,
"x": 1152,
"y": 516,
},
},
},
"removed": Map {},
"updated": Map {},
},
},
], ],
"undoStack": [],
} }
`; `;

9
packages/excalidraw/tests/history.test.tsx
View file

@ -2077,16 +2077,15 @@ describe("history", () => {
storeAction: StoreAction.UPDATE, storeAction: StoreAction.UPDATE,
}); });
Keyboard.redo(); Keyboard.undo();
const modifiedArrow = h.elements.filter( const modifiedArrow = h.elements.filter(
(el) => el.type === "arrow", (el) => el.type === "arrow",
)[0] as ExcalidrawElbowArrowElement; )[0] as ExcalidrawElbowArrowElement;
expect(modifiedArrow.points).toEqual([ expect(modifiedArrow.points).toCloselyEqualPoints([
[0, 0], [0, 0],
[225.95000000000005, 0], [178.9, 0],
[225.95000000000005, 448.10100010002003], [178.9, 236.1],
[451.9000000000001, 448.10100010002003],
]); ]);
}); });