@sailfish-ai/recorder 1.12.5 → 1.12.6

package/dist/canvas/patch2d.js

@@ -0,0 +1,1302 @@
+/**
+ * Global 2D-context instrumentation: prototype patches that feed per-context
+ * recorders. Port of the validated bench core
+ * (test-applications/canvas-recorder-bench/src/capture/patch2d.ts).
+ *
+ * Captures: every CanvasRenderingContext2D method call + property set,
+ * gradient/pattern creation (interned objects), image sources (asset CAS),
+ * ImageData, and a shadow state stack (props + transform per save()) that
+ * makes keyframe seeking possible.
+ *
+ * SDK adaptations (everything else is a faithful port):
+ *  - NO window/document/navigator access at module top level (SSR rule);
+ *    all installation happens inside exported install functions.
+ *  - `encodeImage` returns `{size, bytes?}` so encoded webp payloads can be
+ *    shipped as SFCV asset frames (sink.onAssetData), not just size-counted.
+ *  - `retainAssets` option: the worker-relay path keeps bitmaps/ImageData for
+ *    postMessage transfer (bench behavior); the main-thread manager passes
+ *    false so per-draw dynamic-source assets do not accumulate in memory.
+ *  - Untracked-context + context-created notifiers so the production manager
+ *    can discover contexts created BEFORE hooks installed (first method call
+ *    after install) and AFTER (getContext auto-attach path).
+ *  - DiscardSink short-circuit: in video mode the recorder stays attached
+ *    purely for dirtiness; ops are dropped BEFORE argument serialization.
+ */
+import { DEFAULT_REDACT_STYLE, maskAllText, rectRegion, REDACTION_COLOR, textLocalBox, textRegion, transformedBox, } from "./canvasPrivacy";
+import { deflate } from "./codec";
+import { getNativePath2D, installFactoryLoggingOnProto, installSharedObjectLogging, objectLogs, OBJECT_FACTORIES, } from "./objectLog";
+import { BufferSink, DIRTY_OP, DiscardSink, } from "./protocol";
+// Re-export the shared protocol types under their bench names so the sibling
+// ports (patchGL/patchWebGPU/workerShim) keep their original import shape.
+export { BufferSink, serializeTypedArray, deserializeTypedArray, TYPED_ARRAY_KINDS, } from "./protocol";
+const TRACKED_PROPS = [
+    "fillStyle", "strokeStyle", "globalAlpha", "globalCompositeOperation",
+    "lineWidth", "lineCap", "lineJoin", "miterLimit", "lineDashOffset",
+    "font", "textAlign", "textBaseline", "direction",
+    "shadowBlur", "shadowColor", "shadowOffsetX", "shadowOffsetY",
+    "imageSmoothingEnabled", "imageSmoothingQuality", "filter", "letterSpacing", "wordSpacing",
+];
+// Cross-context object support (gradients/patterns/paths) lives in
+// objectLog.ts so index.tsx can install the creation logging EARLY —
+// synchronously at startRecording() entry, before app scene code constructs
+// objects the recorder could otherwise never serialize. Each recorder emits
+// its own copy of a logged object lazily into whichever command stream first
+// references it (serializeFactoryObject), under a globally unique id.
+let nextAssetId = 1;
+let nextObjId = 1;
+/**
+ * A27 safety set. A canvas is added here when `maskCanvasDraws` runs against it
+ * while recording is OFF / the canvas isn't recorded (no recorder to track a
+ * blank region) — the masked draw still paints real pixels. The manager reads
+ * this to skip the A27 initial keyframe for THAT canvas, which could otherwise
+ * ship those pixels un-blanked.
+ *
+ * [audit H2 / Round 2] Scoped PER CANVAS via a WeakSet rather than a module-wide
+ * boolean. The Round-1 boolean was set-once / never-reset, so a single
+ * off-recording maskCanvasDraws on ANY canvas permanently skipped A27 for EVERY
+ * canvas session-wide (and across record stop/restart, since the module global
+ * outlives a session). The WeakSet pins the skip to the exact canvas that had a
+ * pre-attach masked draw, leaks nothing (GC reclaims entries when the canvas is
+ * gone), and needs no session-teardown reset. When the target context has no
+ * resolvable canvas (a detached/worker ctx), we fall back to a global flag so an
+ * unattributable pre-attach mask still fails safe (skip A27 broadly).
+ *
+ * Lives here (not canvasManager) because index.tsx imports patch2d but
+ * lazy-loads canvasManager. [audit A27 / Round 1]
+ */
+const preAttachMaskedCanvases = new WeakSet();
+let preAttachMaskUsedUnattributed = false;
+export function notePreAttachMaskUsed(canvas) {
+    if (canvas)
+        preAttachMaskedCanvases.add(canvas);
+    else
+        preAttachMaskUsedUnattributed = true;
+}
+export function wasPreAttachMaskUsed(canvas) {
+    if (preAttachMaskUsedUnattributed)
+        return true;
+    return canvas ? preAttachMaskedCanvases.has(canvas) : false;
+}
+/** Cap on accumulated masked-region bboxes (keyframe blanking) so an incremental
+ * canvas that never issues a full clear cannot grow the list without bound. */
+const MAX_MASK_REGIONS = 4_096;
+/** Path-construction ops whose coordinates feed the running LOCAL path bounds
+ * (used to size a masked `fill`/`stroke`'s region + block fillRect). */
+const PATH_BUILD_OPS = new Set([
+    "beginPath", "closePath", "moveTo", "lineTo", "rect", "roundRect",
+    "arc", "arcTo", "ellipse", "bezierCurveTo", "quadraticCurveTo",
+]);
+/** Paint / image ops whose output is the sensitive pixels a mask block hides. */
+const PAINT_OPS = new Set([
+    "fill", "stroke", "fillRect", "strokeRect", "drawImage", "putImageData",
+]);
+/**
+ * CTM-mutating ops. Inside a mask block these carry NO sensitive content (they
+ * move the pen, they don't paint), but they MUST still be recorded: the masked
+ * shapes we recolor/replace are emitted in LOCAL space, so replay needs the same
+ * live transform to place them where the keyframe-blank region (computed under
+ * the live CTM) actually is. Dropping them (the Round-1 behavior) painted the
+ * redaction at the WRONG device location while the blank covered the right one →
+ * under-blank/leak. [audit M-NEW-3] `save`/`restore` are handled separately
+ * because they also drive the keyframe shadow-state stack. */
+const TRANSFORM_OPS = new Set([
+    "setTransform", "transform", "translate", "scale", "rotate", "resetTransform",
+]);
+/** Axis-aligned union (bounding box) of a set of regions — used to coalesce the
+ * masked-region list when it overflows the cap, bounding memory without dropping
+ * any coverage. */
+function unionRegion(rs) {
+    if (rs.length === 0)
+        return null;
+    let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
+    for (const r of rs) {
+        if (r.x < minX)
+            minX = r.x;
+        if (r.y < minY)
+            minY = r.y;
+        if (r.x + r.w > maxX)
+            maxX = r.x + r.w;
+        if (r.y + r.h > maxY)
+            maxY = r.y + r.h;
+    }
+    return { x: minX, y: minY, w: maxX - minX, h: maxY - minY };
+}
+/**
+ * A26 — per-recorder asset-metadata cap. Dynamic image sources (videos, and the
+ * internal buffer canvases frameworks like Konva paint through) are captured
+ * PER DRAW, so on the main-thread manager path (retainAssets:false) the `assets`
+ * id→metadata map grows one tiny entry per drawn frame for the controller's
+ * whole lifetime — a 30-min session at 30fps would accumulate ~50k entries that
+ * nothing ever reads again (their payloads already shipped live via onAssetData).
+ * We bound the map LRU-style: once it exceeds the cap, the oldest entries are
+ * evicted (Map keeps insertion order). The worker-relay path (retainAssets:true)
+ * is NOT evicted here — it transfers the retained bitmaps/ImageData at stop and
+ * its recorders are short-lived per batch.
+ */
+const MAX_ASSET_ENTRIES = 2_048;
+const recorders = new WeakMap();
+/** Contexts the recorder infrastructure itself owns (keyframe scratch
+ * canvases etc.) — excluded from untracked-context discovery. */
+const ignoredContexts = new WeakSet();
+export function ignore2DContext(ctx) {
+    ignoredContexts.add(ctx);
+}
+/** Fires (throttled per context by the subscriber) when a PATCHED method runs
+ * on a 2D context that has no recorder — i.e. a context created before the
+ * hooks were installed. Lets the manager attach mid-stream. */
+let untrackedNotify = null;
+export function setUntracked2DContextNotifier(fn) {
+    untrackedNotify = fn;
+}
+/**
+ * Return the active recorder bound to a 2D context, or undefined when the
+ * context isn't being recorded (recording off, not yet attached, or a
+ * non-recorded canvas). Used by the `maskCanvasDraws` public API to toggle
+ * per-draw masking. Never throws.
+ */
+export function recorderForContext(ctx) {
+    if (!ctx)
+        return undefined;
+    return recorders.get(ctx) ?? autoRecorders.get(ctx);
+}
+/** Fires whenever getContext() succeeds for ANY context type (after
+ * contextInfo is recorded) — the manager's late-context discovery path. */
+let contextCreatedNotify = null;
+export function setContextCreatedNotifier(fn) {
+    contextCreatedNotify = fn;
+}
+let autoConfig = null;
+const autoRecorders = new Map();
+const contextInfo = new WeakMap();
+export function getContextInfo(canvas) {
+    return contextInfo.get(canvas);
+}
+export function setAutoAttach(config) {
+    autoConfig = config;
+    if (config)
+        autoRecorders.clear();
+}
+/** Drop the auto-created (still-buffering) recorder for one canvas the
+ * manager decided not to record — e.g. invisible canvases (Konva hit
+ * canvases) whose BufferSink would otherwise grow unbounded while they keep
+ * drawing. No-op once a strategy sink is bound. */
+export function releaseAutoRecorder(canvas) {
+    const rec = autoRecorders.get(canvas);
+    if (rec && !rec.bound) {
+        recorders.delete(rec.rawCtx);
+        autoRecorders.delete(canvas);
+    }
+}
+/** Drop auto-created recorders that no strategy bound (e.g. probe canvases). */
+export function pruneUnboundRecorders() {
+    for (const [canvas, rec] of autoRecorders) {
+        if (!rec.bound) {
+            recorders.delete(rec.rawCtx);
+            autoRecorders.delete(canvas);
+        }
+    }
+}
+export class ContextRecorder {
+    ctx;
+    sink;
+    now;
+    assetMode;
+    encodeImage;
+    assets = new Map();
+    /** dedupe static image sources by identity */
+    assetBySource = new WeakMap();
+    // [audit B6] In-flight encode promises. A SET (not an array) with auto-removal
+    // so it stays bounded to ACTUALLY-pending work: a canvas that captures a
+    // dynamic per-frame source (e.g. a framework's internal buffer canvas, which
+    // emits no governor signal and so never demotes) would otherwise grow this by
+    // one retained promise PER FRAME for the whole session (~30/s). settle() awaits
+    // a snapshot.
+    pendingEncodes = new Set();
+    props = {};
+    stack = [];
+    /** accumulated main-thread ms spent in capture code */
+    cpuMs = 0;
+    /** a strategy sink has been bound (vs still buffering) */
+    bound = false;
+    /** keep bitmaps/ImageData on assets for postMessage transfer (worker path) */
+    retainAssets;
+    constructor(
+    /** main-thread or OffscreenCanvas 2D context */
+    ctx, sink, now, assetMode, encodeImage, opts) {
+        this.ctx = ctx;
+        this.sink = sink;
+        this.now = now;
+        this.assetMode = assetMode;
+        this.encodeImage = encodeImage;
+        this.retainAssets = opts?.retainAssets !== false;
+    }
+    get rawCtx() {
+        return this.ctx;
+    }
+    /** Bind the strategy's sink, draining anything buffered since getContext. */
+    swapSink(sink) {
+        const old = this.sink;
+        this.sink = sink;
+        this.bound = true;
+        if (old instanceof BufferSink) {
+            for (const op of old.ops)
+                sink.onOp(op);
+            for (const a of old.assetEvents)
+                sink.onAssetBytes(a.id, a.bytes, a.t);
+            for (const d of old.assetData)
+                sink.onAssetData?.(d.info, d.payload);
+            for (const n of old.notes)
+                sink.note(n);
+        }
+    }
+    /**
+     * A26: register a captured asset's metadata, evicting the oldest entries when
+     * the per-recorder cap is exceeded (LRU; Map keeps insertion order). Eviction
+     * only happens on the non-retaining manager path — when retainAssets is true
+     * (worker relay) the full set is transferred at stop, so we never evict there.
+     */
+    addAsset(id, asset) {
+        this.assets.set(id, asset);
+        if (!this.retainAssets && this.assets.size > MAX_ASSET_ENTRIES) {
+            const overflow = this.assets.size - MAX_ASSET_ENTRIES;
+            let removed = 0;
+            for (const key of this.assets.keys()) {
+                if (removed >= overflow)
+                    break;
+                this.assets.delete(key);
+                removed++;
+            }
+        }
+    }
+    // -- called from prototype patches --------------------------------------
+    /**
+     * Draw-site stamp id for the NEXT recorded op (Phase 3b). Set synchronously
+     * by __sfDrawSite (canvasManager) when stamped app code calls
+     * `__sfds(ctx, id).method(...)` — the method call runs immediately after, in
+     * the same task, so a single pending slot is race-free. Consumed + cleared
+     * by the next recordCall/recordSet.
+     */
+    pendingSiteId;
+    /**
+     * A13 — privacy text redactor. When set (canvasManager installs it for
+     * "redact" and "normal" canvases that have a privacy rule / content-detection
+     * flag off), the FIRST string argument of `fillText` / `strokeText` is passed
+     * through this fn BEFORE serialization, so the original drawn text never
+     * reaches the command stream. Returns the (possibly masked) replacement
+     * string; non-string args are never handed to it. Left undefined on the hot
+     * path for canvases with no privacy rule, so normal recording pays nothing.
+     */
+    textRedactor;
+    /**
+     * Runtime per-draw masking (the `maskCanvasDraws` public API). While
+     * `maskDepth > 0`, EVERY recorded op is DROPPED — `fillRect`, path
+     * construction (`moveTo`/`lineTo`/`arc`/…), `fill`/`stroke`, `fillText`,
+     * `drawImage`, state setters — so the sensitive shape/geometry/text the app
+     * draws inside the wrapped block never reaches the command stream. This is the
+     * only way to sanitize SPECIFIC content within a canvas: DOM/selector masking
+     * is whole-`<canvas>` only (there are no sub-canvas elements to target).
+     */
+    maskDepth = 0;
+    /**
+     * Set true the first time a draw is masked by `maskDepth`. The canvas manager
+     * polls this to keep the canvas in command mode (a masked canvas must never
+     * demote to video — video frames can't be cheaply region-blanked) and to wire
+     * `maskedRegions` into the keyframe capturer so the real pixels of masked
+     * content are blanked on every keyframe. Replay shows the baked redaction
+     * (recolored shapes / asterisks / bars) from the command stream.
+     */
+    hasMaskedDraws = false;
+    /**
+     * Resolved redaction style for masked ops — how masked TEXT (asterisks/bar) and
+     * SHAPES (color/block/remove) are baked into the command stream. Set by the
+     * manager from the global `maskCanvasText` config, and overridden per-block by
+     * `maskCanvasDraws(ctx, fn, opts)`.
+     */
+    redactStyle = DEFAULT_REDACT_STYLE;
+    /**
+     * Per-block "text only" flag (maskCanvasDraws `keepShapes:true`). While set
+     * inside a mask block, only TEXT ops are redacted; shapes/geometry are recorded
+     * normally. Default false (mask everything in the block).
+     */
+    textOnlyMask = false;
+    /**
+     * Accumulated device-space (canvas-pixel) bounding boxes of masked content
+     * since the last full-canvas clear. The keyframe capturer fills each with
+     * REDACTION_COLOR before encoding so the real masked pixels never ship. Bounded
+     * (oldest evicted past the cap) so an incremental canvas that never clears
+     * cannot grow it without limit.
+     */
+    maskedRegions = [];
+    /**
+     * Set when a masked op's keyframe-blank region CANNOT be computed (a degenerate
+     * transform, or geometry with no trackable bounds such as `ctx.fill(path2d)`).
+     * The redaction is already baked into the command stream, so to avoid leaking
+     * the real pixels the manager polls this and SUPPRESSES pixel keyframes for the
+     * canvas (command-only replay) — safer than blanking the whole canvas on every
+     * keyframe. [audit C-NEW-1 / C2 / M-NEW-2]
+     */
+    keyframeUnsafe = false;
+    /** Running LOCAL-space (pre-transform) path bounds for the in-progress path,
+     * used to size the masked-region bbox + the synthetic block fillRect for
+     * `fill`/`stroke` inside a mask block. Reset on beginPath. */
+    maskPathBounds = null;
+    takePendingSiteId() {
+        const id = this.pendingSiteId;
+        this.pendingSiteId = undefined;
+        return id;
+    }
+    recordCall(op, args) {
+        // maskCanvasDraws: every op issued inside a runtime mask region is REDACTED
+        // per the resolved redactStyle (shapes recolored / blocked / removed, text
+        // asterisked / barred) and its bbox tracked for keyframe region-blanking —
+        // the sensitive original never enters the command stream. Checked FIRST so it
+        // also covers video-demoted canvases (which a masked canvas never becomes).
+        if (this.maskDepth > 0) {
+            this.maskCall(op, args);
+            this.pendingSiteId = undefined;
+            return;
+        }
+        // Video-mode dirtiness only: zero serialize/encode cost.
+        if (this.sink instanceof DiscardSink) {
+            this.sink.onOp(DIRTY_OP);
+            this.pendingSiteId = undefined;
+            return;
+        }
+        // A clearRect wipes pixels in its rect — drop masked regions it fully covers
+        // so the next keyframe doesn't blank now-empty areas (handles full, sub-rect,
+        // and translated/rotated clears).
+        if (op === "clearRect" && this.maskedRegions.length > 0)
+            this.clipRegionsToClear(args);
+        const t0 = performance.now();
+        const t = this.now();
+        // A13: redact the rendered text of fillText/strokeText before it is
+        // serialized. Guarded so the common (non-text, or no-redactor) path is
+        // untouched: only allocates a replacement args array when we actually mask a
+        // string. The first arg of fillText/strokeText is the text; args 2/3 are
+        // x/y coords and pass through untouched.
+        if (this.textRedactor !== undefined && (op === "fillText" || op === "strokeText")) {
+            const first = args[0];
+            if (typeof first === "string") {
+                const masked = this.textRedactor(first);
+                if (masked !== first) {
+                    // Track the ORIGINAL text's bbox so the keyframe blanks its real pixels
+                    // (the command stream draws asterisks / a bar on top of the blank).
+                    this.pushMaskRegion(this.textRegionFor(first, args));
+                    if (this.redactStyle.text === "bar") {
+                        // bar: drop the glyphs entirely, paint a redaction bar over the box.
+                        this.emitRedactionBlock(this.textLocalRect(first, args));
+                        this.cpuMs += performance.now() - t0;
+                        return;
+                    }
+                    args = args.slice();
+                    args[0] = masked;
+                }
+            }
+        }
+        if (op === "save") {
+            // A34: the saved frame needs an INDEPENDENT props snapshot because the
+            // live `this.props` keeps mutating after the save — this copy is required.
+            this.stack.push({ props: { ...this.props }, transform: this.readTransform() });
+        }
+        else if (op === "restore") {
+            // A34: the popped frame is discarded here, so ADOPT its props object as
+            // the new live props instead of spreading a copy ({ ...frame.props }).
+            // Nothing else references the popped frame, so future props mutations
+            // cannot corrupt any stack entry. Saves one object allocation per
+            // restore with byte-identical recorded output.
+            const frame = this.stack.pop();
+            if (frame)
+                this.props = frame.props;
+        }
+        const sfId = this.takePendingSiteId();
+        // A34: serialize via a plain loop (serializeArgs) rather than
+        // args.map(arrow) — .map allocates a fresh closure object on EVERY recorded
+        // call (the hot path runs per draw command). The loop also fast-paths
+        // all-primitive arg lists (the common case: fillRect/lineTo/transform).
+        const rec = { t, op, args: this.serializeArgs(args, t) };
+        if (sfId)
+            rec.sfId = sfId;
+        this.sink.onOp(rec);
+        this.cpuMs += performance.now() - t0;
+    }
+    /**
+     * A34 — hot-path arg serialization. A plain loop instead of
+     * `args.map((a) => this.serializeArg(a, t))` to avoid allocating a new arrow
+     * closure on every recorded call. Primitives (number / string / boolean /
+     * null / undefined) are handled inline so the common all-primitive draw call
+     * (fillRect, lineTo, setTransform…) never enters the slower object-dispatch
+     * branch of serializeArg. Produces an array byte-identical to the old .map
+     * output for the codec — verified by canvasHotPathAlloc.test.ts. The output
+     * array itself is freshly allocated (the BufferSink / worker paths retain it,
+     * so it cannot be pooled), but the per-call closure garbage is eliminated.
+     */
+    serializeArgs(args, t) {
+        const n = args.length;
+        const out = new Array(n);
+        for (let i = 0; i < n; i++) {
+            const a = args[i];
+            switch (typeof a) {
+                case "number":
+                    out[i] = Number.isFinite(a) ? a : 0;
+                    break;
+                case "string":
+                    out[i] = a;
+                    break;
+                case "boolean":
+                    out[i] = a;
+                    break;
+                case "undefined":
+                    out[i] = null;
+                    break;
+                default: out[i] = this.serializeArg(a, t); // null + objects
+            }
+        }
+        return out;
+    }
+    recordSet(prop, value) {
+        // maskCanvasDraws: inside a mask region, drop state setters — masked shapes are
+        // recolored to REDACTION_COLOR at paint time (maskCall), so the app's real
+        // fill/stroke styles must not reach the stream. (this.props intentionally
+        // retains the PRE-block value so post-block draws re-sync.) EXCEPTION: a
+        // keepShapes block (textOnlyMask) records shapes — and their styles — normally;
+        // only its text is redacted.
+        if (this.maskDepth > 0 && !this.textOnlyMask) {
+            this.hasMaskedDraws = true;
+            this.pendingSiteId = undefined;
+            return;
+        }
+        if (this.maskDepth > 0)
+            this.hasMaskedDraws = true; // keepShapes: flag but record
+        if (this.sink instanceof DiscardSink) {
+            this.sink.onOp(DIRTY_OP);
+            this.pendingSiteId = undefined;
+            return;
+        }
+        const t0 = performance.now();
+        const t = this.now();
+        const v = this.serializeArg(value, t);
+        this.props[prop] = v;
+        const sfId = this.takePendingSiteId();
+        const rec = { t, op: prop, args: [v], setter: true };
+        if (sfId)
+            rec.sfId = sfId;
+        this.sink.onOp(rec);
+        this.cpuMs += performance.now() - t0;
+    }
+    // -- maskCanvasDraws redaction baking -------------------------------------
+    //
+    // Inside a mask block (maskDepth > 0) every op is rewritten per `redactStyle`
+    // and its device-space bbox accumulated into `maskedRegions` so the keyframe
+    // capturer can blank the real pixels. Nothing here ever touches the live
+    // canvas — only the recorded command stream + the region list.
+    /** Redact one op issued inside a mask block. */
+    maskCall(op, args) {
+        this.hasMaskedDraws = true;
+        if (this.sink instanceof DiscardSink) {
+            this.sink.onOp(DIRTY_OP);
+            return;
+        }
+        const style = this.redactStyle;
+        const isText = op === "fillText" || op === "strokeText";
+        // keepShapes: only text is redacted; shapes/geometry recorded normally
+        // (recordPassthrough already records transforms + maintains the save/restore
+        // shadow stack, so those are covered there).
+        if (this.textOnlyMask && !isText) {
+            this.recordPassthrough(op, args);
+            return;
+        }
+        // [audit M-NEW-3] Transform + save/restore ops carry no sensitive pixels but
+        // MUST be recorded inside a (full) mask block: the recolored / replacement
+        // shapes are emitted in LOCAL space, so replay needs the same CTM to land
+        // them where the keyframe-blank region (computed under the LIVE CTM) is.
+        // recordPassthrough also keeps `this.stack` in sync so a keyframe taken mid
+        // mask-block snapshots the correct save-stack depth + per-frame transform.
+        if (op === "save" || op === "restore" || TRANSFORM_OPS.has(op)) {
+            this.recordPassthrough(op, args);
+            return;
+        }
+        if (isText) {
+            const first = args[0];
+            if (typeof first !== "string")
+                return;
+            this.pushMaskRegion(this.textRegionFor(first, args));
+            if (style.text === "asterisks") {
+                const a = args.slice();
+                a[0] = maskAllText(first);
+                this.emitSynthCall(op, a);
+            }
+            else {
+                // bar: drop the glyphs, paint a redaction bar over the text box.
+                this.emitRedactionBlock(this.textLocalRect(first, args));
+            }
+            return;
+        }
+        if (PATH_BUILD_OPS.has(op)) {
+            this.updatePathBounds(op, args);
+            // 'color' keeps the geometry (recolored at paint time); 'block'/'remove'
+            // drop it (the block fillRect / nothing replaces it).
+            if (style.shape === "color")
+                this.emitSynthCall(op, args);
+            return;
+        }
+        if (PAINT_OPS.has(op)) {
+            this.pushMaskRegion(this.shapeRegion(op, args));
+            const drop = style.shape === "remove" || op === "putImageData";
+            if (!drop) {
+                if (style.shape === "color" &&
+                    (op === "fill" || op === "stroke" || op === "fillRect" || op === "strokeRect")) {
+                    // Recolor the SAME geometry: bracket the real paint in a redaction
+                    // color via save/restore so prop state is untouched afterward.
+                    const colorProp = op === "stroke" || op === "strokeRect" ? "strokeStyle" : "fillStyle";
+                    this.emitSynthCall("save", []);
+                    this.emitSynthSetter(colorProp, REDACTION_COLOR);
+                    this.emitSynthCall(op, op === "fill" || op === "stroke" ? [] : args);
+                    this.emitSynthCall("restore", []);
+                }
+                else {
+                    // 'block' (and 'color' fallback for images): one redaction block.
+                    this.emitRedactionBlock(this.shapeLocalRect(op, args));
+                }
+            }
+            if (op === "fill" || op === "stroke")
+                this.maskPathBounds = null;
+            return;
+        }
+        // Any other op inside a mask block (clip, setLineDash, clearRect, …) — drop.
+    }
+    /** Record a shape op normally from inside a keepShapes block (text-only mask).
+     * A trimmed recordCall tail: maintains the save/restore shadow stack so later
+     * keyframe state snapshots stay correct. */
+    recordPassthrough(op, args) {
+        if (this.sink instanceof DiscardSink) {
+            this.sink.onOp(DIRTY_OP);
+            return;
+        }
+        const t = this.now();
+        if (op === "save") {
+            this.stack.push({ props: { ...this.props }, transform: this.readTransform() });
+        }
+        else if (op === "restore") {
+            const f = this.stack.pop();
+            if (f)
+                this.props = f.props;
+        }
+        this.sink.onOp({ t, op, args: this.serializeArgs(args, t) });
+    }
+    /** Push a non-empty masked region. Past the cap, COALESCE to the union bbox
+     * rather than evicting the oldest — dropping a region would leave its real
+     * (masked) pixels un-blanked on the kept keyframe (a leak). Coalescing
+     * over-blanks within the union but never under-blanks (privacy > fidelity for
+     * a pathological canvas that masks >cap draws without ever clearing). */
+    pushRegion(r) {
+        if (!r || !(r.w > 0 && r.h > 0))
+            return;
+        this.maskedRegions.push(r);
+        if (this.maskedRegions.length > MAX_MASK_REGIONS)
+            this.coalesceRegions();
+    }
+    /**
+     * Bound the region list past the cap WITHOUT dropping coverage (dropping would
+     * leak) and WITHOUT a one-way ratchet to whole-canvas (a single growing union
+     * could never be cleared by a partial clearRect — audit C-NEW-2). Snap regions
+     * to a coarse GRID of tiles: bounded count, full coverage, and a later clear can
+     * still drop individual tiles (clipRegionsToClear). Falls back to a single union
+     * only when the canvas size is unknown (worker/synthetic ctx).
+     */
+    coalesceRegions() {
+        const cs = this.canvasSize();
+        if (!cs) {
+            const u = unionRegion(this.maskedRegions);
+            this.maskedRegions.length = 0;
+            if (u)
+                this.maskedRegions.push(u);
+            return;
+        }
+        // [audit H3] TILE must be ADAPTIVE: a fixed 64px on an 8192×4096 canvas grids
+        // to 128×64 = 8192 tiles > MAX_MASK_REGIONS, leaving the list permanently
+        // over-cap (re-coalescing forever, unbounded above). Grow the tile size until
+        // the full-canvas grid fits the cap, so cols*rows ≤ MAX_MASK_REGIONS for ANY
+        // canvas size (privacy unchanged — coarser tiles still over-blank, never
+        // under-blank; a later clearRect can still drop whole tiles).
+        let TILE = 64;
+        const fits = () => Math.ceil(cs.w / TILE) * Math.ceil(cs.h / TILE) <= MAX_MASK_REGIONS;
+        while (!fits())
+            TILE *= 2;
+        // Clamp every tile index to the IN-BOUNDS grid: a region's span is clamped to
+        // [0, maxCol] / [0, maxRow] so out-of-bounds masked geometry (a draw partly
+        // off-canvas, or a tiny <TILE canvas — audit H4) snaps onto an in-bounds tile
+        // instead of minting an un-droppable tile no clearRect can ever hit.
+        const cols = Math.max(1, Math.ceil(cs.w / TILE));
+        const maxCol = cols - 1;
+        const maxRow = Math.max(0, Math.ceil(cs.h / TILE) - 1);
+        const tiles = new Map();
+        for (const reg of this.maskedRegions) {
+            // c1/r1 use the LAST touched pixel (x+w-1), not x+w: a region exactly
+            // filling tile col k spans device px [k*TILE, (k+1)*TILE), whose last pixel
+            // is (k+1)*TILE-1 → col k. Using floor((x+w)/TILE) claimed col k+1 too
+            // (a boundary double-count) which (a) over-blanked an adjacent untouched
+            // tile and (b) broke idempotency — re-coalescing a grid of tiles GREW the
+            // set. The -1 makes coalesce a fixed point on already-tiled input. [audit H3]
+            const c0 = Math.min(maxCol, Math.max(0, Math.floor(reg.x / TILE)));
+            const c1 = Math.min(maxCol, Math.max(c0, Math.floor((reg.x + reg.w - 1) / TILE)));
+            const r0 = Math.min(maxRow, Math.max(0, Math.floor(reg.y / TILE)));
+            const r1 = Math.min(maxRow, Math.max(r0, Math.floor((reg.y + reg.h - 1) / TILE)));
+            for (let cy = r0; cy <= r1; cy++) {
+                for (let cx = c0; cx <= c1; cx++) {
+                    const key = cy * cols + cx;
+                    if (!tiles.has(key)) {
+                        const tx = cx * TILE, ty = cy * TILE;
+                        // Clamp the tile's far edge to the canvas so an edge tile on a small
+                        // (or non-multiple-of-TILE) canvas never extends PAST the canvas —
+                        // otherwise a full-canvas clearRect (≤ canvas size) couldn't fully
+                        // contain it and it would be an un-droppable permanent over-blank
+                        // (audit H4). A clamped tile is still tile-aligned at its origin.
+                        tiles.set(key, { x: tx, y: ty, w: Math.min(TILE, cs.w - tx), h: Math.min(TILE, cs.h - ty) });
+                    }
+                }
+            }
+        }
+        this.maskedRegions.length = 0;
+        for (const t of tiles.values())
+            this.maskedRegions.push(t);
+    }
+    /** Push the keyframe-blank region for a MASKED op. A redaction was already
+     * baked into the command stream, so the pixels MUST be blanked — if the bbox
+     * couldn't be computed (degenerate transform, or unbounded geometry like
+     * `ctx.fill(path2d)` / a zero-area paint), flag the canvas keyframe-UNSAFE so
+     * the manager suppresses pixel keyframes (command-only replay) rather than
+     * blanking the whole canvas on every keyframe. [audit C-NEW-1 / M-NEW-2] */
+    pushMaskRegion(r) {
+        if (r && r.w > 0 && r.h > 0) {
+            this.pushRegion(r);
+            return;
+        }
+        this.keyframeUnsafe = true;
+    }
+    /** Clear accumulated masked regions — called by the manager when the canvas is
+     * resized (a `canvas.width`/`height` assignment, or a `reset()`, wipes all
+     * pixels, so the prior regions are stale and would over-blank fresh content).
+     *
+     * [audit H1 / Round 2] Also clears `keyframeUnsafe`. A full-canvas clear/resize
+     * wipes whatever unboundable masked content tripped the flag, so the canvas is
+     * safe to keyframe again. Without this, a canvas that hit ONE degenerate-bbox
+     * mask op and was THEN resized still suppressed pixel keyframes for life. NOTE:
+     * this is only effective when the resize lands BEFORE the pump reads the flag —
+     * once `suppressPixelCapture` latches `ctl.pixelSuppressed` (tearing down the
+     * keyframe capturer + any video encoder), there is no cheap resurrection, so an
+     * already-suppressed controller stays suppressed by design (a deliberate
+     * one-way safety tradeoff — resurrecting mid-session risks shipping the very
+     * pixels we suppressed). Resetting the flag here keeps the recorder-side state
+     * honest and avoids a needless suppression for the pre-pump resize race. */
+    resetMaskedRegions() {
+        this.maskedRegions.length = 0;
+        this.maskPathBounds = null;
+        this.keyframeUnsafe = false;
+    }
+    /** A clearRect wiped the pixels in its (device-space) rect — drop every masked
+     * region FULLY CONTAINED by it so the next keyframe doesn't blank now-empty
+     * areas. Works for a full-canvas clear (all regions inside → all dropped, i.e.
+     * a reset), a sub-rect clear, AND a TRANSLATED/SCALED clear (the cleared rect is
+     * wherever it actually landed in device space). A region that only PARTIALLY
+     * overlaps the cleared rect is KEPT — its still-painted part must stay blanked
+     * (over-blank the cleared part; never leak). [audit M1/M2]
+     *
+     * [audit H5 / Round 2] Containment is only sound when the cleared rect is
+     * AXIS-ALIGNED in device space. Under a ROTATED/SKEWED CTM, clearRect clears a
+     * PARALLELOGRAM, but `transformedBox` gives its AABB — which is strictly LARGER
+     * than the true cleared area. A masked region tucked into an AABB corner that
+     * the rotated clear never actually touched would be (wrongly) judged contained
+     * and DROPPED → its still-painted pixels leak on the kept keyframe. The clear's
+     * AABB over-claiming coverage is the dangerous direction (dropping a region is
+     * irreversible), so for a non-axis-aligned CTM we DROP NOTHING — the regions
+     * stay and over-blank the (now-cleared) area on the next keyframe, which is
+     * privacy-safe. A pure translate/scale/flip (b==0 && c==0, or a==0 && d==0)
+     * keeps the exact-rect guarantee and still clips. */
+    clipRegionsToClear(args) {
+        if (this.maskedRegions.length === 0)
+            return;
+        const m = this.getMat();
+        if (!m)
+            return;
+        // Axis-aligned device coverage iff the CTM has no rotation/skew: either
+        // (b==0,c==0) — translate/scale/flip — or (a==0,d==0) — an exact 90° rotation
+        // mapping the rect to another axis-aligned rect. Anything else is a
+        // parallelogram whose AABB over-claims → unsafe to use for dropping.
+        const axisAligned = (m.b === 0 && m.c === 0) || (m.a === 0 && m.d === 0);
+        if (!axisAligned)
+            return; // over-blank rather than risk a leak
+        const n = (v) => Number(v) || 0;
+        const x = n(args[0]), y = n(args[1]);
+        // The cleared rect must use the clear's TRUE device coverage (pad 0). Using
+        // the +1px-padded rect would over-claim coverage and drop a masked region
+        // whose 1px antialiased halo is NOT actually cleared → a sliver leak. [M-NEW-1]
+        const cleared = transformedBox(x, y, x + n(args[2]), y + n(args[3]), m, 0);
+        if (!cleared)
+            return;
+        const cx1 = cleared.x + cleared.w, cy1 = cleared.y + cleared.h;
+        const kept = this.maskedRegions.filter((r) => !(r.x >= cleared.x && r.y >= cleared.y && r.x + r.w <= cx1 && r.y + r.h <= cy1));
+        if (kept.length !== this.maskedRegions.length) {
+            this.maskedRegions.length = 0;
+            for (const r of kept)
+                this.maskedRegions.push(r);
+        }
+    }
+    /** Emit a synthetic recorded method call (bypasses the maskDepth gate). */
+    emitSynthCall(op, args) {
+        const t = this.now();
+        this.sink.onOp({ t, op, args: this.serializeArgs(args, t) });
+    }
+    /** Emit a synthetic recorded property set (a color override). */
+    emitSynthSetter(prop, value) {
+        const t = this.now();
+        this.sink.onOp({ t, op: prop, args: [value], setter: true });
+    }
+    /** Emit a redaction block (save → fillStyle=REDACTION_COLOR → fillRect →
+     * restore) over a LOCAL-space rect; replay applies the current transform. */
+    emitRedactionBlock(rect) {
+        if (!rect || rect.w === 0 || rect.h === 0)
+            return;
+        this.emitSynthCall("save", []);
+        this.emitSynthSetter("fillStyle", REDACTION_COLOR);
+        this.emitSynthCall("fillRect", [rect.x, rect.y, rect.w, rect.h]);
+        this.emitSynthCall("restore", []);
+    }
+    /** Update the running LOCAL (user-space) path bounds for a path-build op. */
+    updatePathBounds(op, args) {
+        if (op === "beginPath") {
+            this.maskPathBounds = null;
+            return;
+        }
+        const n = (v) => Number(v) || 0;
+        const ext = (x, y) => {
+            if (!Number.isFinite(x) || !Number.isFinite(y))
+                return;
+            const b = this.maskPathBounds ?? { minX: x, minY: y, maxX: x, maxY: y };
+            b.minX = Math.min(b.minX, x);
+            b.minY = Math.min(b.minY, y);
+            b.maxX = Math.max(b.maxX, x);
+            b.maxY = Math.max(b.maxY, y);
+            this.maskPathBounds = b;
+        };
+        switch (op) {
+            case "moveTo":
+            case "lineTo":
+                ext(n(args[0]), n(args[1]));
+                break;
+            case "rect":
+            case "roundRect":
+                ext(n(args[0]), n(args[1]));
+                ext(n(args[0]) + n(args[2]), n(args[1]) + n(args[3]));
+                break;
+            case "arc": {
+                const r = n(args[2]);
+                ext(n(args[0]) - r, n(args[1]) - r);
+                ext(n(args[0]) + r, n(args[1]) + r);
+                break;
+            }
+            case "ellipse": {
+                const rx = n(args[2]), ry = n(args[3]);
+                ext(n(args[0]) - rx, n(args[1]) - ry);
+                ext(n(args[0]) + rx, n(args[1]) + ry);
+                break;
+            }
+            case "arcTo":
+            case "quadraticCurveTo":
+                ext(n(args[0]), n(args[1]));
+                ext(n(args[2]), n(args[3]));
+                break;
+            case "bezierCurveTo":
+                ext(n(args[0]), n(args[1]));
+                ext(n(args[2]), n(args[3]));
+                ext(n(args[4]), n(args[5]));
+                break;
+        }
+    }
+    /** LOCAL (user-space) rect of a paint op — for the block fillRect. */
+    shapeLocalRect(op, args) {
+        const n = (v) => Number(v) || 0;
+        if (op === "fillRect" || op === "strokeRect")
+            return { x: n(args[0]), y: n(args[1]), w: n(args[2]), h: n(args[3]) };
+        if (op === "fill" || op === "stroke") {
+            const b = this.maskPathBounds;
+            return b ? { x: b.minX, y: b.minY, w: b.maxX - b.minX, h: b.maxY - b.minY } : null;
+        }
+        if (op === "drawImage")
+            return this.drawImageDest(args);
+        return null;
+    }
+    /** DEVICE-space region of a paint op (its accumulated keyframe-blank bbox). */
+    shapeRegion(op, args) {
+        const n = (v) => Number(v) || 0;
+        if (op === "putImageData") {
+            // putImageData ignores the CTM — its dest is already device-space.
+            const id = args[0];
+            const w = n(id?.width), h = n(id?.height);
+            if (!(w > 0 && h > 0))
+                return null;
+            return { x: n(args[1]), y: n(args[2]), w, h };
+        }
+        const m = this.getMat();
+        const local = this.shapeLocalRect(op, args);
+        if (!m || !local)
+            return null;
+        return rectRegion(local.x, local.y, local.w, local.h, m);
+    }
+    /** Dest rect (user space) of a drawImage in any of its 3/5/9-arg forms. */
+    drawImageDest(args) {
+        const n = (v) => Number(v) || 0;
+        if (args.length >= 9)
+            return { x: n(args[5]), y: n(args[6]), w: n(args[7]), h: n(args[8]) };
+        if (args.length >= 5)
+            return { x: n(args[1]), y: n(args[2]), w: n(args[3]), h: n(args[4]) };
+        if (args.length >= 3) {
+            const img = args[0];
+            return { x: n(args[1]), y: n(args[2]), w: n(img?.width), h: n(img?.height) };
+        }
+        return null;
+    }
+    /** Device-space region of a drawn-text arg (the keyframe-blank bbox). The box
+     * comes from the glyph ADVANCE width, so it's padded proportionally to the font
+     * size AND the transform's scale to cover italic / emoji ink overhang in device
+     * space (under-covering would leak a glyph sliver on the kept keyframe). */
+    textRegionFor(text, args) {
+        const m = this.getMat();
+        if (!m)
+            return null;
+        const scale = Math.max(Math.hypot(m.a, m.b), Math.hypot(m.c, m.d)) || 1;
+        // Proportional to font size + transform scale (to cover ink overhang), but
+        // capped so a pathological `font:"999999px"` can't produce an absurd region.
+        // [audit H8] The cap is font-relative, not a flat 256px: a legit large font
+        // (e.g. 2000px under 2x scale → 4000px device em) can overhang its advance box
+        // by well over 256px on emoji / script glyphs, so a flat cap would under-blank
+        // and leak a glyph edge. We allow up to ~half the scaled em (covers realistic
+        // overhang) with a 256px floor, while the `fontSizePx()*0.15*scale` base keeps
+        // the common case tight. The absolute ceiling stays bounded by the em size, so
+        // a `999999px` font still can't blow past ~its own size (clipped to canvas on
+        // fill anyway). Privacy: over-covering is always safe; under-covering leaks.
+        const fs = this.fontSizePx();
+        const cap = Math.max(256, fs * 0.5 * scale);
+        const pad = Math.min(Math.max(2, fs * 0.15 * scale), cap);
+        return textRegion(this.textMetrics(text, args), m, pad);
+    }
+    /** LOCAL-space rect of a drawn-text arg (for a bar / block). */
+    textLocalRect(text, args) {
+        const b = textLocalBox(this.textMetrics(text, args));
+        return { x: b.x0, y: b.y0, w: b.x1 - b.x0, h: b.y1 - b.y0 };
+    }
+    /** Measure a drawn-text arg (width/ascent/descent + align/baseline), falling
+     * back to a font-size approximation when the context has no measureText (worker
+     * OffscreenCanvas always does; the test fake ctx does not). */
+    textMetrics(text, args) {
+        const x = Number(args[1]) || 0, y = Number(args[2]) || 0;
+        const ctx = this.ctx;
+        let width = NaN, ascent = NaN, descent = NaN;
+        let align, baseline;
+        if (typeof ctx.measureText === "function") {
+            try {
+                const mt = ctx.measureText(text);
+                width = mt.width;
+                ascent = mt.actualBoundingBoxAscent;
+                descent = mt.actualBoundingBoxDescent;
+                align = ctx.textAlign;
+                baseline = ctx.textBaseline;
+            }
+            catch { /* fall through to approximation */ }
+        }
+        const fs = this.fontSizePx();
+        if (!Number.isFinite(width))
+            width = text.length * fs * 0.6;
+        if (!Number.isFinite(ascent) || ascent <= 0)
+            ascent = fs * 0.8;
+        if (!Number.isFinite(descent) || descent < 0)
+            descent = fs * 0.2;
+        if (align === undefined && typeof this.props.textAlign === "string")
+            align = this.props.textAlign;
+        if (baseline === undefined && typeof this.props.textBaseline === "string")
+            baseline = this.props.textBaseline;
+        return { width, ascent, descent, x, y, align, baseline };
+    }
+    /** Parse the px size from the recorded `font` prop (fallback 12). */
+    fontSizePx() {
+        const f = this.props.font;
+        if (typeof f === "string") {
+            const mm = f.match(/(\d+(?:\.\d+)?)px/);
+            if (mm)
+                return parseFloat(mm[1]);
+        }
+        return 12;
+    }
+    /** The canvas backing the context (null for the test fake / detached ctx). */
+    canvasSize() {
+        const c = this.ctx.canvas;
+        if (c && Number(c.width) > 0 && Number(c.height) > 0)
+            return { w: Number(c.width), h: Number(c.height) };
+        return null;
+    }
+    /** Current transform as a plain Mat2D (null when getTransform throws). */
+    getMat() {
+        try {
+            const m = this.ctx.getTransform();
+            return { a: m.a, b: m.b, c: m.c, d: m.d, e: m.e, f: m.f };
+        }
+        catch {
+            return null;
+        }
+    }
+    /** per-recorder emission state for cross-context objects */
+    objRefs = new WeakMap();
+    // -- keyframe support -----------------------------------------------------
+    snapshotState() {
+        return {
+            stack: this.stack.map((f) => ({ props: { ...f.props }, transform: [...f.transform] })),
+            current: { props: { ...this.props }, transform: this.readTransform() },
+        };
+    }
+    async settle() {
+        // [audit B12] Loop-drain so an encode registered during the await is also
+        // awaited (teardown detaches before settle, so in practice one pass suffices).
+        while (this.pendingEncodes.size)
+            await Promise.all([...this.pendingEncodes]);
+    }
+    /** [audit B6] In-flight encode count — exported for tests to assert the set
+     * stays bounded (auto-removes on completion) rather than growing per frame. */
+    pendingEncodeCount() {
+        return this.pendingEncodes.size;
+    }
+    /** [audit B6] Register an in-flight encode so settle() awaits it, and AUTO-REMOVE
+     * it on completion so `pendingEncodes` never grows unbounded over a long session
+     * of per-frame dynamic-source captures. The internal then/finally swallow keeps
+     * the tracking from raising an unhandled rejection (settle still observes the
+     * original promise's outcome via the snapshot). */
+    trackEncode(p) {
+        this.pendingEncodes.add(p);
+        p.then(() => { }, () => { }).finally(() => this.pendingEncodes.delete(p));
+    }
+    readTransform() {
+        const m = this.ctx.getTransform();
+        return [m.a, m.b, m.c, m.d, m.e, m.f];
+    }
+    // -- arg serialization ----------------------------------------------------
+    serializeArg(a, t) {
+        if (a === null)
+            return null;
+        switch (typeof a) {
+            case "number": return Number.isFinite(a) ? a : 0;
+            case "string": return a;
+            case "boolean": return a;
+            case "undefined": return null;
+            case "object": break;
+            default: return { $: "unsupported", kind: typeof a };
+        }
+        const obj = a;
+        if (objectLogs.has(obj))
+            return this.serializeFactoryObject(obj, t);
+        const NativePath2D = getNativePath2D();
+        if (NativePath2D && obj instanceof NativePath2D) {
+            this.sink.note("Path2D created before instrumentation — not serialized");
+            return { $: "unsupported", kind: "Path2D" };
+        }
+        if (Array.isArray(obj))
+            return { $: "arr", v: obj.map((n) => Number(n) || 0) };
+        if (obj instanceof DOMMatrix || obj instanceof DOMMatrixReadOnly) {
+            return { $: "arr", v: [obj.a, obj.b, obj.c, obj.d, obj.e, obj.f] };
+        }
+        if (obj instanceof ImageData)
+            return this.captureImageData(obj, t);
+        if (isImageSource(obj))
+            return this.captureImageSource(obj, t);
+        return { $: "unsupported", kind: obj.constructor?.name ?? "object" };
+    }
+    /**
+     * Factory objects (gradients/patterns/paths) emit lazily into THIS stream
+     * on first use — a __create plus logged method calls; later uses emit only
+     * newly appended calls. Cross-context safe: every stream that references
+     * the object re-creates it locally under the same global id.
+     */
+    serializeFactoryObject(obj, t) {
+        const log = objectLogs.get(obj);
+        let ref = this.objRefs.get(obj);
+        if (!ref) {
+            ref = { id: nextObjId++, emittedCalls: 0 };
+            this.objRefs.set(obj, ref);
+            this.sink.onOp({
+                t, op: "__create", create: true,
+                args: [log.factory, ref.id, ...log.args.map((x) => this.serializeArg(x, t))],
+            });
+        }
+        for (let i = ref.emittedCalls; i < log.calls.length; i++) {
+            const c = log.calls[i];
+            this.sink.onOp({
+                t, op: "__objcall", objcall: true,
+                args: [ref.id, c.method, ...c.args.map((x) => this.serializeArg(x, t))],
+            });
+        }
+        ref.emittedCalls = log.calls.length;
+        return { $: "obj", id: ref.id };
+    }
+    captureImageData(d, t) {
+        const id = nextAssetId++;
+        // copy now — caller may mutate after the call (rrweb's deferred-serialize bug)
+        const copy = new ImageData(new Uint8ClampedArray(d.data), d.width, d.height);
+        const asset = { id, kind: "imagedata", t, bytes: 0, w: d.width, h: d.height };
+        if (this.retainAssets)
+            asset.imageData = copy;
+        this.addAsset(id, asset);
+        this.trackEncode(deflate(new Uint8Array(copy.data.buffer, copy.data.byteOffset, copy.data.byteLength))
+            .then((z) => {
+            asset.bytes = z.length;
+            this.sink.onAssetBytes(id, z.length, t);
+            this.sink.onAssetData?.({ id, format: "imagedata", w: d.width, h: d.height, t }, z);
+        })
+            .catch((e) => this.sink.note(`imagedata deflate failed: ${e.message}`)));
+        return { $: "imagedata", id };
+    }
+    captureImageSource(src, t) {
+        // Only truly static sources dedupe by identity (CAS). Videos AND canvases
+        // (frameworks like Konva paint via internal buffer canvases) change
+        // content between draws and must be captured per-draw.
+        const isVideo = typeof HTMLVideoElement !== "undefined" && src instanceof HTMLVideoElement;
+        const isDynamic = isVideo ||
+            (typeof HTMLCanvasElement !== "undefined" && src instanceof HTMLCanvasElement) ||
+            (typeof OffscreenCanvas !== "undefined" && src instanceof OffscreenCanvas);
+        if (isVideo)
+            this.sink.onVideoSource?.(t);
+        if (!isDynamic && this.assetBySource.has(src)) {
+            return { $: "asset", id: this.assetBySource.get(src) };
+        }
+        const id = nextAssetId++;
+        if (!isDynamic)
+            this.assetBySource.set(src, id);
+        const asset = { id, kind: "image", t, bytes: 0 };
+        this.addAsset(id, asset);
+        if (this.assetMode === "dataurl") {
+            // rrweb-style: synchronous main-thread readback + PNG dataURL.
+            const t0 = performance.now();
+            try {
+                const { w, h } = sourceSize(src);
+                const tmp = document.createElement("canvas");
+                tmp.width = w;
+                tmp.height = h;
+                const tmpCtx = tmp.getContext("2d");
+                ignoredContexts.add(tmpCtx);
+                tmpCtx.drawImage(src, 0, 0);
+                const url = tmp.toDataURL("image/png");
+                asset.bytes = url.length;
+                asset.w = w;
+                asset.h = h;
+                this.sink.onAssetBytes(id, url.length, t);
+                if (this.retainAssets) {
+                    this.trackEncode(createImageBitmap(tmp).then((b) => { asset.bitmap = b; }));
+                }
+            }
+            catch (e) {
+                this.sink.note(`asset capture failed: ${e.message}`);
+                if (isTaintError(e))
+                    this.sink.onTaint?.(t);
+            }
+            this.cpuMs += performance.now() - t0;
+        }
+        else {
+            // CAS mode: async bitmap copy + worker webp encode (off main thread).
+            const t0 = performance.now();
+            this.trackEncode(createImageBitmap(src)
+                .then(async (bitmap) => {
+                const w = bitmap.width, h = bitmap.height;
+                let encodeTarget = bitmap;
+                if (this.retainAssets) {
+                    // encodeImage transfers its bitmap to the worker (detaching it),
+                    // so the retained/transfer copy must be a separate bitmap
+                    // (bench guardrail: replay-copy-before-encode).
+                    asset.bitmap = bitmap;
+                    encodeTarget = await createImageBitmap(bitmap);
+                }
+                const r = await this.encodeImage(encodeTarget);
+                asset.bytes = r.size;
+                asset.w = w;
+                asset.h = h;
+                this.sink.onAssetBytes(id, r.size, t);
+                if (r.bytes) {
+                    this.sink.onAssetData?.({ id, format: "webp", w, h, t }, new Uint8Array(r.bytes));
+                }
+            })
+                .catch((e) => {
+                this.sink.note(`asset encode failed: ${e.message}`);
+                // CAS mode: a cross-origin/tainted source makes createImageBitmap
+                // (or the subsequent readback) reject with a SecurityError. Signal
+                // taint so the player can render a placeholder.
+                if (isTaintError(e))
+                    this.sink.onTaint?.(t);
+            }));
+            this.cpuMs += performance.now() - t0;
+        }
+        return { $: "asset", id };
+    }
+}
+/** A cross-origin/tainted canvas readback throws a DOMException named
+ * "SecurityError" (toDataURL / createImageBitmap on a tainted source). Match by
+ * name (and message as a belt-and-braces fallback) so unrelated asset failures
+ * — OOM, codec errors — do NOT get reported as taint. */
+export function isTaintError(e) {
+    if (!e || typeof e !== "object")
+        return false;
+    const name = e.name;
+    if (name === "SecurityError")
+        return true;
+    const msg = e.message;
+    return typeof msg === "string" && /tainted|cross-origin|insecure/i.test(msg);
+}
+function isImageSource(o) {
+    return ((typeof HTMLImageElement !== "undefined" && o instanceof HTMLImageElement) ||
+        (typeof HTMLCanvasElement !== "undefined" && o instanceof HTMLCanvasElement) ||
+        (typeof HTMLVideoElement !== "undefined" && o instanceof HTMLVideoElement) ||
+        (typeof ImageBitmap !== "undefined" && o instanceof ImageBitmap) ||
+        (typeof OffscreenCanvas !== "undefined" && o instanceof OffscreenCanvas));
+}
+function sourceSize(src) {
+    if (src instanceof HTMLVideoElement)
+        return { w: src.videoWidth || 1, h: src.videoHeight || 1 };
+    if (src instanceof HTMLImageElement)
+        return { w: src.naturalWidth || 1, h: src.naturalHeight || 1 };
+    const anySrc = src;
+    return { w: Number(anySrc.width) || 1, h: Number(anySrc.height) || 1 };
+}
+// ---------------------------------------------------------------------------
+// Global installation
+// ---------------------------------------------------------------------------
+let installed = false;
+/** Patch one 2D-context prototype (CanvasRenderingContext2D on the main
+ * thread, OffscreenCanvasRenderingContext2D inside workers). */
+export function patch2DProto(protoObj) {
+    const proto = protoObj;
+    // Factory + gradient/Path2D logging may ALREADY be installed by the early
+    // SDK hook (objectLog.ts); both installs are idempotent. The loop below
+    // skips factory names so their logging wrappers are never double-wrapped
+    // into recordCall instrumentation.
+    installFactoryLoggingOnProto(protoObj);
+    installSharedObjectLogging();
+    for (const name of Object.getOwnPropertyNames(protoObj)) {
+        const desc = Object.getOwnPropertyDescriptor(protoObj, name);
+        if (!desc)
+            continue;
+        if (typeof desc.value === "function" && name !== "constructor") {
+            const orig = desc.value;
+            if (OBJECT_FACTORIES.includes(name)) {
+                // already wrapped by installFactoryLoggingOnProto — nothing to add
+            }
+            else if (name === "getImageData" || name === "getTransform" || name === "isPointInPath" ||
+                name === "isPointInStroke" || name === "measureText" || name === "getLineDash" ||
+                name === "getContextAttributes" || name === "createImageData") {
+                // pure getters — nothing to record
+            }
+            else {
+                proto[name] = function (...args) {
+                    const rec = recorders.get(this);
+                    if (rec)
+                        rec.recordCall(name, args);
+                    else if (untrackedNotify && !ignoredContexts.has(this))
+                        untrackedNotify(this);
+                    return orig.apply(this, args);
+                };
+            }
+        }
+        else if (desc.set && TRACKED_PROPS.includes(name)) {
+            const { get, set } = desc;
+            Object.defineProperty(protoObj, name, {
+                configurable: true,
+                get,
+                set(v) {
+                    const rec = recorders.get(this);
+                    if (rec)
+                        rec.recordSet(name, v);
+                    else if (untrackedNotify && !ignoredContexts.has(this))
+                        untrackedNotify(this);
+                    set.call(this, v);
+                },
+            });
+        }
+    }
+    // CanvasGradient.addColorStop + Path2D construction/segment logging is
+    // installed by installSharedObjectLogging() above (objectLog.ts).
+}
+/** Main-thread installation: 2D proto + getContext auto-attach + kind registry. */
+export function installCommandHooks() {
+    if (installed)
+        return;
+    installed = true;
+    patch2DProto(CanvasRenderingContext2D.prototype);
+    // Auto-attach (build-plugin tier): new 2D contexts get buffering recorders.
+    // ALL context creations record their kind + attrs so the manager can route
+    // per-canvas (2d -> commands, webgl/webgpu -> GL/GPU capture or video).
+    const origGetContext = HTMLCanvasElement.prototype.getContext;
+    HTMLCanvasElement.prototype.getContext = function (type, attrs) {
+        const result = origGetContext.call(this, type, attrs);
+        if (result && !contextInfo.has(this)) {
+            contextInfo.set(this, { type, attrs: attrs ?? undefined });
+        }
+        if (type === "2d" && result && autoConfig && !recorders.has(result)) {
+            const rec = new ContextRecorder(result, new BufferSink(), autoConfig.now, autoConfig.assetMode, autoConfig.encodeImage, { retainAssets: autoConfig.retainAssets });
+            recorders.set(result, rec);
+            autoRecorders.set(this, rec);
+        }
+        if (result && contextCreatedNotify)
+            contextCreatedNotify(this, type);
+        return result;
+    };
+}
+/** Attach directly to a known 2D context (worker-side OffscreenCanvas path,
+ * or main-thread contexts created before the hooks were installed). */
+export function attachRecorderToContext(ctx, sink, now, assetMode, encodeImage, opts) {
+    const rec = new ContextRecorder(ctx, sink, now, assetMode, encodeImage, opts);
+    rec.bound = true;
+    recorders.set(ctx, rec);
+    return rec;
+}
+export function attachRecorder(canvas, sink, now, assetMode, encodeImage, opts) {
+    // Build-plugin tier: a buffering recorder already exists from getContext —
+    // bind the strategy sink and drain creation-time ops into it.
+    const auto = autoRecorders.get(canvas);
+    if (auto) {
+        auto.swapSink(sink);
+        return auto;
+    }
+    let ctx = null;
+    try {
+        ctx = canvas.getContext("2d");
+    }
+    catch {
+        return null; // transferred to OffscreenCanvas — main thread cannot see commands
+    }
+    if (!ctx)
+        return null; // not a 2D canvas (webgl/webgpu/placeholder)
+    const rec = new ContextRecorder(ctx, sink, now, assetMode, encodeImage, opts);
+    rec.bound = true;
+    recorders.set(ctx, rec);
+    return rec;
+}
+export function detachRecorder(canvas) {
+    // getContext returns the existing context for already-initialized canvases
+    try {
+        const ctx = canvas.getContext("2d");
+        if (ctx)
+            recorders.delete(ctx);
+    }
+    catch {
+        /* context type already fixed to non-2d */
+    }
+}
+export function detachRecorderFromContext(ctx) {
+    recorders.delete(ctx);
+}
+/**
+ * Draw-site stamp routing (Phase 3b): when stamped app code calls
+ * `__sfds(ctx, id).fillRect(...)`, canvasManager's __sfDrawSite calls this
+ * with the 2D context object; if it has a recorder, the id rides the next op.
+ * Returns true when handled (ctx is a recorded 2D context).
+ */
+export function noteCtxPendingSiteId(ctx, id) {
+    const rec = recorders.get(ctx);
+    if (!rec)
+        return false;
+    rec.pendingSiteId = id;
+    return true;
+}