@hyperframes/studio 0.8.124 → 0.8.126

package/src/utils/studioPendingEdits.test.ts

@@ -2,6 +2,7 @@
 import { describe, expect, it, vi } from "vitest";
 import {
   addStudioPendingEditFlushListener,
+  adoptingStudioPendingEdit,
   beginStudioPendingEdit,
   flushStudioPendingEdits,
   hasStudioPendingEdits,
@@ -312,3 +313,54 @@ describe("a drain of only the current edits", () => {
     landLater();
   });
 });
+
+describe("an edit undo painted back while it saves", () => {
+  function paintedBackEdit() {
+    const box = { look: "edited" };
+    const edit = beginStudioPendingEdit(() => {
+      const shown = box.look;
+      box.look = "start";
+      return () => (box.look = shown);
+    });
+    let landSave!: () => void;
+    const inFlight = edit.adopt(() => adoptingStudioPendingEdit())!;
+    edit.settle(new Promise<void>((resolve) => (landSave = resolve)));
+    const shown = paintBackNewestStudioPendingEdit()!;
+    return { box, inFlight, shown, landSave };
+  }
+
+  it("draws on the edit as shown, then shows it undone again in the same task", () => {
+    const { box, inFlight, shown, landSave } = paintedBackEdit();
+    let drawnOver = "";
+    inFlight.drawKeepingUndone(() => {
+      drawnOver = box.look;
+      box.look += "+size";
+    });
+    expect(drawnOver).toBe("edited");
+    expect(box.look).toBe("start");
+    shown.showAgain();
+    expect(box.look).toBe("edited+size");
+    landSave();
+  });
+
+  it("keeps a redraw until the edit is shown again", () => {
+    const { inFlight, shown, landSave } = paintedBackEdit();
+    const redraw = vi.fn();
+    inFlight.drawUnlessUndone(redraw);
+    expect(redraw).not.toHaveBeenCalled();
+    shown.showAgain();
+    expect(redraw).toHaveBeenCalledTimes(1);
+    landSave();
+  });
+});
+
+it("counts an edit whose later write failed as saved once an earlier write landed, so undo still steps it", async () => {
+  const edit = beginStudioPendingEdit(() => () => undefined);
+  const committed = edit.adopt(async () => {
+    adoptingStudioPendingEdit()!.markSaved();
+    throw new Error("the crop save failed");
+  });
+  edit.settle(committed.catch(() => undefined));
+  const shown = paintBackNewestStudioPendingEdit()!;
+  await expect(shown.landed()).resolves.toBe(true);
+});

package/src/utils/studioPendingEdits.ts

@@ -14,11 +14,25 @@ export type StudioEditRevert = () => () => void;
 interface PendingEdit {
   revert: StudioEditRevert | null;
   landed: () => Promise<boolean>;
+  redraws: Array<() => void>;
+  showAgain: (() => void) | null;
+}
+
+export interface StudioEditInFlight {
+  reverted: () => boolean;
+  within: <T>(run: () => T) => T;
+  drawUnlessUndone: (draw: () => void) => void;
+  drawKeepingUndone: <T>(draw: () => T) => T;
+  markSaved: () => void;
 }
 
 const pendingEdits = new Map<Promise<unknown>, PendingEdit>();
 const NOT_SAVED = () => Promise.resolve(false);
-let adopting = false;
+let adopting: StudioEditInFlight | null = null;
+
+export function adoptingStudioPendingEdit(): StudioEditInFlight | null {
+  return adopting;
+}
 
 function waitForPostBlurEffects(): Promise<void> {
   return new Promise((resolve) => setTimeout(resolve, 0));
@@ -73,7 +87,7 @@ export function trackStudioPendingEdit(
   if (!result) return undefined;
   const promise = Promise.resolve(result);
   if (adopting) return promise;
-  pendingEdits.set(promise, { revert: null, landed: NOT_SAVED });
+  pendingEdits.set(promise, { revert: null, landed: NOT_SAVED, redraws: [], showAgain: null });
   promise.then(
     () => pendingEdits.delete(promise),
     () => pendingEdits.delete(promise),
@@ -97,25 +111,49 @@ export function beginStudioPendingEdit(revert: StudioEditRevert | null) {
   const entry = pendingEdits.get(promise)!;
   entry.revert = revert;
   let landed = Promise.resolve(false);
+  let saved = false;
   entry.landed = () => landed;
+  const inFlight: StudioEditInFlight = {
+    reverted: () => entry.revert === null && revert !== null,
+    within(run) {
+      const outer = adopting;
+      adopting = inFlight;
+      try {
+        return run();
+      } finally {
+        adopting = outer;
+      }
+    },
+    drawUnlessUndone(draw) {
+      if (inFlight.reverted()) entry.redraws.push(draw);
+      else draw();
+    },
+    drawKeepingUndone(draw) {
+      if (!inFlight.reverted()) return draw();
+      entry.showAgain?.();
+      try {
+        return draw();
+      } finally {
+        entry.showAgain = revert!();
+      }
+    },
+    markSaved: () => void (saved = true),
+  };
   return {
     settle,
-    reverted: () => entry.revert === null && revert !== null,
-    // Only what `start` registers synchronously is adopted; a registration after an await is a newer edit.
+    reverted: inFlight.reverted,
+    // Only what `start` registers synchronously is adopted; a later write joins only through `within`.
     adopt<T>(start: () => T): T {
-      adopting = true;
       try {
-        const committed = start();
+        const committed = inFlight.within(start);
         landed = Promise.resolve(committed).then(
           () => true,
-          () => false,
+          () => saved,
         );
         return committed;
       } catch (error) {
         settle();
         throw error;
-      } finally {
-        adopting = false;
       }
     },
   };
@@ -129,7 +167,14 @@ export function paintBackNewestStudioPendingEdit(): {
   const revert = newest?.revert;
   if (!newest || !revert) return null;
   newest.revert = null;
-  return { showAgain: revert(), landed: newest.landed };
+  newest.showAgain = revert();
+  return {
+    showAgain: () => {
+      newest.showAgain?.();
+      for (const redraw of newest.redraws.splice(0)) redraw();
+    },
+    landed: newest.landed,
+  };
 }
 
 export function revertNewestStudioPendingEdit(): (() => void) | null {

package/src/webmcp/webmcpTestUtils.ts

@@ -5,6 +5,7 @@
  * existing `hooks/domSelectionTestHarness.ts` convention.
  */
 
+import { isHtmlElement } from "@hyperframes/core/runtime/dom-realm";
 import { expect } from "vitest";
 import type { DomEditSelection } from "../components/editor/domEditingTypes";
 import type { ToolFailure, ToolResult } from "./toolResult";
@@ -31,8 +32,7 @@ export function previewDoc(html: string): Document {
 export function previewElement(html: string, id: string): HTMLElement {
   const doc = previewDoc(html);
   const element = doc.getElementById(id);
-  const HTMLElementCtor = doc.defaultView?.HTMLElement;
-  if (!HTMLElementCtor || !(element instanceof HTMLElementCtor)) {
+  if (!isHtmlElement(element)) {
     throw new Error(`expected preview element #${id}`);
   }
   return element;