fix(studio): stop a paused save queue reporting a position edit as saved

Two more commits that could not tell a caller they had failed.

`useDomEditPositionPatchCommit` swallowed `DomEditSaveQueueOpenError` and
resolved. The intent was right, a paused save queue already puts a banner on
screen and one toast per blocked edit is noise, but swallowing it also
skipped the caller's revert: `useDomGeometryCommits` only restores the
optimistic offset, size or rotation from its `.catch`. So once the breaker
opened, a drag left the element where the user dropped it while nothing
reached the file, and the next reload snapped it back.

It now rejects without toasting. The banner still does the telling; the
caller gets to revert.

`handleDomEditElementsDelete` caught everything and only toasted, so an
unpatchable target and a completed delete were indistinguishable to a caller.
It now returns an outcome, with `no-project` and `no-selection` separated from
a failed write rather than all three sharing an early `return`.

Adds the first test for `useDomEditPositionPatchCommit`, covering the paused
queue, an ordinary failure, and success.

Author: miguel-heygen

packages/studio/src/hooks/domEditCommitRunner.ts

@@ -66,6 +66,7 @@ export async function runDomEditCommit(config: DomEditCommitRunnerConfig): Promi
  * programmatic caller has no screen, so it has to be told.
  */
 export type DomEditCommitDeclineReason =
+  | "no-project"
   | "no-selection"
   | "geometry-property"
   | "styles-not-editable"

packages/studio/src/hooks/useDomEditPositionPatchCommit.test.tsx

@@ -0,0 +1,116 @@
+// @vitest-environment jsdom
+import { act } from "react";
+import { afterEach, describe, expect, it, vi } from "vitest";
+import type { DomEditSelection } from "../components/editor/domEditing";
+import { DomEditSaveQueueOpenError } from "../utils/domEditSaveQueue";
+import { mountReactHarness } from "./domSelectionTestHarness";
+import { useDomEditPositionPatchCommit } from "./useDomEditPositionPatchCommit";
+
+Reflect.set(globalThis, "IS_REACT_ACT_ENVIRONMENT", true);
+
+let cleanup: (() => void) | null = null;
+
+function selectionStub(): DomEditSelection {
+  const element = document.createElement("div");
+  element.id = "card";
+  return {
+    id: "card",
+    element,
+    label: "Card",
+    tagName: "div",
+    sourceFile: "index.html",
+    compositionPath: "index.html",
+    isCompositionHost: false,
+    isInsideLockedComposition: false,
+    boundingBox: { x: 0, y: 0, width: 100, height: 100 },
+    textContent: null,
+    dataAttributes: {},
+    inlineStyles: {},
+    computedStyles: {},
+    textFields: [],
+    capabilities: {
+      canSelect: true,
+      canEditStyles: true,
+      canCrop: true,
+      canMove: true,
+      canResize: true,
+      canApplyManualOffset: true,
+      canApplyManualSize: true,
+      canApplyManualRotation: true,
+    },
+  };
+}
+
+function renderCommit(params: Parameters<typeof useDomEditPositionPatchCommit>[0]) {
+  const captured: { commit: ReturnType<typeof useDomEditPositionPatchCommit> | null } = {
+    commit: null,
+  };
+  function Probe() {
+    captured.commit = useDomEditPositionPatchCommit(params);
+    return null;
+  }
+  const root = mountReactHarness(<Probe />);
+  cleanup = () => act(() => root.unmount());
+  if (!captured.commit) throw new Error("hook did not initialize");
+  return captured.commit;
+}
+
+function paramsWith(queueDomEditSave: (save: () => Promise<void>) => Promise<void>) {
+  const showToast = vi.fn();
+  return {
+    showToast,
+    params: {
+      activeCompPath: "index.html",
+      persistDomEditOperations: vi.fn().mockResolvedValue(undefined),
+      queueDomEditSave,
+      showToast,
+    },
+  };
+}
+
+const options = { label: "Move layer", coalesceKey: "path-offset:card" };
+
+afterEach(() => {
+  cleanup?.();
+  cleanup = null;
+  vi.restoreAllMocks();
+});
+
+describe("useDomEditPositionPatchCommit", () => {
+  it("rejects when the save queue is paused, so the caller can revert its optimistic change", async () => {
+    const { showToast, params } = paramsWith(() => Promise.reject(new DomEditSaveQueueOpenError()));
+    const commit = renderCommit(params);
+
+    await act(async () => {
+      await expect(commit(selectionStub(), [], options)).rejects.toBeInstanceOf(
+        DomEditSaveQueueOpenError,
+      );
+    });
+
+    // No toast: the paused-save banner already tells the human, and one toast per
+    // blocked edit is what the original swallow existed to prevent.
+    expect(showToast).not.toHaveBeenCalled();
+  });
+
+  it("toasts and rejects on an ordinary save failure", async () => {
+    const { showToast, params } = paramsWith(() => Promise.reject(new Error("server said no")));
+    const commit = renderCommit(params);
+
+    await act(async () => {
+      await expect(commit(selectionStub(), [], options)).rejects.toThrow("server said no");
+    });
+
+    expect(showToast).toHaveBeenCalledWith("server said no");
+  });
+
+  it("resolves when the write lands", async () => {
+    const { showToast, params } = paramsWith((save) => save());
+    const commit = renderCommit(params);
+
+    await act(async () => {
+      await expect(commit(selectionStub(), [], options)).resolves.toBeUndefined();
+    });
+
+    expect(showToast).not.toHaveBeenCalled();
+  });
+});

packages/studio/src/hooks/useDomEditPositionPatchCommit.ts

@@ -35,7 +35,12 @@ export function useDomEditPositionPatchCommit({
           skipRefresh: options.skipRefresh ?? true,
         });
       }).catch((error) => {
-        if (error instanceof DomEditSaveQueueOpenError) return;
+        // A paused save queue is not worth a toast: the paused-save banner is
+        // already on screen, and one toast per blocked edit is what this branch
+        // exists to prevent. It still has to REJECT, though. Swallowing it
+        // resolved the commit, which skipped the caller's revert, so the element
+        // stayed where the drag put it while nothing reached the file.
+        if (error instanceof DomEditSaveQueueOpenError) throw error;
         showToast(error instanceof Error ? error.message : "Failed to save position");
         trackStudioSaveFailure({
           source: "dom_edit",

packages/studio/src/hooks/useElementLifecycleOps.ts

@@ -20,6 +20,7 @@ import {
   type LayerRevealCommitOwnership,
 } from "../components/editor/useLayerRevealOverride";
 import type { CommitDomEditPatchBatches, DomEditPatchBatch } from "./domEditCommitTypes";
+import { domEditCommitDeclined } from "./domEditCommitRunner";
 import { cutoverCommittedOrThrow, type CutoverResult } from "../utils/sdkCutover";
 import { studioWriteHeaders } from "../utils/studioFileVersion";
 
@@ -89,9 +90,9 @@ export function useElementLifecycleOps({
     // fallow-ignore-next-line complexity
     async (selections: DomEditSelection[]) => {
       const pid = projectIdRef.current;
-      if (!pid) return;
+      if (!pid) return domEditCommitDeclined("no-project");
       const [selection] = selections;
-      if (!selection) return;
+      if (!selection) return domEditCommitDeclined("no-selection");
       const label =
         selections.length === 1
           ? selection.label || selection.id || selection.selector || selection.tagName
@@ -208,9 +209,13 @@ export function useElementLifecycleOps({
           `Deleted ${label}. Use Undo to restore ${sameFile.length === 1 ? "it" : "them"}.`,
           "info",
         );
+        return { ok: true } as const;
       } catch (error) {
         const message = error instanceof Error ? error.message : "Failed to delete element";
         showToast(message);
+        // The toast is what tells the human. The returned outcome is what tells
+        // a caller that has no screen to read.
+        return domEditCommitDeclined("persist-failed");
       }
     },
     [