fix: Arrow point index Out-of-Bounds (#10922)

* fix: Make OOB not fatal

Signed-off-by: Mark Tolmacs <mark@lazycat.hu>

* fix: More conservative temp arrow state update

Signed-off-by: Mark Tolmacs <mark@lazycat.hu>

* chore: Capture condition variables in binding restoration failure

Signed-off-by: Mark Tolmacs <mark@lazycat.hu>

---------

Signed-off-by: Mark Tolmacs <mark@lazycat.hu>

packages/element/src/linearElementEditor.ts

@@ -476,10 +476,12 @@ export class LinearElementEditor {
       });
     }
 
-    invariant(
+    if (
-      lastClickedPoint > -1 &&
+      lastClickedPoint < 0 ||
-        selectedPointsIndices.includes(lastClickedPoint) &&
+      !selectedPointsIndices.includes(lastClickedPoint) ||
-        element.points[lastClickedPoint],
+      !element.points[lastClickedPoint]
+    ) {
+      console.error(
         `There must be a valid lastClickedPoint in order to drag it. selectedPointsIndices(${JSON.stringify(
           selectedPointsIndices,
         )}) points(0..${
@@ -487,6 +489,10 @@ export class LinearElementEditor {
         }) lastClickedPoint(${lastClickedPoint})`,
       );
 
+      // Fall back to the actual last point as a last resort.
+      lastClickedPoint = element.points.length - 1;
+    }
+
     // point that's being dragged (out of all selected points)
     const draggingPoint = element.points[lastClickedPoint];
     // The adjacent point to the one dragged point

packages/excalidraw/components/App.tsx

@@ -6995,27 +6995,23 @@ class App extends React.Component<AppProps, AppState> {
           },
           { informMutation: false, isDragging: false },
         );
+        const newLastIdx = multiElement.points.length - 1;
         this.setState({
           selectedLinearElement: {
             ...selectedLinearElement,
-            selectedPointsIndices:
+            selectedPointsIndices: selectedLinearElement.selectedPointsIndices
-              selectedLinearElement.selectedPointsIndices?.includes(
-                multiElement.points.length,
-              )
               ? [
-                    ...selectedLinearElement.selectedPointsIndices.filter(
+                  ...new Set(
-                      (idx) =>
+                    selectedLinearElement.selectedPointsIndices.map((idx) =>
-                        idx !== multiElement.points.length &&
+                      Math.min(idx, newLastIdx),
-                        idx !== multiElement.points.length - 1,
+                    ),
                   ),
-                    multiElement.points.length - 1,
                 ]
               : selectedLinearElement.selectedPointsIndices,
-            lastCommittedPoint:
+            lastCommittedPoint: multiElement.points[newLastIdx],
-              multiElement.points[multiElement.points.length - 1],
             initialState: {
               ...selectedLinearElement.initialState,
-              lastClickedPoint: multiElement.points.length - 1,
+              lastClickedPoint: newLastIdx,
             },
           },
         });

packages/excalidraw/data/restore.ts

@@ -251,7 +251,9 @@ const repairBinding = <T extends ExcalidrawArrowElement>(
       };
     }
 
-    console.error(`could not repair binding for element`);
+    console.error(
+      `Could not repair binding for element "${boundElement?.id}" out of (${elementsMap?.size}) elements`,
+    );
   } catch (error) {
     console.error("Error repairing binding:", error);
   }