mirror of
https://github.com/heygen-com/hyperframes.git
synced 2026-09-11 06:30:03 +00:00
feat: Persist Studio manual edits via manifest (#593)
## Summary Studio manual geometry edits now persist as a project-local manifest instead of being baked into composition source on each gesture. The manifest lives at: ```text .hyperframes/studio-manual-edits.json ``` It is the source of truth for manual drag, resize, rotation, inspector geometry edits, group moves, and selected-layer reset. ## Architecture - **Manifest-backed edits**: each edit stores a kind (`path-offset`, `box-size`, `rotation`), a source-scoped target, and the edit values. - **Source-scoped resolution**: targets include `sourceFile`, `id`, `selector`, and `selectorIndex`, so duplicate selectors in nested compositions resolve against the owning source file. - **Additive CSS layer**: move uses CSS `translate`, resize writes stable dimensions/flex sizing, and rotation uses CSS `rotate` over the authored base. - **Shared replay runtime**: Studio preview, thumbnails, frame capture, producer renders, and CLI Studio renders/thumbnails all use the same core manual-edit render script. - **Animation-safe replay**: Studio reapplies the manual layer after load, refresh, timeline seeks, player operations, playback frames, thumbnail seeks, and render seeks instead of rewriting GSAP timelines. - **History and handoff**: the manifest is a normal project file, so undo/redo and agent edits can preserve, modify, or remove manual visual edits explicitly. ## User Impact Users can move, resize, rotate, group-move, and reset supported layers from the canvas or inspector, then refresh, capture thumbnails/screenshots, play animated compositions, and render videos without manual edits drifting away from the edited state. ## Main Files - `packages/studio/src/components/editor/manualEdits.ts` - `packages/studio/src/components/editor/DomEditOverlay.tsx` - `packages/studio/src/components/editor/PropertyPanel.tsx` - `packages/studio/src/App.tsx` - `packages/core/src/studio-api/helpers/manualEditsRenderScript.ts` - `packages/studio/vite.config.ts` - `packages/cli/src/server/studioServer.ts` - `packages/core/src/compiler/htmlBundler.ts` - `packages/producer/src/services/htmlCompiler.ts` - `packages/core/src/studio-api/routes/thumbnail.ts` - `packages/producer/src/services/fileServer.ts` - `packages/producer/src/services/renderOrchestrator.ts` ## Test Plan ```bash volta run --node 22.20.0 bun run build volta run --node 22.20.0 bun run --filter @hyperframes/core test -- src/studio-api/helpers/manualEditsRenderScript.test.ts volta run --node 22.20.0 bun run --filter @hyperframes/core typecheck volta run --node 22.20.0 bun run --filter @hyperframes/studio typecheck volta run --node 22.20.0 bun run --filter @hyperframes/cli typecheck volta run --node 22.20.0 bunx oxlint <changed files> volta run --node 22.20.0 bunx oxfmt --check <changed files> git diff --check ```
This commit is contained in:
@@ -0,0 +1,89 @@
|
||||
import { afterEach, describe, expect, it, vi } from "vitest";
|
||||
import { Window } from "happy-dom";
|
||||
import { copyTextToClipboard } from "./clipboard";
|
||||
|
||||
function installDocument(execCommand: (command: string) => boolean): void {
|
||||
const window = new Window();
|
||||
Object.assign(window, { SyntaxError });
|
||||
Object.defineProperty(window.document, "execCommand", {
|
||||
configurable: true,
|
||||
value: execCommand,
|
||||
});
|
||||
vi.stubGlobal("document", window.document);
|
||||
}
|
||||
|
||||
function installNavigator(
|
||||
writeText: (text: string) => Promise<void>,
|
||||
userAgent = "Mozilla/5.0 Chrome/120.0.0.0 Safari/537.36",
|
||||
): void {
|
||||
vi.stubGlobal("navigator", {
|
||||
clipboard: { writeText },
|
||||
userAgent,
|
||||
});
|
||||
}
|
||||
|
||||
describe("copyTextToClipboard", () => {
|
||||
afterEach(() => {
|
||||
vi.unstubAllGlobals();
|
||||
});
|
||||
|
||||
it("uses the synchronous selection copy path first in Safari", async () => {
|
||||
const execCommand = vi.fn((command: string) => command === "copy");
|
||||
const writeText = vi.fn((_text: string) => Promise.resolve());
|
||||
|
||||
installDocument(execCommand);
|
||||
installNavigator(
|
||||
writeText,
|
||||
"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/26.0 Safari/605.1.15",
|
||||
);
|
||||
|
||||
await expect(copyTextToClipboard("copy me")).resolves.toBe(true);
|
||||
|
||||
expect(execCommand).toHaveBeenCalledWith("copy");
|
||||
expect(writeText).not.toHaveBeenCalled();
|
||||
expect(document.querySelector("textarea")).toBeNull();
|
||||
});
|
||||
|
||||
it("uses navigator.clipboard first outside Safari", async () => {
|
||||
const execCommand = vi.fn((command: string) => command === "copy");
|
||||
const writeText = vi.fn((_text: string) => Promise.resolve());
|
||||
|
||||
installDocument(execCommand);
|
||||
installNavigator(writeText);
|
||||
|
||||
await expect(copyTextToClipboard("copy me")).resolves.toBe(true);
|
||||
|
||||
expect(writeText).toHaveBeenCalledWith("copy me");
|
||||
expect(execCommand).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it("falls back to selection copy outside Safari when navigator.clipboard fails", async () => {
|
||||
const execCommand = vi.fn((command: string) => command === "copy");
|
||||
const writeText = vi.fn((_text: string) => Promise.reject(new Error("blocked")));
|
||||
|
||||
installDocument(execCommand);
|
||||
installNavigator(writeText);
|
||||
|
||||
await expect(copyTextToClipboard("copy me")).resolves.toBe(true);
|
||||
|
||||
expect(writeText).toHaveBeenCalledWith("copy me");
|
||||
expect(execCommand).toHaveBeenCalledWith("copy");
|
||||
});
|
||||
|
||||
it("reports failure when both copy paths fail", async () => {
|
||||
const execCommand = vi.fn(() => false);
|
||||
const writeText = vi.fn((_text: string) => Promise.reject(new Error("blocked")));
|
||||
|
||||
installDocument(execCommand);
|
||||
installNavigator(
|
||||
writeText,
|
||||
"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/26.0 Safari/605.1.15",
|
||||
);
|
||||
|
||||
await expect(copyTextToClipboard("copy me")).resolves.toBe(false);
|
||||
|
||||
expect(execCommand).toHaveBeenCalledWith("copy");
|
||||
expect(writeText).toHaveBeenCalledWith("copy me");
|
||||
expect(document.querySelector("textarea")).toBeNull();
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user