1berry/excalidraw
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix binding disabled use-case triggering arrow editor

Browse Source
This commit is contained in:
Mark Tolmacs 2025-06-25 19:59:57 +02:00
parent fbff9a3463
commit 3ccb7e3239
No known key found for this signature in database
8 changed files with 876 additions and 417 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/element/tests/binding.test.tsx
View File

@ -627,13 +627,13 @@ describe("Fixed-point arrow binding", () => {
// The end point should be a normal point binding
const endBinding = arrow.endBinding as FixedPointBinding;
expect(endBinding.focus).toBeCloseTo(0, 5);
expect(endBinding.gap).toBeCloseTo(5, 5);
expect(endBinding.focus).toBeCloseTo(0);
expect(endBinding.gap).toBeCloseTo(0);
expect(arrow.x).toBe(50);
expect(arrow.y).toBe(50);
expect(arrow.width).toBeCloseTo(203, 0);
expect(arrow.height).toBeCloseTo(235, 0);
expect(arrow.width).toBeCloseTo(304, 0);
expect(arrow.height).toBeCloseTo(344, 0);
});
it("should move inner points when arrow is bound to same element on both ends", () => {

10
packages/excalidraw/components/App.tsx
View File

@ -647,6 +647,11 @@ class App extends React.Component<AppProps, AppState> {
>();
onRemoveEventListenersEmitter = new Emitter<[]>();
// setState(s: any, t: any) {
// s.editingLinearElement && console.trace(s.editingLinearElement);
// super.setState(s, t);
// }
constructor(props: AppProps) {
super(props);
const defaultAppState = getDefaultAppState();
@ -9285,10 +9290,7 @@ class App extends React.Component<AppProps, AppState> {
newElement,
});
} else if (pointerDownState.drag.hasOccurred && !multiElement) {
if (
isBindingEnabled(this.state) &&
isBindingElement(newElement, false)
) {
if (isBindingElement(newElement, false)) {
this.actionManager.executeAction(actionFinalize, "ui", {
event: childEvent,
sceneCoords,

392
packages/excalidraw/data/__snapshots__/transform.test.ts.snap
View File

@ -342,8 +342,12 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to existing t
"endArrowhead": "arrow",
"endBinding": {
"elementId": "text-2",
"fixedPoint": [
-2.05,
0.5001,
],
"focus": 0,
"gap": 16,
"gap": 0,
},
"fillStyle": "solid",
"frameId": null,
@ -433,6 +437,392 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to existing t
}
`;
exports[`Test Transform > Test arrow bindings > should bind arrows to shapes when start / end provided without ids 1`] = `
{
"angle": 0,
"backgroundColor": "transparent",
"boundElements": [
{
"id": "id40",
"type": "text",
},
],
"customData": undefined,
"elbowed": false,
"endArrowhead": "arrow",
"endBinding": {
"elementId": "id42",
"fixedPoint": [
0,
0.5001,
],
"focus": 0,
"gap": 0,
},
"fillStyle": "solid",
"frameId": null,
"groupIds": [],
"height": 0,
"id": Any<String>,
"index": "a0",
"isDeleted": false,
"lastCommittedPoint": null,
"link": null,
"locked": false,
"opacity": 100,
"points": [
[
0,
0,
],
[
99,
0,
],
],
"roughness": 1,
"roundness": null,
"seed": Any<Number>,
"startArrowhead": null,
"startBinding": {
"elementId": "id41",
"fixedPoint": [
1,
0.5001,
],
"focus": 0,
"gap": 0,
},
"strokeColor": "#1e1e1e",
"strokeStyle": "solid",
"strokeWidth": 2,
"type": "arrow",
"updated": 1,
"version": 4,
"versionNonce": Any<Number>,
"width": 100,
"x": 255.5,
"y": 239,
}
`;
exports[`Test Transform > Test arrow bindings > should bind arrows to shapes when start / end provided without ids 2`] = `
{
"angle": 0,
"autoResize": true,
"backgroundColor": "transparent",
"boundElements": null,
"containerId": "id39",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
"height": 25,
"id": Any<String>,
"index": "a1",
"isDeleted": false,
"lineHeight": 1.25,
"link": null,
"locked": false,
"opacity": 100,
"originalText": "HELLO WORLD!!",
"roughness": 1,
"roundness": null,
"seed": Any<Number>,
"strokeColor": "#1e1e1e",
"strokeStyle": "solid",
"strokeWidth": 2,
"text": "HELLO WORLD!!",
"textAlign": "center",
"type": "text",
"updated": 1,
"version": 3,
"versionNonce": Any<Number>,
"verticalAlign": "middle",
"width": 130,
"x": 240,
"y": 226.5,
}
`;
exports[`Test Transform > Test arrow bindings > should bind arrows to shapes when start / end provided without ids 3`] = `
{
"angle": 0,
"backgroundColor": "transparent",
"boundElements": [
{
"id": "id39",
"type": "arrow",
},
],
"customData": undefined,
"fillStyle": "solid",
"frameId": null,
"groupIds": [],
"height": 100,
"id": Any<String>,
"index": "a2",
"isDeleted": false,
"link": null,
"locked": false,
"opacity": 100,
"roughness": 1,
"roundness": null,
"seed": Any<Number>,
"strokeColor": "#1e1e1e",
"strokeStyle": "solid",
"strokeWidth": 2,
"type": "rectangle",
"updated": 1,
"version": 3,
"versionNonce": Any<Number>,
"width": 100,
"x": 155,
"y": 189,
}
`;
exports[`Test Transform > Test arrow bindings > should bind arrows to shapes when start / end provided without ids 4`] = `
{
"angle": 0,
"backgroundColor": "transparent",
"boundElements": [
{
"id": "id39",
"type": "arrow",
},
],
"customData": undefined,
"fillStyle": "solid",
"frameId": null,
"groupIds": [],
"height": 100,
"id": Any<String>,
"index": "a3",
"isDeleted": false,
"link": null,
"locked": false,
"opacity": 100,
"roughness": 1,
"roundness": null,
"seed": Any<Number>,
"strokeColor": "#1e1e1e",
"strokeStyle": "solid",
"strokeWidth": 2,
"type": "ellipse",
"updated": 1,
"version": 3,
"versionNonce": Any<Number>,
"width": 100,
"x": 355,
"y": 189,
}
`;
exports[`Test Transform > Test arrow bindings > should bind arrows to text when start / end provided without ids 1`] = `
{
"angle": 0,
"backgroundColor": "transparent",
"boundElements": [
{
"id": "id44",
"type": "text",
},
],
"customData": undefined,
"elbowed": false,
"endArrowhead": "arrow",
"endBinding": {
"elementId": "id46",
"fixedPoint": [
0,
0.5001,
],
"focus": 0,
"gap": 0,
},
"fillStyle": "solid",
"frameId": null,
"groupIds": [],
"height": 0,
"id": Any<String>,
"index": "a0",
"isDeleted": false,
"lastCommittedPoint": null,
"link": null,
"locked": false,
"opacity": 100,
"points": [
[
0,
0,
],
[
99,
0,
],
],
"roughness": 1,
"roundness": null,
"seed": Any<Number>,
"startArrowhead": null,
"startBinding": {
"elementId": "id45",
"fixedPoint": [
1,
0.5001,
],
"focus": 0,
"gap": 0,
},
"strokeColor": "#1e1e1e",
"strokeStyle": "solid",
"strokeWidth": 2,
"type": "arrow",
"updated": 1,
"version": 4,
"versionNonce": Any<Number>,
"width": 100,
"x": 255.5,
"y": 239,
}
`;
exports[`Test Transform > Test arrow bindings > should bind arrows to text when start / end provided without ids 2`] = `
{
"angle": 0,
"autoResize": true,
"backgroundColor": "transparent",
"boundElements": null,
"containerId": "id43",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
"height": 25,
"id": Any<String>,
"index": "a1",
"isDeleted": false,
"lineHeight": 1.25,
"link": null,
"locked": false,
"opacity": 100,
"originalText": "HELLO WORLD!!",
"roughness": 1,
"roundness": null,
"seed": Any<Number>,
"strokeColor": "#1e1e1e",
"strokeStyle": "solid",
"strokeWidth": 2,
"text": "HELLO WORLD!!",
"textAlign": "center",
"type": "text",
"updated": 1,
"version": 3,
"versionNonce": Any<Number>,
"verticalAlign": "middle",
"width": 130,
"x": 240,
"y": 226.5,
}
`;
exports[`Test Transform > Test arrow bindings > should bind arrows to text when start / end provided without ids 3`] = `
{
"angle": 0,
"autoResize": true,
"backgroundColor": "transparent",
"boundElements": [
{
"id": "id43",
"type": "arrow",
},
],
"containerId": null,
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
"height": 25,
"id": Any<String>,
"index": "a2",
"isDeleted": false,
"lineHeight": 1.25,
"link": null,
"locked": false,
"opacity": 100,
"originalText": "HEYYYYY",
"roughness": 1,
"roundness": null,
"seed": Any<Number>,
"strokeColor": "#1e1e1e",
"strokeStyle": "solid",
"strokeWidth": 2,
"text": "HEYYYYY",
"textAlign": "left",
"type": "text",
"updated": 1,
"version": 3,
"versionNonce": Any<Number>,
"verticalAlign": "top",
"width": 70,
"x": 185,
"y": 226.5,
}
`;
exports[`Test Transform > Test arrow bindings > should bind arrows to text when start / end provided without ids 4`] = `
{
"angle": 0,
"autoResize": true,
"backgroundColor": "transparent",
"boundElements": [
{
"id": "id43",
"type": "arrow",
},
],
"containerId": null,
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
"height": 25,
"id": Any<String>,
"index": "a3",
"isDeleted": false,
"lineHeight": 1.25,
"link": null,
"locked": false,
"opacity": 100,
"originalText": "WHATS UP ?",
"roughness": 1,
"roundness": null,
"seed": Any<Number>,
"strokeColor": "#1e1e1e",
"strokeStyle": "solid",
"strokeWidth": 2,
"text": "WHATS UP ?",
"textAlign": "left",
"type": "text",
"updated": 1,
"version": 3,
"versionNonce": Any<Number>,
"verticalAlign": "top",
"width": 100,
"x": 355,
"y": 226.5,
}
`;
exports[`Test Transform > should not allow duplicate ids 1`] = `
{
"angle": 0,

8
packages/excalidraw/data/transform.test.ts
View File

@ -433,11 +433,11 @@ describe("Test Transform", () => {
startBinding: {
elementId: rectangle.id,
focus: 0,
gap: 1,
gap: 0,
},
endBinding: {
elementId: ellipse.id,
focus: -0,
focus: 0,
},
});
@ -518,11 +518,11 @@ describe("Test Transform", () => {
startBinding: {
elementId: text2.id,
focus: 0,
gap: 1,
gap: 0,
},
endBinding: {
elementId: text3.id,
focus: -0,
focus: 0,
},
});

822
packages/excalidraw/tests/__snapshots__/history.test.tsx.snap
View File

File diff suppressed because it is too large Load Diff

1
packages/excalidraw/tests/__snapshots__/move.test.tsx.snap
View File

@ -193,6 +193,7 @@ exports[`move element > rectangles with binding arrow 7`] = `
"lastCommittedPoint": null,
"link": null,
"locked": false,
"moveMidPointsWithElement": false,
"opacity": 100,
"points": [
[

50
packages/excalidraw/tests/__snapshots__/selection.test.tsx.snap
View File

@ -1,5 +1,55 @@
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`select single element on the scene > arrow 1`] = `
{
"angle": 0,
"backgroundColor": "transparent",
"boundElements": null,
"customData": undefined,
"elbowed": false,
"endArrowhead": "arrow",
"endBinding": null,
"fillStyle": "solid",
"frameId": null,
"groupIds": [],
"height": 50,
"id": "id0",
"index": "a0",
"isDeleted": false,
"lastCommittedPoint": null,
"link": null,
"locked": false,
"opacity": 100,
"points": [
[
0,
0,
],
[
30,
50,
],
],
"roughness": 1,
"roundness": {
"type": 2,
},
"seed": 1278240551,
"startArrowhead": null,
"startBinding": null,
"strokeColor": "#1e1e1e",
"strokeStyle": "solid",
"strokeWidth": 2,
"type": "arrow",
"updated": 1,
"version": 4,
"versionNonce": 2019559783,
"width": 30,
"x": 10,
"y": 10,
}
`;
exports[`select single element on the scene > arrow escape 1`] = `
{
"angle": 0,

2
packages/excalidraw/tests/selection.test.tsx
View File

@ -425,7 +425,7 @@ describe("select single element on the scene", () => {
fireEvent.pointerDown(canvas, { clientX: 40, clientY: 40 });
fireEvent.pointerUp(canvas);
expect(renderInteractiveScene).toHaveBeenCalledTimes(8);
expect(renderInteractiveScene).toHaveBeenCalledTimes(9);
expect(renderStaticScene).toHaveBeenCalledTimes(6);
expect(h.state.selectionElement).toBeNull();
expect(h.elements.length).toEqual(1);