@react-three-dom/playwright 0.2.0 → 0.3.0

package/dist/index.cjs

@@ -4,13 +4,66 @@ var test$1 = require('@playwright/test');
 
 // src/fixtures.ts
 
+// src/diffSnapshots.ts
+var FIELDS_TO_COMPARE = [
+  "name",
+  "type",
+  "testId",
+  "visible",
+  "position",
+  "rotation",
+  "scale"
+];
+function flattenTree(node) {
+  const map = /* @__PURE__ */ new Map();
+  function walk(n) {
+    map.set(n.uuid, n);
+    n.children.forEach(walk);
+  }
+  walk(node);
+  return map;
+}
+function valueEqual(a, b) {
+  if (a === b) return true;
+  if (Array.isArray(a) && Array.isArray(b)) {
+    if (a.length !== b.length) return false;
+    return a.every((v, i) => valueEqual(v, b[i]));
+  }
+  return false;
+}
+function diffSnapshots(before, after) {
+  const beforeMap = flattenTree(before.tree);
+  const afterMap = flattenTree(after.tree);
+  const added = [];
+  const removed = [];
+  const changed = [];
+  for (const [uuid, node] of afterMap) {
+    if (!beforeMap.has(uuid)) added.push(node);
+  }
+  for (const [uuid, node] of beforeMap) {
+    if (!afterMap.has(uuid)) removed.push(node);
+  }
+  for (const [uuid, afterNode] of afterMap) {
+    const beforeNode = beforeMap.get(uuid);
+    if (!beforeNode) continue;
+    for (const field of FIELDS_TO_COMPARE) {
+      const from = beforeNode[field];
+      const to = afterNode[field];
+      if (!valueEqual(from, to)) {
+        changed.push({ uuid, field, from, to });
+      }
+    }
+  }
+  return { added, removed, changed };
+}
+
 // src/waiters.ts
-async function waitForReadyBridge(page, timeout) {
+async function waitForReadyBridge(page, timeout, canvasId) {
   const deadline = Date.now() + timeout;
   const pollMs = 100;
   while (Date.now() < deadline) {
-    const state = await page.evaluate(() => {
-      const api = window.__R3F_DOM__;
+    const state = await page.evaluate((cid) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
       if (!api) return { exists: false };
       return {
         exists: true,
@@ -18,7 +71,7 @@ async function waitForReadyBridge(page, timeout) {
         error: api._error ?? null,
         count: api.getCount()
       };
-    });
+    }, canvasId ?? null);
     if (state.exists && state.ready) {
       return;
     }
@@ -30,11 +83,11 @@ The <ThreeDom> component mounted but threw during setup. Check the browser conso
     }
     await page.waitForTimeout(pollMs);
   }
-  const finalState = await page.evaluate(() => {
-    const api = window.__R3F_DOM__;
+  const finalState = await page.evaluate((cid) => {
+    const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
     if (!api) return { exists: false, ready: false, error: null };
     return { exists: true, ready: api._ready, error: api._error ?? null };
-  });
+  }, canvasId ?? null);
   if (finalState.exists && finalState.error) {
     throw new Error(
       `[react-three-dom] Bridge initialization failed: ${finalState.error}
@@ -51,14 +104,18 @@ async function waitForSceneReady(page, options = {}) {
   const {
     stableChecks = 3,
     pollIntervalMs = 100,
-    timeout = 1e4
+    timeout = 1e4,
+    canvasId
   } = options;
   const deadline = Date.now() + timeout;
-  await waitForReadyBridge(page, timeout);
+  await waitForReadyBridge(page, timeout, canvasId);
   let lastCount = -1;
   let stableRuns = 0;
   while (Date.now() < deadline) {
-    const count = await page.evaluate(() => window.__R3F_DOM__.getCount());
+    const count = await page.evaluate((cid) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+      return api.getCount();
+    }, canvasId ?? null);
     if (count === lastCount && count > 0) {
       stableRuns++;
       if (stableRuns >= stableChecks) return;
@@ -68,52 +125,76 @@ async function waitForSceneReady(page, options = {}) {
     lastCount = count;
     await page.waitForTimeout(pollIntervalMs);
   }
+  const state = await page.evaluate((cid) => {
+    const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+    if (!api)
+      return { bridgeFound: false, ready: false, error: null, objectCount: 0 };
+    return {
+      bridgeFound: true,
+      ready: api._ready,
+      error: api._error ?? null,
+      objectCount: api.getCount()
+    };
+  }, canvasId ?? null);
+  const stateLine = state.bridgeFound ? `Bridge found: yes, _ready: ${state.ready}, _error: ${state.error ?? "none"}, objectCount: ${state.objectCount}` : "Bridge found: no (ensure <ThreeDom /> is mounted inside <Canvas> and refresh)";
   throw new Error(
-    `waitForSceneReady timed out after ${timeout}ms. Last count: ${lastCount}, stable runs: ${stableRuns}/${stableChecks}`
+    `waitForSceneReady timed out after ${timeout}ms. ${stateLine}. Last count: ${lastCount}, stable runs: ${stableRuns}/${stableChecks}.`
   );
 }
 async function waitForObject(page, idOrUuid, options = {}) {
   const {
     bridgeTimeout = 3e4,
     objectTimeout = 4e4,
-    pollIntervalMs = 200
+    pollIntervalMs = 200,
+    canvasId
   } = options;
-  await waitForReadyBridge(page, bridgeTimeout);
+  await waitForReadyBridge(page, bridgeTimeout, canvasId);
   const deadline = Date.now() + objectTimeout;
   while (Date.now() < deadline) {
     const found = await page.evaluate(
-      (id) => {
-        const api = window.__R3F_DOM__;
+      ([id, cid]) => {
+        const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
         if (!api || !api._ready) return false;
         return (api.getByTestId(id) ?? api.getByUuid(id)) !== null;
       },
-      idOrUuid
+      [idOrUuid, canvasId ?? null]
     );
     if (found) return;
     await page.waitForTimeout(pollIntervalMs);
   }
-  const diagnostics = await page.evaluate(() => {
-    const api = window.__R3F_DOM__;
-    if (!api) return { bridgeExists: false, ready: false, count: 0, error: null };
-    return {
-      bridgeExists: true,
-      ready: api._ready,
-      count: api.getCount(),
-      error: api._error ?? null
-    };
-  });
-  throw new Error(
-    `waitForObject("${idOrUuid}") timed out after ${objectTimeout}ms. Bridge: ${diagnostics.bridgeExists ? "exists" : "missing"}, ready: ${diagnostics.ready}, objectCount: ${diagnostics.count}` + (diagnostics.error ? `, error: ${diagnostics.error}` : "") + `. Is the object rendered with userData.testId="${idOrUuid}" or uuid="${idOrUuid}"?`
+  const diagnostics = await page.evaluate(
+    ([id, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+      if (!api) return { bridgeExists: false, ready: false, count: 0, error: null, suggestions: [] };
+      const suggestions = typeof api.fuzzyFind === "function" ? api.fuzzyFind(id, 5).map((m) => ({ testId: m.testId, name: m.name, uuid: m.uuid })) : [];
+      return {
+        bridgeExists: true,
+        ready: api._ready,
+        count: api.getCount(),
+        error: api._error ?? null,
+        suggestions
+      };
+    },
+    [idOrUuid, canvasId ?? null]
   );
+  let msg = `waitForObject("${idOrUuid}") timed out after ${objectTimeout}ms. Bridge: ${diagnostics.bridgeExists ? "exists" : "missing"}, ready: ${diagnostics.ready}, objectCount: ${diagnostics.count}` + (diagnostics.error ? `, error: ${diagnostics.error}` : "") + `. Is the object rendered with userData.testId="${idOrUuid}" or uuid="${idOrUuid}"?`;
+  if (diagnostics.suggestions.length > 0) {
+    msg += "\nDid you mean:\n" + diagnostics.suggestions.map((s) => {
+      const id = s.testId ? `testId="${s.testId}"` : `uuid="${s.uuid}"`;
+      return `  \u2192 ${s.name || "(unnamed)"} [${id}]`;
+    }).join("\n");
+  }
+  throw new Error(msg);
 }
 async function waitForIdle(page, options = {}) {
   const {
     idleFrames = 10,
-    timeout = 1e4
+    timeout = 1e4,
+    canvasId
   } = options;
-  await waitForReadyBridge(page, timeout);
+  await waitForReadyBridge(page, timeout, canvasId);
   const settled = await page.evaluate(
-    ([frames, timeoutMs]) => {
+    ([frames, timeoutMs, cid]) => {
       return new Promise((resolve) => {
         const deadline = Date.now() + timeoutMs;
         let lastJson = "";
@@ -123,7 +204,7 @@ async function waitForIdle(page, options = {}) {
             resolve(false);
             return;
           }
-          const api = window.__R3F_DOM__;
+          const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
           if (!api || !api._ready) {
             if (api && api._error) {
               resolve(`Bridge error: ${api._error}`);
@@ -149,7 +230,7 @@ async function waitForIdle(page, options = {}) {
         requestAnimationFrame(check);
       });
     },
-    [idleFrames, timeout]
+    [idleFrames, timeout, canvasId ?? null]
   );
   if (typeof settled === "string") {
     throw new Error(`waitForIdle failed: ${settled}`);
@@ -163,10 +244,11 @@ async function waitForNewObject(page, options = {}) {
     type,
     nameContains,
     pollIntervalMs = 100,
-    timeout = 1e4
+    timeout = 1e4,
+    canvasId
   } = options;
-  const baselineUuids = await page.evaluate(() => {
-    const api = window.__R3F_DOM__;
+  const baselineUuids = await page.evaluate((cid) => {
+    const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
     if (!api) return [];
     const snap = api.snapshot();
     const uuids = [];
@@ -178,13 +260,13 @@ async function waitForNewObject(page, options = {}) {
     }
     collect(snap.tree);
     return uuids;
-  });
+  }, canvasId ?? null);
   const deadline = Date.now() + timeout;
   while (Date.now() < deadline) {
     await page.waitForTimeout(pollIntervalMs);
     const result = await page.evaluate(
-      ([filterType, filterName, knownUuids]) => {
-        const api = window.__R3F_DOM__;
+      ([filterType, filterName, knownUuids, cid]) => {
+        const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
         if (!api) return null;
         const snap = api.snapshot();
         const known = new Set(knownUuids);
@@ -218,7 +300,7 @@ async function waitForNewObject(page, options = {}) {
           count: newObjects.length
         };
       },
-      [type ?? null, nameContains ?? null, baselineUuids]
+      [type ?? null, nameContains ?? null, baselineUuids, canvasId ?? null]
     );
     if (result) {
       return result;
@@ -232,16 +314,39 @@ async function waitForNewObject(page, options = {}) {
     `waitForNewObject timed out after ${timeout}ms. No new objects appeared${filterDesc ? ` matching ${filterDesc}` : ""}. Baseline had ${baselineUuids.length} objects.`
   );
 }
+async function waitForObjectRemoved(page, idOrUuid, options = {}) {
+  const {
+    bridgeTimeout = 3e4,
+    pollIntervalMs = 100,
+    timeout = 1e4,
+    canvasId
+  } = options;
+  await waitForReadyBridge(page, bridgeTimeout, canvasId);
+  const deadline = Date.now() + timeout;
+  while (Date.now() < deadline) {
+    const stillPresent = await page.evaluate(([id, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+      if (!api) return true;
+      const meta = api.getByTestId(id) ?? api.getByUuid(id);
+      return meta !== null;
+    }, [idOrUuid, canvasId ?? null]);
+    if (!stillPresent) return;
+    await page.waitForTimeout(pollIntervalMs);
+  }
+  throw new Error(
+    `waitForObjectRemoved timed out after ${timeout}ms. Object "${idOrUuid}" is still in the scene.`
+  );
+}
 
 // src/interactions.ts
 var DEFAULT_AUTO_WAIT_TIMEOUT = 5e3;
 var AUTO_WAIT_POLL_MS = 100;
-async function autoWaitForObject(page, idOrUuid, timeout = DEFAULT_AUTO_WAIT_TIMEOUT) {
+async function autoWaitForObject(page, idOrUuid, timeout = DEFAULT_AUTO_WAIT_TIMEOUT, canvasId) {
   const deadline = Date.now() + timeout;
   while (Date.now() < deadline) {
     const state = await page.evaluate(
-      (id) => {
-        const api = window.__R3F_DOM__;
+      ([id, cid]) => {
+        const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
         if (!api) return { bridge: "missing" };
         if (!api._ready) {
           return {
@@ -252,7 +357,7 @@ async function autoWaitForObject(page, idOrUuid, timeout = DEFAULT_AUTO_WAIT_TIM
         const found = (api.getByTestId(id) ?? api.getByUuid(id)) !== null;
         return { bridge: "ready", found };
       },
-      idOrUuid
+      [idOrUuid, canvasId ?? null]
     );
     if (state.bridge === "ready" && state.found) {
       return;
@@ -260,49 +365,56 @@ async function autoWaitForObject(page, idOrUuid, timeout = DEFAULT_AUTO_WAIT_TIM
     if (state.bridge === "not-ready" && state.error) {
       throw new Error(
         `[react-three-dom] Bridge initialization failed: ${state.error}
-Cannot perform interaction on "${idOrUuid}".`
+Cannot perform interaction on "${idOrUuid}"${canvasId ? ` (canvas: "${canvasId}")` : ""}.`
       );
     }
     await page.waitForTimeout(AUTO_WAIT_POLL_MS);
   }
   const finalState = await page.evaluate(
-    (id) => {
-      const api = window.__R3F_DOM__;
-      if (!api) return { bridge: false, ready: false, count: 0, error: null, found: false };
+    ([id, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+      if (!api) return { bridge: false, ready: false, count: 0, error: null, found: false, suggestions: [] };
+      const suggestions = typeof api.fuzzyFind === "function" ? api.fuzzyFind(id, 5).map((m) => ({ testId: m.testId, name: m.name, uuid: m.uuid })) : [];
       return {
         bridge: true,
         ready: api._ready,
         count: api.getCount(),
         error: api._error ?? null,
-        found: (api.getByTestId(id) ?? api.getByUuid(id)) !== null
+        found: (api.getByTestId(id) ?? api.getByUuid(id)) !== null,
+        suggestions
       };
     },
-    idOrUuid
+    [idOrUuid, canvasId ?? null]
   );
   if (!finalState.bridge) {
     throw new Error(
-      `[react-three-dom] Auto-wait timed out after ${timeout}ms: bridge not found.
-Ensure <ThreeDom> is mounted inside your <Canvas> component.`
+      `[react-three-dom] Auto-wait timed out after ${timeout}ms: bridge not found${canvasId ? ` (canvas: "${canvasId}")` : ""}.
+Ensure <ThreeDom${canvasId ? ` canvasId="${canvasId}"` : ""}> is mounted inside your <Canvas> component.`
     );
   }
-  throw new Error(
-    `[react-three-dom] Auto-wait timed out after ${timeout}ms: object "${idOrUuid}" not found.
+  let msg = `[react-three-dom] Auto-wait timed out after ${timeout}ms: object "${idOrUuid}" not found${canvasId ? ` (canvas: "${canvasId}")` : ""}.
 Bridge: ready=${finalState.ready}, objectCount=${finalState.count}` + (finalState.error ? `, error=${finalState.error}` : "") + `.
-Ensure the object has userData.testId="${idOrUuid}" or uuid="${idOrUuid}".`
-  );
+Ensure the object has userData.testId="${idOrUuid}" or uuid="${idOrUuid}".`;
+  if (finalState.suggestions.length > 0) {
+    msg += "\nDid you mean:\n" + finalState.suggestions.map((s) => {
+      const id = s.testId ? `testId="${s.testId}"` : `uuid="${s.uuid}"`;
+      return `  \u2192 ${s.name || "(unnamed)"} [${id}]`;
+    }).join("\n");
+  }
+  throw new Error(msg);
 }
-async function autoWaitForBridge(page, timeout = DEFAULT_AUTO_WAIT_TIMEOUT) {
+async function autoWaitForBridge(page, timeout = DEFAULT_AUTO_WAIT_TIMEOUT, canvasId) {
   const deadline = Date.now() + timeout;
   while (Date.now() < deadline) {
-    const state = await page.evaluate(() => {
-      const api = window.__R3F_DOM__;
+    const state = await page.evaluate((cid) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
       if (!api) return { exists: false };
       return {
         exists: true,
         ready: api._ready,
         error: api._error ?? null
       };
-    });
+    }, canvasId ?? null);
     if (state.exists && state.ready) return;
     if (state.exists && !state.ready && state.error) {
       throw new Error(
@@ -312,73 +424,245 @@ async function autoWaitForBridge(page, timeout = DEFAULT_AUTO_WAIT_TIMEOUT) {
     await page.waitForTimeout(AUTO_WAIT_POLL_MS);
   }
   throw new Error(
-    `[react-three-dom] Auto-wait timed out after ${timeout}ms: bridge not ready.
-Ensure <ThreeDom> is mounted inside your <Canvas> component.`
+    `[react-three-dom] Auto-wait timed out after ${timeout}ms: bridge not ready${canvasId ? ` (canvas: "${canvasId}")` : ""}.
+Ensure <ThreeDom${canvasId ? ` canvasId="${canvasId}"` : ""}> is mounted inside your <Canvas> component.`
   );
 }
-async function click(page, idOrUuid, timeout) {
-  await autoWaitForObject(page, idOrUuid, timeout);
-  await page.evaluate((id) => {
-    window.__R3F_DOM__.click(id);
-  }, idOrUuid);
+async function click(page, idOrUuid, timeout, canvasId) {
+  await autoWaitForObject(page, idOrUuid, timeout, canvasId);
+  await page.evaluate(([id, cid]) => {
+    const api = cid ? window.__R3F_DOM_INSTANCES__[cid] : window.__R3F_DOM__;
+    api.click(id);
+  }, [idOrUuid, canvasId ?? null]);
+}
+async function doubleClick(page, idOrUuid, timeout, canvasId) {
+  await autoWaitForObject(page, idOrUuid, timeout, canvasId);
+  await page.evaluate(([id, cid]) => {
+    const api = cid ? window.__R3F_DOM_INSTANCES__[cid] : window.__R3F_DOM__;
+    api.doubleClick(id);
+  }, [idOrUuid, canvasId ?? null]);
 }
-async function doubleClick(page, idOrUuid, timeout) {
-  await autoWaitForObject(page, idOrUuid, timeout);
-  await page.evaluate((id) => {
-    window.__R3F_DOM__.doubleClick(id);
-  }, idOrUuid);
+async function contextMenu(page, idOrUuid, timeout, canvasId) {
+  await autoWaitForObject(page, idOrUuid, timeout, canvasId);
+  await page.evaluate(([id, cid]) => {
+    const api = cid ? window.__R3F_DOM_INSTANCES__[cid] : window.__R3F_DOM__;
+    api.contextMenu(id);
+  }, [idOrUuid, canvasId ?? null]);
 }
-async function contextMenu(page, idOrUuid, timeout) {
-  await autoWaitForObject(page, idOrUuid, timeout);
-  await page.evaluate((id) => {
-    window.__R3F_DOM__.contextMenu(id);
-  }, idOrUuid);
+async function hover(page, idOrUuid, timeout, canvasId) {
+  await autoWaitForObject(page, idOrUuid, timeout, canvasId);
+  await page.evaluate(([id, cid]) => {
+    const api = cid ? window.__R3F_DOM_INSTANCES__[cid] : window.__R3F_DOM__;
+    api.hover(id);
+  }, [idOrUuid, canvasId ?? null]);
 }
-async function hover(page, idOrUuid, timeout) {
-  await autoWaitForObject(page, idOrUuid, timeout);
-  await page.evaluate((id) => {
-    window.__R3F_DOM__.hover(id);
-  }, idOrUuid);
+async function unhover(page, timeout, canvasId) {
+  await autoWaitForBridge(page, timeout, canvasId);
+  await page.evaluate((cid) => {
+    const api = cid ? window.__R3F_DOM_INSTANCES__[cid] : window.__R3F_DOM__;
+    api.unhover();
+  }, canvasId ?? null);
 }
-async function drag(page, idOrUuid, delta, timeout) {
-  await autoWaitForObject(page, idOrUuid, timeout);
+async function drag(page, idOrUuid, delta, timeout, canvasId) {
+  await autoWaitForObject(page, idOrUuid, timeout, canvasId);
   await page.evaluate(
-    async ([id, d]) => {
-      await window.__R3F_DOM__.drag(id, d);
+    async ([id, d, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__[cid] : window.__R3F_DOM__;
+      await api.drag(id, d);
     },
-    [idOrUuid, delta]
+    [idOrUuid, delta, canvasId ?? null]
   );
 }
-async function wheel(page, idOrUuid, options, timeout) {
-  await autoWaitForObject(page, idOrUuid, timeout);
+async function wheel(page, idOrUuid, options, timeout, canvasId) {
+  await autoWaitForObject(page, idOrUuid, timeout, canvasId);
   await page.evaluate(
-    ([id, opts]) => {
-      window.__R3F_DOM__.wheel(id, opts);
+    ([id, opts, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__[cid] : window.__R3F_DOM__;
+      api.wheel(id, opts);
     },
-    [idOrUuid, options]
+    [idOrUuid, options, canvasId ?? null]
   );
 }
-async function pointerMiss(page, timeout) {
-  await autoWaitForBridge(page, timeout);
-  await page.evaluate(() => {
-    window.__R3F_DOM__.pointerMiss();
-  });
+async function pointerMiss(page, timeout, canvasId) {
+  await autoWaitForBridge(page, timeout, canvasId);
+  await page.evaluate((cid) => {
+    const api = cid ? window.__R3F_DOM_INSTANCES__[cid] : window.__R3F_DOM__;
+    api.pointerMiss();
+  }, canvasId ?? null);
 }
-async function drawPathOnCanvas(page, points, options, timeout) {
-  await autoWaitForBridge(page, timeout);
+async function drawPathOnCanvas(page, points, options, timeout, canvasId) {
+  await autoWaitForBridge(page, timeout, canvasId);
   return page.evaluate(
-    async ([pts, opts]) => {
-      return window.__R3F_DOM__.drawPath(pts, opts ?? void 0);
+    async ([pts, opts, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__[cid] : window.__R3F_DOM__;
+      return api.drawPath(pts, opts ?? void 0);
     },
-    [points, options ?? null]
+    [points, options ?? null, canvasId ?? null]
   );
 }
+async function getCameraState(page, timeout, canvasId) {
+  await autoWaitForBridge(page, timeout, canvasId);
+  return page.evaluate((cid) => {
+    const api = cid ? window.__R3F_DOM_INSTANCES__[cid] : window.__R3F_DOM__;
+    return api.getCameraState();
+  }, canvasId ?? null);
+}
+
+// src/reporter.ts
+var RESET = "\x1B[0m";
+var BOLD = "\x1B[1m";
+var DIM = "\x1B[2m";
+var GREEN = "\x1B[32m";
+var RED = "\x1B[31m";
+var YELLOW = "\x1B[33m";
+var CYAN = "\x1B[36m";
+var MAGENTA = "\x1B[35m";
+var TAG = `${CYAN}[r3f-dom]${RESET}`;
+function ok(msg) {
+  return `${TAG} ${GREEN}\u2713${RESET} ${msg}`;
+}
+function fail(msg) {
+  return `${TAG} ${RED}\u2717${RESET} ${msg}`;
+}
+function warn(msg) {
+  return `${TAG} ${YELLOW}\u26A0${RESET} ${msg}`;
+}
+function info(msg) {
+  return `${TAG} ${DIM}${msg}${RESET}`;
+}
+function heading(msg) {
+  return `
+${TAG} ${BOLD}${MAGENTA}${msg}${RESET}`;
+}
+var R3FReporter = class {
+  constructor(_page, enabled = true, canvasId) {
+    this._page = _page;
+    this._enabled = true;
+    this._enabled = enabled;
+    this._canvasId = canvasId;
+  }
+  // -----------------------------------------------------------------------
+  // Lifecycle events
+  // -----------------------------------------------------------------------
+  logBridgeWaiting() {
+    if (!this._enabled) return;
+    console.log(info("Waiting for bridge (window.__R3F_DOM__)..."));
+  }
+  logBridgeConnected(diag) {
+    if (!this._enabled) return;
+    if (diag) {
+      console.log(ok(`Bridge connected \u2014 v${diag.version}, ${diag.objectCount} objects, ${diag.meshCount} meshes`));
+      console.log(info(`  Canvas: ${diag.canvasWidth}\xD7${diag.canvasHeight}  GPU: ${diag.webglRenderer}`));
+      console.log(info(`  DOM nodes: ${diag.materializedDomNodes}/${diag.maxDomNodes}  Dirty queue: ${diag.dirtyQueueSize}`));
+    } else {
+      console.log(ok("Bridge connected"));
+    }
+  }
+  logBridgeError(error) {
+    if (!this._enabled) return;
+    console.log(fail(`Bridge error: ${error}`));
+  }
+  logSceneReady(objectCount) {
+    if (!this._enabled) return;
+    console.log(ok(`Scene ready \u2014 ${objectCount} objects stabilized`));
+  }
+  logObjectFound(idOrUuid, type, name) {
+    if (!this._enabled) return;
+    const label = name ? `"${name}" (${type})` : type;
+    console.log(ok(`Object found: "${idOrUuid}" \u2192 ${label}`));
+  }
+  logObjectNotFound(idOrUuid, suggestions) {
+    if (!this._enabled) return;
+    console.log(fail(`Object not found: "${idOrUuid}"`));
+    if (suggestions && suggestions.length > 0) {
+      console.log(warn("Did you mean:"));
+      for (const s of suggestions.slice(0, 5)) {
+        const id = s.testId ? `testId="${s.testId}"` : `uuid="${s.uuid}"`;
+        console.log(info(`  \u2192 ${s.name || "(unnamed)"} [${id}]`));
+      }
+    }
+  }
+  // -----------------------------------------------------------------------
+  // Interaction events
+  // -----------------------------------------------------------------------
+  logInteraction(action, idOrUuid, extra) {
+    if (!this._enabled) return;
+    const suffix = extra ? ` ${DIM}${extra}${RESET}` : "";
+    console.log(info(`${action}("${idOrUuid}")${suffix}`));
+  }
+  logInteractionDone(action, idOrUuid, durationMs) {
+    if (!this._enabled) return;
+    console.log(ok(`${action}("${idOrUuid}") \u2014 ${durationMs}ms`));
+  }
+  // -----------------------------------------------------------------------
+  // Assertion context
+  // -----------------------------------------------------------------------
+  logAssertionFailure(matcherName, id, detail, diag) {
+    if (!this._enabled) return;
+    console.log(heading(`Assertion failed: ${matcherName}("${id}")`));
+    console.log(fail(detail));
+    if (diag) {
+      this._printDiagnosticsSummary(diag);
+    }
+  }
+  // -----------------------------------------------------------------------
+  // Full diagnostics dump
+  // -----------------------------------------------------------------------
+  async logDiagnostics() {
+    if (!this._enabled) return;
+    const diag = await this.fetchDiagnostics();
+    if (!diag) {
+      console.log(fail("Cannot fetch diagnostics \u2014 bridge not available"));
+      return;
+    }
+    console.log(heading("Bridge Diagnostics"));
+    this._printDiagnosticsFull(diag);
+  }
+  async fetchDiagnostics() {
+    return this._page.evaluate((cid) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+      if (!api || typeof api.getDiagnostics !== "function") return null;
+      return api.getDiagnostics();
+    }, this._canvasId ?? null);
+  }
+  async fetchFuzzyMatches(query, limit = 5) {
+    return this._page.evaluate(
+      ({ q, lim, cid }) => {
+        const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+        if (!api || typeof api.fuzzyFind !== "function") return [];
+        return api.fuzzyFind(q, lim);
+      },
+      { q: query, lim: limit, cid: this._canvasId ?? null }
+    );
+  }
+  // -----------------------------------------------------------------------
+  // Private formatting
+  // -----------------------------------------------------------------------
+  _printDiagnosticsSummary(d) {
+    console.log(info(`  Bridge: v${d.version} ready=${d.ready}${d.error ? ` error="${d.error}"` : ""}`));
+    console.log(info(`  Scene: ${d.objectCount} objects (${d.meshCount} meshes, ${d.groupCount} groups, ${d.lightCount} lights)`));
+    console.log(info(`  Canvas: ${d.canvasWidth}\xD7${d.canvasHeight}  GPU: ${d.webglRenderer}`));
+  }
+  _printDiagnosticsFull(d) {
+    const status = d.ready ? `${GREEN}READY${RESET}` : `${RED}NOT READY${RESET}`;
+    console.log(`  ${BOLD}Status:${RESET}    ${status}  v${d.version}`);
+    if (d.error) console.log(`  ${BOLD}Error:${RESET}     ${RED}${d.error}${RESET}`);
+    console.log(`  ${BOLD}Objects:${RESET}   ${d.objectCount} total`);
+    console.log(`             ${d.meshCount} meshes, ${d.groupCount} groups, ${d.lightCount} lights, ${d.cameraCount} cameras`);
+    console.log(`  ${BOLD}DOM:${RESET}       ${d.materializedDomNodes}/${d.maxDomNodes} materialized`);
+    console.log(`  ${BOLD}Canvas:${RESET}    ${d.canvasWidth}\xD7${d.canvasHeight}`);
+    console.log(`  ${BOLD}GPU:${RESET}       ${d.webglRenderer}`);
+    console.log(`  ${BOLD}Dirty:${RESET}     ${d.dirtyQueueSize} queued updates`);
+  }
+};
 
 // src/fixtures.ts
-var R3FFixture = class {
+var R3FFixture = class _R3FFixture {
   constructor(_page, opts) {
     this._page = _page;
     this._debugListenerAttached = false;
+    this.canvasId = opts?.canvasId;
+    this._reporter = new R3FReporter(_page, opts?.report !== false, this.canvasId);
     if (opts?.debug) {
       this._attachDebugListener();
     }
@@ -387,6 +671,40 @@ var R3FFixture = class {
   get page() {
     return this._page;
   }
+  /** Access the reporter for custom diagnostic logging. */
+  get reporter() {
+    return this._reporter;
+  }
+  /**
+   * Create a scoped fixture targeting a specific canvas instance.
+   * All queries, interactions, and assertions on the returned fixture
+   * will use `window.__R3F_DOM_INSTANCES__[canvasId]` instead of
+   * `window.__R3F_DOM__`.
+   *
+   * @example
+   * ```typescript
+   * const mainR3f = r3f.forCanvas('main-viewport');
+   * const minimapR3f = r3f.forCanvas('minimap');
+   * await mainR3f.click('building-42');
+   * await expect(minimapR3f).toExist('building-42-marker');
+   * ```
+   */
+  forCanvas(canvasId) {
+    return new _R3FFixture(this._page, {
+      canvasId,
+      report: this._reporter !== null
+    });
+  }
+  /**
+   * List all active canvas IDs registered on the page.
+   * Returns an empty array if only the default (unnamed) bridge is active.
+   */
+  async getCanvasIds() {
+    return this._page.evaluate(() => {
+      const instances = window.__R3F_DOM_INSTANCES__;
+      return instances ? Object.keys(instances) : [];
+    });
+  }
   // -----------------------------------------------------------------------
   // Debug logging
   // -----------------------------------------------------------------------
@@ -418,89 +736,177 @@ var R3FFixture = class {
   // -----------------------------------------------------------------------
   /** Get object metadata by testId or uuid. Returns null if not found. */
   async getObject(idOrUuid) {
-    return this._page.evaluate((id) => {
-      const api = window.__R3F_DOM__;
+    return this._page.evaluate(([id, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
       if (!api) return null;
       return api.getByTestId(id) ?? api.getByUuid(id) ?? null;
-    }, idOrUuid);
+    }, [idOrUuid, this.canvasId ?? null]);
+  }
+  /** Get object metadata by testId (userData.testId). Returns null if not found. */
+  async getByTestId(testId) {
+    return this._page.evaluate(([id, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+      return api ? api.getByTestId(id) : null;
+    }, [testId, this.canvasId ?? null]);
+  }
+  /** Get object metadata by UUID. Returns null if not found. */
+  async getByUuid(uuid) {
+    return this._page.evaluate(([u, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+      return api ? api.getByUuid(u) : null;
+    }, [uuid, this.canvasId ?? null]);
+  }
+  /** Get all objects with the given name (names are not unique in Three.js). */
+  async getByName(name) {
+    return this._page.evaluate(([n, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+      return api ? api.getByName(n) : [];
+    }, [name, this.canvasId ?? null]);
+  }
+  /** Get direct children of an object by testId or uuid. */
+  async getChildren(idOrUuid) {
+    return this._page.evaluate(([id, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+      return api ? api.getChildren(id) : [];
+    }, [idOrUuid, this.canvasId ?? null]);
+  }
+  /** Get parent of an object by testId or uuid. Returns null if root or not found. */
+  async getParent(idOrUuid) {
+    return this._page.evaluate(([id, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+      return api ? api.getParent(id) : null;
+    }, [idOrUuid, this.canvasId ?? null]);
   }
-  /** Get heavy inspection data (Tier 2) by testId or uuid. */
-  async inspect(idOrUuid) {
-    return this._page.evaluate((id) => {
-      const api = window.__R3F_DOM__;
+  /** Get heavy inspection data (Tier 2) by testId or uuid. Pass { includeGeometryData: true } to include vertex positions and triangle indices. */
+  async inspect(idOrUuid, options) {
+    return this._page.evaluate(
+      ({ id, opts, cid }) => {
+        const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+        if (!api) return null;
+        return api.inspect(id, opts);
+      },
+      { id: idOrUuid, opts: options, cid: this.canvasId ?? null }
+    );
+  }
+  /**
+   * Get world-space position [x, y, z] of an object (from its world matrix).
+   * Use for nested objects where local position differs from world position.
+   */
+  async getWorldPosition(idOrUuid) {
+    return this._page.evaluate(([id, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
       if (!api) return null;
-      return api.inspect(id);
-    }, idOrUuid);
+      const insp = api.inspect(id);
+      if (!insp?.worldMatrix || insp.worldMatrix.length < 15) return null;
+      const m = insp.worldMatrix;
+      return [m[12], m[13], m[14]];
+    }, [idOrUuid, this.canvasId ?? null]);
   }
   /** Take a full scene snapshot. */
   async snapshot() {
-    return this._page.evaluate(() => {
-      const api = window.__R3F_DOM__;
+    return this._page.evaluate((cid) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
       return api ? api.snapshot() : null;
-    });
+    }, this.canvasId ?? null);
+  }
+  /**
+   * Compare two scene snapshots: returns added nodes, removed nodes, and
+   * property changes (name, type, testId, visible, position, rotation, scale).
+   * Use after taking snapshots before/after an action to assert on scene changes.
+   */
+  diffSnapshots(before, after) {
+    return diffSnapshots(before, after);
+  }
+  /**
+   * Run an async action and return how many objects were added and removed
+   * compared to before the action. Uses snapshots before/after so add and
+   * remove are both counted correctly when both happen.
+   */
+  async trackObjectCount(action) {
+    const before = await this.snapshot();
+    if (!before) throw new Error("trackObjectCount: no snapshot before (bridge not ready?)");
+    await action();
+    const after = await this.snapshot();
+    if (!after) throw new Error("trackObjectCount: no snapshot after (bridge not ready?)");
+    const diff = diffSnapshots(before, after);
+    return { added: diff.added.length, removed: diff.removed.length };
   }
   /** Get the total number of tracked objects. */
   async getCount() {
-    return this._page.evaluate(() => {
-      const api = window.__R3F_DOM__;
+    return this._page.evaluate((cid) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
       return api ? api.getCount() : 0;
-    });
+    }, this.canvasId ?? null);
+  }
+  /**
+   * Return a Playwright locator for the R3F canvas element the bridge is attached to.
+   * The canvas has `data-r3f-canvas` set by the bridge (value is the canvasId or "true").
+   */
+  getCanvasLocator() {
+    if (this.canvasId) {
+      return this._page.locator(`[data-r3f-canvas="${this.canvasId}"]`);
+    }
+    return this._page.locator("[data-r3f-canvas]");
   }
   /**
    * Get all objects of a given Three.js type (e.g. "Mesh", "Group", "Line").
-   * Useful for BIM/CAD apps to find all walls, doors, etc. by object type.
    */
   async getByType(type) {
-    return this._page.evaluate((t) => {
-      const api = window.__R3F_DOM__;
+    return this._page.evaluate(([t, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
       return api ? api.getByType(t) : [];
-    }, type);
+    }, [type, this.canvasId ?? null]);
+  }
+  /**
+   * Get all objects with a given geometry type (e.g. "BoxGeometry", "BufferGeometry").
+   */
+  async getByGeometryType(type) {
+    return this._page.evaluate(([t, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+      return api ? api.getByGeometryType(t) : [];
+    }, [type, this.canvasId ?? null]);
+  }
+  /**
+   * Get all objects with a given material type (e.g. "MeshStandardMaterial").
+   */
+  async getByMaterialType(type) {
+    return this._page.evaluate(([t, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+      return api ? api.getByMaterialType(t) : [];
+    }, [type, this.canvasId ?? null]);
   }
   /**
    * Get objects that have a specific userData key (and optionally matching value).
-   * Useful for BIM/CAD apps where objects are tagged with metadata like
-   * `userData.category = "wall"` or `userData.floorId = 2`.
    */
   async getByUserData(key, value) {
-    return this._page.evaluate(({ k, v }) => {
-      const api = window.__R3F_DOM__;
+    return this._page.evaluate(({ k, v, cid }) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
       return api ? api.getByUserData(k, v) : [];
-    }, { k: key, v: value });
+    }, { k: key, v: value, cid: this.canvasId ?? null });
   }
   /**
    * Count objects of a given Three.js type.
-   * More efficient than `getByType(type).then(arr => arr.length)`.
    */
   async getCountByType(type) {
-    return this._page.evaluate((t) => {
-      const api = window.__R3F_DOM__;
+    return this._page.evaluate(([t, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
       return api ? api.getCountByType(t) : 0;
-    }, type);
+    }, [type, this.canvasId ?? null]);
   }
   /**
    * Batch lookup: get metadata for multiple objects by testId or uuid in a
-   * single browser round-trip. Returns a record from id to metadata (or null).
-   *
-   * Much more efficient than calling `getObject()` in a loop for BIM/CAD
-   * scenes with many objects.
-   *
-   * @example
-   * ```typescript
-   * const results = await r3f.getObjects(['wall-1', 'door-2', 'window-3']);
-   * expect(results['wall-1']).not.toBeNull();
-   * expect(results['door-2']?.type).toBe('Mesh');
-   * ```
+   * single browser round-trip.
    */
   async getObjects(ids) {
-    return this._page.evaluate((idList) => {
-      const api = window.__R3F_DOM__;
+    return this._page.evaluate(([idList, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
       if (!api) {
         const result = {};
         for (const id of idList) result[id] = null;
         return result;
       }
       return api.getObjects(idList);
-    }, ids);
+    }, [ids, this.canvasId ?? null]);
   }
   /**
    * Log the scene tree to the test terminal for debugging.
@@ -537,49 +943,56 @@ ${lines}
    * @param timeout  Optional auto-wait timeout in ms. Default: 5000
    */
   async click(idOrUuid, timeout) {
-    return click(this._page, idOrUuid, timeout);
+    return click(this._page, idOrUuid, timeout, this.canvasId);
   }
   /**
    * Double-click a 3D object by testId or uuid.
    * Auto-waits for the object to exist.
    */
   async doubleClick(idOrUuid, timeout) {
-    return doubleClick(this._page, idOrUuid, timeout);
+    return doubleClick(this._page, idOrUuid, timeout, this.canvasId);
   }
   /**
    * Right-click / context-menu a 3D object by testId or uuid.
    * Auto-waits for the object to exist.
    */
   async contextMenu(idOrUuid, timeout) {
-    return contextMenu(this._page, idOrUuid, timeout);
+    return contextMenu(this._page, idOrUuid, timeout, this.canvasId);
   }
   /**
    * Hover over a 3D object by testId or uuid.
    * Auto-waits for the object to exist.
    */
   async hover(idOrUuid, timeout) {
-    return hover(this._page, idOrUuid, timeout);
+    return hover(this._page, idOrUuid, timeout, this.canvasId);
+  }
+  /**
+   * Unhover / pointer-leave — resets hover state by moving pointer off-canvas.
+   * Auto-waits for the bridge to be ready.
+   */
+  async unhover(timeout) {
+    return unhover(this._page, timeout, this.canvasId);
   }
   /**
    * Drag a 3D object with a world-space delta vector.
    * Auto-waits for the object to exist.
    */
   async drag(idOrUuid, delta, timeout) {
-    return drag(this._page, idOrUuid, delta, timeout);
+    return drag(this._page, idOrUuid, delta, timeout, this.canvasId);
   }
   /**
    * Dispatch a wheel/scroll event on a 3D object.
    * Auto-waits for the object to exist.
    */
   async wheel(idOrUuid, options, timeout) {
-    return wheel(this._page, idOrUuid, options, timeout);
+    return wheel(this._page, idOrUuid, options, timeout, this.canvasId);
   }
   /**
    * Click empty space to trigger onPointerMissed handlers.
    * Auto-waits for the bridge to be ready.
    */
   async pointerMiss(timeout) {
-    return pointerMiss(this._page, timeout);
+    return pointerMiss(this._page, timeout, this.canvasId);
   }
   /**
    * Draw a freeform path on the canvas. Dispatches pointerdown → N × pointermove → pointerup.
@@ -592,7 +1005,17 @@ ${lines}
    * @returns       { eventCount, pointCount }
    */
   async drawPath(points, options, timeout) {
-    return drawPathOnCanvas(this._page, points, options, timeout);
+    return drawPathOnCanvas(this._page, points, options, timeout, this.canvasId);
+  }
+  // -----------------------------------------------------------------------
+  // Camera
+  // -----------------------------------------------------------------------
+  /**
+   * Get the current camera state (position, rotation, fov, near, far, zoom, target).
+   * Auto-waits for the bridge to be ready.
+   */
+  async getCameraState(timeout) {
+    return getCameraState(this._page, timeout, this.canvasId);
   }
   // -----------------------------------------------------------------------
   // Waiters
@@ -600,9 +1023,22 @@ ${lines}
   /**
    * Wait until the scene is ready — `window.__R3F_DOM__` is available and
    * the object count has stabilised across several consecutive checks.
+   * Logs bridge connection and scene readiness to the terminal.
    */
   async waitForSceneReady(options) {
-    return waitForSceneReady(this._page, options);
+    this._reporter.logBridgeWaiting();
+    try {
+      await waitForSceneReady(this._page, { ...options, canvasId: this.canvasId });
+      const diag = await this._reporter.fetchDiagnostics();
+      if (diag) {
+        this._reporter.logBridgeConnected(diag);
+        this._reporter.logSceneReady(diag.objectCount);
+      }
+    } catch (e) {
+      const diag = await this._reporter.fetchDiagnostics();
+      if (diag?.error) this._reporter.logBridgeError(diag.error);
+      throw e;
+    }
   }
   /**
    * Wait until the bridge is available and an object with the given testId or
@@ -610,14 +1046,25 @@ ${lines}
    * never stabilizes (e.g. async model loading, continuous animations).
    */
   async waitForObject(idOrUuid, options) {
-    return waitForObject(this._page, idOrUuid, options);
+    this._reporter.logBridgeWaiting();
+    try {
+      await waitForObject(this._page, idOrUuid, { ...options, canvasId: this.canvasId });
+      const meta = await this.getObject(idOrUuid);
+      if (meta) {
+        this._reporter.logObjectFound(idOrUuid, meta.type, meta.name || void 0);
+      }
+    } catch (e) {
+      const suggestions = await this._reporter.fetchFuzzyMatches(idOrUuid);
+      this._reporter.logObjectNotFound(idOrUuid, suggestions);
+      throw e;
+    }
   }
   /**
    * Wait until no object properties have changed for a number of consecutive
    * animation frames. Useful after triggering interactions or animations.
    */
   async waitForIdle(options) {
-    return waitForIdle(this._page, options);
+    return waitForIdle(this._page, { ...options, canvasId: this.canvasId });
   }
   /**
    * Wait until one or more new objects appear in the scene that were not
@@ -628,25 +1075,49 @@ ${lines}
    * @returns        Metadata of the newly added object(s)
    */
   async waitForNewObject(options) {
-    return waitForNewObject(this._page, options);
+    return waitForNewObject(this._page, { ...options, canvasId: this.canvasId });
+  }
+  /**
+   * Wait until an object (by testId or uuid) is no longer in the scene.
+   * Use for delete flows: trigger removal, then wait until the object is gone.
+   */
+  async waitForObjectRemoved(idOrUuid, options) {
+    return waitForObjectRemoved(this._page, idOrUuid, { ...options, canvasId: this.canvasId });
   }
   // -----------------------------------------------------------------------
   // Selection (for inspector integration)
   // -----------------------------------------------------------------------
   /** Select a 3D object by testId or uuid (highlights in scene). */
   async select(idOrUuid) {
-    await this._page.evaluate((id) => {
-      const api = window.__R3F_DOM__;
+    await this._page.evaluate(([id, cid]) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
       if (!api) throw new Error("react-three-dom bridge not found");
       api.select(id);
-    }, idOrUuid);
+    }, [idOrUuid, this.canvasId ?? null]);
   }
   /** Clear the current selection. */
   async clearSelection() {
-    await this._page.evaluate(() => {
-      const api = window.__R3F_DOM__;
+    await this._page.evaluate((cid) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
       if (api) api.clearSelection();
-    });
+    }, this.canvasId ?? null);
+  }
+  // -----------------------------------------------------------------------
+  // Diagnostics
+  // -----------------------------------------------------------------------
+  /**
+   * Fetch full bridge diagnostics (version, object counts, GPU info, etc.).
+   * Returns null if the bridge is not available.
+   */
+  async getDiagnostics() {
+    return this._reporter.fetchDiagnostics();
+  }
+  /**
+   * Print a full diagnostics report to the terminal.
+   * Useful at the start of a test suite or when debugging failures.
+   */
+  async logDiagnostics() {
+    return this._reporter.logDiagnostics();
   }
 };
 function formatSceneTree(node, prefix = "", isLast = true) {
@@ -680,21 +1151,21 @@ function createR3FTest(options) {
 }
 var DEFAULT_TIMEOUT = 5e3;
 var DEFAULT_INTERVAL = 100;
-async function fetchSceneCount(page) {
-  return page.evaluate(() => {
-    const api = window.__R3F_DOM__;
+async function fetchSceneCount(page, canvasId) {
+  return page.evaluate((cid) => {
+    const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
     return api ? api.getCount() : 0;
-  });
+  }, canvasId ?? null);
 }
-async function fetchCountByType(page, type) {
-  return page.evaluate((t) => {
-    const api = window.__R3F_DOM__;
+async function fetchCountByType(page, type, canvasId) {
+  return page.evaluate(([t, cid]) => {
+    const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
     return api ? api.getCountByType(t) : 0;
-  }, type);
+  }, [type, canvasId ?? null]);
 }
-async function fetchTotalTriangles(page) {
-  return page.evaluate(() => {
-    const api = window.__R3F_DOM__;
+async function fetchTotalTriangles(page, canvasId) {
+  return page.evaluate((cid) => {
+    const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
     if (!api) return 0;
     const bridge = api;
     const snap = bridge.snapshot();
@@ -708,21 +1179,31 @@ async function fetchTotalTriangles(page) {
     }
     walk(snap.tree);
     return total;
-  });
+  }, canvasId ?? null);
 }
-async function fetchMeta(page, id) {
-  return page.evaluate((i) => {
-    const api = window.__R3F_DOM__;
+async function fetchMeta(page, id, canvasId) {
+  return page.evaluate(([i, cid]) => {
+    const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
     if (!api) return null;
     return api.getByTestId(i) ?? api.getByUuid(i) ?? null;
-  }, id);
+  }, [id, canvasId ?? null]);
 }
-async function fetchInsp(page, id) {
-  return page.evaluate((i) => {
-    const api = window.__R3F_DOM__;
+async function fetchInsp(page, id, canvasId) {
+  return page.evaluate(([i, cid]) => {
+    const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
     if (!api) return null;
     return api.inspect(i);
-  }, id);
+  }, [id, canvasId ?? null]);
+}
+async function fetchWorldPosition(page, id, canvasId) {
+  return page.evaluate(([i, cid]) => {
+    const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+    if (!api) return null;
+    const insp = api.inspect(i);
+    if (!insp || !insp.worldMatrix || insp.worldMatrix.length < 15) return null;
+    const m = insp.worldMatrix;
+    return [m[12], m[13], m[14]];
+  }, [id, canvasId ?? null]);
 }
 function parseTol(v, def) {
   const o = typeof v === "number" ? { tolerance: v } : v ?? {};
@@ -732,14 +1213,55 @@ function parseTol(v, def) {
     tolerance: o.tolerance ?? def
   };
 }
-function notFound(name, id, detail, timeout) {
+async function fetchFuzzyHints(page, query, canvasId) {
+  try {
+    const suggestions = await page.evaluate(
+      ({ q, cid }) => {
+        const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+        if (!api || typeof api.fuzzyFind !== "function") return [];
+        return api.fuzzyFind(q, 5).map((m) => ({
+          testId: m.testId,
+          name: m.name,
+          uuid: m.uuid
+        }));
+      },
+      { q: query, cid: canvasId ?? null }
+    );
+    if (suggestions.length === 0) return "";
+    return "\nDid you mean:\n" + suggestions.map((s) => {
+      const id = s.testId ? `testId="${s.testId}"` : `uuid="${s.uuid}"`;
+      return `  \u2192 ${s.name || "(unnamed)"} [${id}]`;
+    }).join("\n");
+  } catch {
+    return "";
+  }
+}
+async function fetchDiagnosticHint(page, canvasId) {
+  try {
+    const diag = await page.evaluate((cid) => {
+      const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+      if (!api || typeof api.getDiagnostics !== "function") return null;
+      return api.getDiagnostics();
+    }, canvasId ?? null);
+    if (!diag) return "";
+    return `
+Bridge: v${diag.version} ready=${diag.ready}, ${diag.objectCount} objects (${diag.meshCount} meshes)`;
+  } catch {
+    return "";
+  }
+}
+async function notFoundAsync(page, name, id, detail, timeout, canvasId) {
+  const [fuzzy, diag] = await Promise.all([
+    fetchFuzzyHints(page, id, canvasId),
+    fetchDiagnosticHint(page, canvasId)
+  ]);
   return {
     pass: false,
-    message: () => `Expected object "${id}" ${detail}, but it was not found (waited ${timeout}ms)`,
+    message: () => `Expected object "${id}" ${detail}, but it was not found (waited ${timeout}ms)${diag}${fuzzy}`,
     name
   };
 }
-var expect = test$1.expect.extend({
+var r3fMatchers = {
   // ========================= TIER 1 — Metadata ============================
   // --- toExist ---
   async toExist(r3f, id, opts) {
@@ -749,7 +1271,7 @@ var expect = test$1.expect.extend({
     let meta = null;
     try {
       await test$1.expect.poll(async () => {
-        meta = await fetchMeta(r3f.page, id);
+        meta = await fetchMeta(r3f.page, id, r3f.canvasId);
         return meta !== null;
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
@@ -771,12 +1293,12 @@ var expect = test$1.expect.extend({
     let meta = null;
     try {
       await test$1.expect.poll(async () => {
-        meta = await fetchMeta(r3f.page, id);
+        meta = await fetchMeta(r3f.page, id, r3f.canvasId);
         return meta?.visible ?? false;
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!meta) return notFound("toBeVisible", id, "to be visible", timeout);
+    if (!meta) return notFoundAsync(r3f.page, "toBeVisible", id, "to be visible", timeout, r3f.canvasId);
     const m = meta;
     return {
       pass: m.visible,
@@ -795,7 +1317,7 @@ var expect = test$1.expect.extend({
     let delta = [0, 0, 0];
     try {
       await test$1.expect.poll(async () => {
-        meta = await fetchMeta(r3f.page, id);
+        meta = await fetchMeta(r3f.page, id, r3f.canvasId);
         if (!meta) return false;
         delta = [Math.abs(meta.position[0] - expected[0]), Math.abs(meta.position[1] - expected[1]), Math.abs(meta.position[2] - expected[2])];
         pass = delta.every((d) => d <= tolerance);
@@ -803,7 +1325,7 @@ var expect = test$1.expect.extend({
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!meta) return notFound("toHavePosition", id, `to have position [${expected}]`, timeout);
+    if (!meta) return notFoundAsync(r3f.page, "toHavePosition", id, `to have position [${expected}]`, timeout, r3f.canvasId);
     const m = meta;
     return {
       pass,
@@ -813,6 +1335,33 @@ var expect = test$1.expect.extend({
       actual: m.position
     };
   },
+  // --- toHaveWorldPosition ---
+  async toHaveWorldPosition(r3f, id, expected, tolOpts) {
+    const { timeout, interval, tolerance } = parseTol(tolOpts, 0.01);
+    const isNot = this.isNot;
+    let worldPos = null;
+    let pass = false;
+    let delta = [0, 0, 0];
+    try {
+      await test$1.expect.poll(async () => {
+        worldPos = await fetchWorldPosition(r3f.page, id, r3f.canvasId);
+        if (!worldPos) return false;
+        delta = [Math.abs(worldPos[0] - expected[0]), Math.abs(worldPos[1] - expected[1]), Math.abs(worldPos[2] - expected[2])];
+        pass = delta.every((d) => d <= tolerance);
+        return pass;
+      }, { timeout, intervals: [interval] }).toBe(!isNot);
+    } catch {
+    }
+    if (!worldPos) return notFoundAsync(r3f.page, "toHaveWorldPosition", id, `to have world position [${expected}]`, timeout, r3f.canvasId);
+    const actualWorldPos = worldPos;
+    return {
+      pass,
+      message: () => pass ? `Expected "${id}" to NOT have world position [${expected}] (\xB1${tolerance})` : `Expected "${id}" world position [${expected}] (\xB1${tolerance}), got [${actualWorldPos[0].toFixed(4)}, ${actualWorldPos[1].toFixed(4)}, ${actualWorldPos[2].toFixed(4)}] (\u0394 [${delta.map((d) => d.toFixed(4))}]) (waited ${timeout}ms)`,
+      name: "toHaveWorldPosition",
+      expected,
+      actual: actualWorldPos
+    };
+  },
   // --- toHaveRotation ---
   async toHaveRotation(r3f, id, expected, tolOpts) {
     const { timeout, interval, tolerance } = parseTol(tolOpts, 0.01);
@@ -822,7 +1371,7 @@ var expect = test$1.expect.extend({
     let delta = [0, 0, 0];
     try {
       await test$1.expect.poll(async () => {
-        meta = await fetchMeta(r3f.page, id);
+        meta = await fetchMeta(r3f.page, id, r3f.canvasId);
         if (!meta) return false;
         delta = [Math.abs(meta.rotation[0] - expected[0]), Math.abs(meta.rotation[1] - expected[1]), Math.abs(meta.rotation[2] - expected[2])];
         pass = delta.every((d) => d <= tolerance);
@@ -830,7 +1379,7 @@ var expect = test$1.expect.extend({
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!meta) return notFound("toHaveRotation", id, `to have rotation [${expected}]`, timeout);
+    if (!meta) return notFoundAsync(r3f.page, "toHaveRotation", id, `to have rotation [${expected}]`, timeout, r3f.canvasId);
     const m = meta;
     return {
       pass,
@@ -849,7 +1398,7 @@ var expect = test$1.expect.extend({
     let delta = [0, 0, 0];
     try {
       await test$1.expect.poll(async () => {
-        meta = await fetchMeta(r3f.page, id);
+        meta = await fetchMeta(r3f.page, id, r3f.canvasId);
         if (!meta) return false;
         delta = [Math.abs(meta.scale[0] - expected[0]), Math.abs(meta.scale[1] - expected[1]), Math.abs(meta.scale[2] - expected[2])];
         pass = delta.every((d) => d <= tolerance);
@@ -857,7 +1406,7 @@ var expect = test$1.expect.extend({
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!meta) return notFound("toHaveScale", id, `to have scale [${expected}]`, timeout);
+    if (!meta) return notFoundAsync(r3f.page, "toHaveScale", id, `to have scale [${expected}]`, timeout, r3f.canvasId);
     const m = meta;
     return {
       pass,
@@ -876,14 +1425,14 @@ var expect = test$1.expect.extend({
     let pass = false;
     try {
       await test$1.expect.poll(async () => {
-        meta = await fetchMeta(r3f.page, id);
+        meta = await fetchMeta(r3f.page, id, r3f.canvasId);
         if (!meta) return false;
         pass = meta.type === expectedType;
         return pass;
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!meta) return notFound("toHaveType", id, `to have type "${expectedType}"`, timeout);
+    if (!meta) return notFoundAsync(r3f.page, "toHaveType", id, `to have type "${expectedType}"`, timeout, r3f.canvasId);
     const m = meta;
     return {
       pass,
@@ -902,14 +1451,14 @@ var expect = test$1.expect.extend({
     let pass = false;
     try {
       await test$1.expect.poll(async () => {
-        meta = await fetchMeta(r3f.page, id);
+        meta = await fetchMeta(r3f.page, id, r3f.canvasId);
         if (!meta) return false;
         pass = meta.name === expectedName;
         return pass;
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!meta) return notFound("toHaveName", id, `to have name "${expectedName}"`, timeout);
+    if (!meta) return notFoundAsync(r3f.page, "toHaveName", id, `to have name "${expectedName}"`, timeout, r3f.canvasId);
     const m = meta;
     return {
       pass,
@@ -928,14 +1477,14 @@ var expect = test$1.expect.extend({
     let pass = false;
     try {
       await test$1.expect.poll(async () => {
-        meta = await fetchMeta(r3f.page, id);
+        meta = await fetchMeta(r3f.page, id, r3f.canvasId);
         if (!meta) return false;
         pass = meta.geometryType === expectedGeo;
         return pass;
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!meta) return notFound("toHaveGeometryType", id, `to have geometry "${expectedGeo}"`, timeout);
+    if (!meta) return notFoundAsync(r3f.page, "toHaveGeometryType", id, `to have geometry "${expectedGeo}"`, timeout, r3f.canvasId);
     const m = meta;
     return {
       pass,
@@ -954,14 +1503,14 @@ var expect = test$1.expect.extend({
     let pass = false;
     try {
       await test$1.expect.poll(async () => {
-        meta = await fetchMeta(r3f.page, id);
+        meta = await fetchMeta(r3f.page, id, r3f.canvasId);
         if (!meta) return false;
         pass = meta.materialType === expectedMat;
         return pass;
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!meta) return notFound("toHaveMaterialType", id, `to have material "${expectedMat}"`, timeout);
+    if (!meta) return notFoundAsync(r3f.page, "toHaveMaterialType", id, `to have material "${expectedMat}"`, timeout, r3f.canvasId);
     const m = meta;
     return {
       pass,
@@ -980,14 +1529,14 @@ var expect = test$1.expect.extend({
     let actual = 0;
     try {
       await test$1.expect.poll(async () => {
-        meta = await fetchMeta(r3f.page, id);
+        meta = await fetchMeta(r3f.page, id, r3f.canvasId);
         if (!meta) return false;
         actual = meta.childrenUuids.length;
         return actual === expectedCount;
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!meta) return notFound("toHaveChildCount", id, `to have ${expectedCount} children`, timeout);
+    if (!meta) return notFoundAsync(r3f.page, "toHaveChildCount", id, `to have ${expectedCount} children`, timeout, r3f.canvasId);
     const pass = actual === expectedCount;
     return {
       pass,
@@ -1007,16 +1556,16 @@ var expect = test$1.expect.extend({
     let pass = false;
     try {
       await test$1.expect.poll(async () => {
-        meta = await fetchMeta(r3f.page, id);
+        meta = await fetchMeta(r3f.page, id, r3f.canvasId);
         if (!meta?.parentUuid) return false;
-        parentMeta = await fetchMeta(r3f.page, meta.parentUuid);
+        parentMeta = await fetchMeta(r3f.page, meta.parentUuid, r3f.canvasId);
         if (!parentMeta) return false;
         pass = parentMeta.uuid === expectedParent || parentMeta.testId === expectedParent || parentMeta.name === expectedParent;
         return pass;
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!meta) return notFound("toHaveParent", id, `to have parent "${expectedParent}"`, timeout);
+    if (!meta) return notFoundAsync(r3f.page, "toHaveParent", id, `to have parent "${expectedParent}"`, timeout, r3f.canvasId);
     const m = meta;
     const pm = parentMeta;
     const parentLabel = pm?.testId ?? pm?.name ?? m.parentUuid;
@@ -1037,13 +1586,13 @@ var expect = test$1.expect.extend({
     let actual = 0;
     try {
       await test$1.expect.poll(async () => {
-        meta = await fetchMeta(r3f.page, id);
+        meta = await fetchMeta(r3f.page, id, r3f.canvasId);
         actual = meta?.instanceCount ?? 0;
         return actual === expectedCount;
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!meta) return notFound("toHaveInstanceCount", id, `to have instance count ${expectedCount}`, timeout);
+    if (!meta) return notFoundAsync(r3f.page, "toHaveInstanceCount", id, `to have instance count ${expectedCount}`, timeout, r3f.canvasId);
     const pass = actual === expectedCount;
     return {
       pass,
@@ -1063,7 +1612,7 @@ var expect = test$1.expect.extend({
     let pass = false;
     try {
       await test$1.expect.poll(async () => {
-        insp = await fetchInsp(r3f.page, id);
+        insp = await fetchInsp(r3f.page, id, r3f.canvasId);
         if (!insp) return false;
         const fin = (v) => v.every(Number.isFinite);
         pass = fin(insp.bounds.min) && fin(insp.bounds.max);
@@ -1071,7 +1620,7 @@ var expect = test$1.expect.extend({
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!insp) return notFound("toBeInFrustum", id, "to be in frustum", timeout);
+    if (!insp) return notFoundAsync(r3f.page, "toBeInFrustum", id, "to be in frustum", timeout, r3f.canvasId);
     const i = insp;
     return {
       pass,
@@ -1089,7 +1638,7 @@ var expect = test$1.expect.extend({
     let pass = false;
     try {
       await test$1.expect.poll(async () => {
-        insp = await fetchInsp(r3f.page, id);
+        insp = await fetchInsp(r3f.page, id, r3f.canvasId);
         if (!insp) return false;
         const w = (a, b) => a.every((v, j) => Math.abs(v - b[j]) <= tolerance);
         pass = w(insp.bounds.min, expected.min) && w(insp.bounds.max, expected.max);
@@ -1097,7 +1646,7 @@ var expect = test$1.expect.extend({
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!insp) return notFound("toHaveBounds", id, "to have specific bounds", timeout);
+    if (!insp) return notFoundAsync(r3f.page, "toHaveBounds", id, "to have specific bounds", timeout, r3f.canvasId);
     const i = insp;
     return {
       pass,
@@ -1118,7 +1667,7 @@ var expect = test$1.expect.extend({
     let pass = false;
     try {
       await test$1.expect.poll(async () => {
-        insp = await fetchInsp(r3f.page, id);
+        insp = await fetchInsp(r3f.page, id, r3f.canvasId);
         if (!insp?.material?.color) return false;
         actual = insp.material.color.toLowerCase();
         pass = actual === norm;
@@ -1126,7 +1675,7 @@ var expect = test$1.expect.extend({
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!insp) return notFound("toHaveColor", id, `to have color "${norm}"`, timeout);
+    if (!insp) return notFoundAsync(r3f.page, "toHaveColor", id, `to have color "${norm}"`, timeout, r3f.canvasId);
     return {
       pass,
       message: () => pass ? `Expected "${id}" to NOT have color "${norm}"` : `Expected "${id}" color "${norm}", got "${actual ?? "no color"}" (waited ${timeout}ms)`,
@@ -1144,7 +1693,7 @@ var expect = test$1.expect.extend({
     let pass = false;
     try {
       await test$1.expect.poll(async () => {
-        insp = await fetchInsp(r3f.page, id);
+        insp = await fetchInsp(r3f.page, id, r3f.canvasId);
         if (!insp?.material) return false;
         actual = insp.material.opacity;
         pass = actual !== void 0 && Math.abs(actual - expectedOpacity) <= tolerance;
@@ -1152,7 +1701,7 @@ var expect = test$1.expect.extend({
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!insp) return notFound("toHaveOpacity", id, `to have opacity ${expectedOpacity}`, timeout);
+    if (!insp) return notFoundAsync(r3f.page, "toHaveOpacity", id, `to have opacity ${expectedOpacity}`, timeout, r3f.canvasId);
     return {
       pass,
       message: () => pass ? `Expected "${id}" to NOT have opacity ${expectedOpacity} (\xB1${tolerance})` : `Expected "${id}" opacity ${expectedOpacity} (\xB1${tolerance}), got ${actual ?? "no material"} (waited ${timeout}ms)`,
@@ -1170,14 +1719,14 @@ var expect = test$1.expect.extend({
     let pass = false;
     try {
       await test$1.expect.poll(async () => {
-        insp = await fetchInsp(r3f.page, id);
+        insp = await fetchInsp(r3f.page, id, r3f.canvasId);
         if (!insp?.material) return false;
         pass = insp.material.transparent === true;
         return pass;
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!insp) return notFound("toBeTransparent", id, "to be transparent", timeout);
+    if (!insp) return notFoundAsync(r3f.page, "toBeTransparent", id, "to be transparent", timeout, r3f.canvasId);
     const i = insp;
     return {
       pass,
@@ -1196,13 +1745,13 @@ var expect = test$1.expect.extend({
     let actual = 0;
     try {
       await test$1.expect.poll(async () => {
-        meta = await fetchMeta(r3f.page, id);
+        meta = await fetchMeta(r3f.page, id, r3f.canvasId);
         actual = meta?.vertexCount ?? 0;
         return actual === expectedCount;
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!meta) return notFound("toHaveVertexCount", id, `to have ${expectedCount} vertices`, timeout);
+    if (!meta) return notFoundAsync(r3f.page, "toHaveVertexCount", id, `to have ${expectedCount} vertices`, timeout, r3f.canvasId);
     const pass = actual === expectedCount;
     return {
       pass,
@@ -1221,13 +1770,13 @@ var expect = test$1.expect.extend({
     let actual = 0;
     try {
       await test$1.expect.poll(async () => {
-        meta = await fetchMeta(r3f.page, id);
+        meta = await fetchMeta(r3f.page, id, r3f.canvasId);
         actual = meta?.triangleCount ?? 0;
         return actual === expectedCount;
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!meta) return notFound("toHaveTriangleCount", id, `to have ${expectedCount} triangles`, timeout);
+    if (!meta) return notFoundAsync(r3f.page, "toHaveTriangleCount", id, `to have ${expectedCount} triangles`, timeout, r3f.canvasId);
     const pass = actual === expectedCount;
     return {
       pass,
@@ -1247,7 +1796,7 @@ var expect = test$1.expect.extend({
     let pass = false;
     try {
       await test$1.expect.poll(async () => {
-        insp = await fetchInsp(r3f.page, id);
+        insp = await fetchInsp(r3f.page, id, r3f.canvasId);
         if (!insp) return false;
         if (!(key in insp.userData)) return false;
         if (expectedValue === void 0) {
@@ -1260,7 +1809,7 @@ var expect = test$1.expect.extend({
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!insp) return notFound("toHaveUserData", id, `to have userData.${key}`, timeout);
+    if (!insp) return notFoundAsync(r3f.page, "toHaveUserData", id, `to have userData.${key}`, timeout, r3f.canvasId);
     return {
       pass,
       message: () => {
@@ -1284,7 +1833,7 @@ var expect = test$1.expect.extend({
     let pass = false;
     try {
       await test$1.expect.poll(async () => {
-        insp = await fetchInsp(r3f.page, id);
+        insp = await fetchInsp(r3f.page, id, r3f.canvasId);
         if (!insp?.material?.map) return false;
         actual = insp.material.map;
         if (!expectedName) {
@@ -1296,7 +1845,7 @@ var expect = test$1.expect.extend({
       }, { timeout, intervals: [interval] }).toBe(!isNot);
     } catch {
     }
-    if (!insp) return notFound("toHaveMapTexture", id, "to have a map texture", timeout);
+    if (!insp) return notFoundAsync(r3f.page, "toHaveMapTexture", id, "to have a map texture", timeout, r3f.canvasId);
     return {
       pass,
       message: () => {
@@ -1328,7 +1877,7 @@ var expect = test$1.expect.extend({
     let pass = false;
     try {
       await test$1.expect.poll(async () => {
-        actual = await fetchSceneCount(r3f.page);
+        actual = await fetchSceneCount(r3f.page, r3f.canvasId);
         pass = actual === expected;
         return pass;
       }, { timeout, intervals: [interval] }).toBe(!isNot);
@@ -1356,7 +1905,7 @@ var expect = test$1.expect.extend({
     let pass = false;
     try {
       await test$1.expect.poll(async () => {
-        actual = await fetchSceneCount(r3f.page);
+        actual = await fetchSceneCount(r3f.page, r3f.canvasId);
         pass = actual > min;
         return pass;
       }, { timeout, intervals: [interval] }).toBe(!isNot);
@@ -1385,7 +1934,7 @@ var expect = test$1.expect.extend({
     let pass = false;
     try {
       await test$1.expect.poll(async () => {
-        actual = await fetchCountByType(r3f.page, type);
+        actual = await fetchCountByType(r3f.page, type, r3f.canvasId);
         pass = actual === expected;
         return pass;
       }, { timeout, intervals: [interval] }).toBe(!isNot);
@@ -1414,7 +1963,7 @@ var expect = test$1.expect.extend({
     let pass = false;
     try {
       await test$1.expect.poll(async () => {
-        actual = await fetchTotalTriangles(r3f.page);
+        actual = await fetchTotalTriangles(r3f.page, r3f.canvasId);
         pass = actual === expected;
         return pass;
       }, { timeout, intervals: [interval] }).toBe(!isNot);
@@ -1442,7 +1991,7 @@ var expect = test$1.expect.extend({
     let pass = false;
     try {
       await test$1.expect.poll(async () => {
-        actual = await fetchTotalTriangles(r3f.page);
+        actual = await fetchTotalTriangles(r3f.page, r3f.canvasId);
         pass = actual < max;
         return pass;
       }, { timeout, intervals: [interval] }).toBe(!isNot);
@@ -1455,8 +2004,276 @@ var expect = test$1.expect.extend({
       expected: `< ${max}`,
       actual
     };
+  },
+  // ===================== CAMERA STATE ASSERTIONS ===========================
+  /**
+   * Assert the camera position is close to the expected [x, y, z].
+   *
+   * @example expect(r3f).toHaveCameraPosition([0, 5, 10], 0.1);
+   */
+  async toHaveCameraPosition(r3f, expected, tolOpts) {
+    const { timeout, interval, tolerance } = parseTol(tolOpts, 0.1);
+    const isNot = this.isNot;
+    let actual = [0, 0, 0];
+    let pass = false;
+    try {
+      await test$1.expect.poll(async () => {
+        const cam = await r3f.page.evaluate((cid) => {
+          const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+          return api.getCameraState();
+        }, r3f.canvasId ?? null);
+        actual = cam.position;
+        pass = Math.abs(actual[0] - expected[0]) <= tolerance && Math.abs(actual[1] - expected[1]) <= tolerance && Math.abs(actual[2] - expected[2]) <= tolerance;
+        return pass;
+      }, { timeout, intervals: [interval] }).toBe(!isNot);
+    } catch {
+    }
+    return {
+      pass,
+      message: () => pass ? `Expected camera NOT at [${expected}], but it is` : `Expected camera at [${expected}], got [${actual}] (tol=${tolerance}, waited ${timeout}ms)`,
+      name: "toHaveCameraPosition",
+      expected,
+      actual
+    };
+  },
+  /**
+   * Assert the camera field of view (PerspectiveCamera only).
+   *
+   * @example expect(r3f).toHaveCameraFov(75);
+   */
+  async toHaveCameraFov(r3f, expected, tolOpts) {
+    const { timeout, interval, tolerance } = parseTol(tolOpts, 0.1);
+    const isNot = this.isNot;
+    let actual;
+    let pass = false;
+    try {
+      await test$1.expect.poll(async () => {
+        const cam = await r3f.page.evaluate((cid) => {
+          const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+          return api.getCameraState();
+        }, r3f.canvasId ?? null);
+        actual = cam.fov;
+        pass = actual !== void 0 && Math.abs(actual - expected) <= tolerance;
+        return pass;
+      }, { timeout, intervals: [interval] }).toBe(!isNot);
+    } catch {
+    }
+    return {
+      pass,
+      message: () => pass ? `Expected camera NOT to have fov ${expected}, but it does` : `Expected camera fov ${expected}, got ${actual ?? "N/A"} (tol=${tolerance}, waited ${timeout}ms)`,
+      name: "toHaveCameraFov",
+      expected,
+      actual
+    };
+  },
+  /**
+   * Assert the camera near clipping plane.
+   *
+   * @example expect(r3f).toHaveCameraNear(0.1);
+   */
+  async toHaveCameraNear(r3f, expected, tolOpts) {
+    const { timeout, interval, tolerance } = parseTol(tolOpts, 0.01);
+    const isNot = this.isNot;
+    let actual = 0;
+    let pass = false;
+    try {
+      await test$1.expect.poll(async () => {
+        const cam = await r3f.page.evaluate((cid) => {
+          const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+          return api.getCameraState();
+        }, r3f.canvasId ?? null);
+        actual = cam.near;
+        pass = Math.abs(actual - expected) <= tolerance;
+        return pass;
+      }, { timeout, intervals: [interval] }).toBe(!isNot);
+    } catch {
+    }
+    return {
+      pass,
+      message: () => pass ? `Expected camera near NOT ${expected}, but it is` : `Expected camera near ${expected}, got ${actual} (tol=${tolerance}, waited ${timeout}ms)`,
+      name: "toHaveCameraNear",
+      expected,
+      actual
+    };
+  },
+  /**
+   * Assert the camera far clipping plane.
+   *
+   * @example expect(r3f).toHaveCameraFar(1000);
+   */
+  async toHaveCameraFar(r3f, expected, tolOpts) {
+    const { timeout, interval, tolerance } = parseTol(tolOpts, 1);
+    const isNot = this.isNot;
+    let actual = 0;
+    let pass = false;
+    try {
+      await test$1.expect.poll(async () => {
+        const cam = await r3f.page.evaluate((cid) => {
+          const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+          return api.getCameraState();
+        }, r3f.canvasId ?? null);
+        actual = cam.far;
+        pass = Math.abs(actual - expected) <= tolerance;
+        return pass;
+      }, { timeout, intervals: [interval] }).toBe(!isNot);
+    } catch {
+    }
+    return {
+      pass,
+      message: () => pass ? `Expected camera far NOT ${expected}, but it is` : `Expected camera far ${expected}, got ${actual} (tol=${tolerance}, waited ${timeout}ms)`,
+      name: "toHaveCameraFar",
+      expected,
+      actual
+    };
+  },
+  /**
+   * Assert the camera zoom level.
+   *
+   * @example expect(r3f).toHaveCameraZoom(1);
+   */
+  async toHaveCameraZoom(r3f, expected, tolOpts) {
+    const { timeout, interval, tolerance } = parseTol(tolOpts, 0.01);
+    const isNot = this.isNot;
+    let actual = 0;
+    let pass = false;
+    try {
+      await test$1.expect.poll(async () => {
+        const cam = await r3f.page.evaluate((cid) => {
+          const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+          return api.getCameraState();
+        }, r3f.canvasId ?? null);
+        actual = cam.zoom;
+        pass = Math.abs(actual - expected) <= tolerance;
+        return pass;
+      }, { timeout, intervals: [interval] }).toBe(!isNot);
+    } catch {
+    }
+    return {
+      pass,
+      message: () => pass ? `Expected camera zoom NOT ${expected}, but it is` : `Expected camera zoom ${expected}, got ${actual} (tol=${tolerance}, waited ${timeout}ms)`,
+      name: "toHaveCameraZoom",
+      expected,
+      actual
+    };
+  },
+  // ======================== BATCH ASSERTIONS ==============================
+  /**
+   * Assert that ALL given objects exist in the scene.
+   * Accepts an array of testIds/uuids or a glob pattern (e.g. "wall-*").
+   *
+   * @example expect(r3f).toAllExist(['wall-1', 'wall-2', 'floor']);
+   * @example expect(r3f).toAllExist('wall-*');
+   */
+  async toAllExist(r3f, idsOrPattern, opts) {
+    const timeout = opts?.timeout ?? DEFAULT_TIMEOUT;
+    const interval = opts?.interval ?? DEFAULT_INTERVAL;
+    const isNot = this.isNot;
+    let missing = [];
+    let pass = false;
+    try {
+      await test$1.expect.poll(async () => {
+        const ids = typeof idsOrPattern === "string" ? await resolvePattern(r3f.page, idsOrPattern, r3f.canvasId) : idsOrPattern;
+        missing = [];
+        for (const id of ids) {
+          const m = await r3f.getObject(id);
+          if (!m) missing.push(id);
+        }
+        pass = missing.length === 0 && ids.length > 0;
+        return pass;
+      }, { timeout, intervals: [interval] }).toBe(!isNot);
+    } catch {
+    }
+    return {
+      pass,
+      message: () => pass ? `Expected some objects to NOT exist, but all do` : `Objects not found: [${missing.join(", ")}] (waited ${timeout}ms)`,
+      name: "toAllExist",
+      expected: idsOrPattern,
+      actual: { missing }
+    };
+  },
+  /**
+   * Assert that ALL given objects are visible.
+   *
+   * @example expect(r3f).toAllBeVisible(['wall-1', 'wall-2', 'floor']);
+   * @example expect(r3f).toAllBeVisible('wall-*');
+   */
+  async toAllBeVisible(r3f, idsOrPattern, opts) {
+    const timeout = opts?.timeout ?? DEFAULT_TIMEOUT;
+    const interval = opts?.interval ?? DEFAULT_INTERVAL;
+    const isNot = this.isNot;
+    let hidden = [];
+    let pass = false;
+    try {
+      await test$1.expect.poll(async () => {
+        const ids = typeof idsOrPattern === "string" ? await resolvePattern(r3f.page, idsOrPattern, r3f.canvasId) : idsOrPattern;
+        hidden = [];
+        for (const id of ids) {
+          const m = await r3f.getObject(id);
+          if (!m || !m.visible) hidden.push(id);
+        }
+        pass = hidden.length === 0 && ids.length > 0;
+        return pass;
+      }, { timeout, intervals: [interval] }).toBe(!isNot);
+    } catch {
+    }
+    return {
+      pass,
+      message: () => pass ? `Expected some objects to NOT be visible, but all are` : `Objects not visible: [${hidden.join(", ")}] (waited ${timeout}ms)`,
+      name: "toAllBeVisible",
+      expected: idsOrPattern,
+      actual: { hidden }
+    };
+  },
+  /**
+   * Assert that NONE of the given objects exist in the scene.
+   *
+   * @example expect(r3f).toNoneExist(['deleted-wall', 'old-floor']);
+   * @example expect(r3f).toNoneExist('temp-*');
+   */
+  async toNoneExist(r3f, idsOrPattern, opts) {
+    const timeout = opts?.timeout ?? DEFAULT_TIMEOUT;
+    const interval = opts?.interval ?? DEFAULT_INTERVAL;
+    const isNot = this.isNot;
+    let found = [];
+    let pass = false;
+    try {
+      await test$1.expect.poll(async () => {
+        const ids = typeof idsOrPattern === "string" ? await resolvePattern(r3f.page, idsOrPattern, r3f.canvasId) : idsOrPattern;
+        found = [];
+        for (const id of ids) {
+          const m = await r3f.getObject(id);
+          if (m) found.push(id);
+        }
+        pass = found.length === 0;
+        return pass;
+      }, { timeout, intervals: [interval] }).toBe(!isNot);
+    } catch {
+    }
+    return {
+      pass,
+      message: () => pass ? `Expected some objects to exist, but none do` : `Objects still exist: [${found.join(", ")}] (waited ${timeout}ms)`,
+      name: "toNoneExist",
+      expected: idsOrPattern,
+      actual: { found }
+    };
   }
-});
+};
+async function resolvePattern(page, pattern, canvasId) {
+  return page.evaluate(([p, cid]) => {
+    const api = cid ? window.__R3F_DOM_INSTANCES__?.[cid] : window.__R3F_DOM__;
+    if (!api) return [];
+    const snap = api.snapshot();
+    const ids = [];
+    const regex = new RegExp("^" + p.replace(/\*/g, ".*").replace(/\?/g, ".") + "$");
+    function walk(node) {
+      const testId = node.testId ?? node.name;
+      if (regex.test(testId) || regex.test(node.uuid)) ids.push(testId || node.uuid);
+      for (const child of node.children ?? []) walk(child);
+    }
+    walk(snap.tree);
+    return ids;
+  }, [pattern, canvasId ?? null]);
+}
 
 // src/pathGenerators.ts
 function linePath(start, end, steps = 10, pressure = 0.5) {
@@ -1523,23 +2340,28 @@ function circlePath(center, radiusX, radiusY, steps = 36, pressure = 0.5) {
 }
 
 exports.R3FFixture = R3FFixture;
+exports.R3FReporter = R3FReporter;
 exports.circlePath = circlePath;
 exports.click = click;
 exports.contextMenu = contextMenu;
 exports.createR3FTest = createR3FTest;
 exports.curvePath = curvePath;
+exports.diffSnapshots = diffSnapshots;
 exports.doubleClick = doubleClick;
 exports.drag = drag;
 exports.drawPathOnCanvas = drawPathOnCanvas;
-exports.expect = expect;
+exports.getCameraState = getCameraState;
 exports.hover = hover;
 exports.linePath = linePath;
 exports.pointerMiss = pointerMiss;
+exports.r3fMatchers = r3fMatchers;
 exports.rectPath = rectPath;
 exports.test = test;
+exports.unhover = unhover;
 exports.waitForIdle = waitForIdle;
 exports.waitForNewObject = waitForNewObject;
 exports.waitForObject = waitForObject;
+exports.waitForObjectRemoved = waitForObjectRemoved;
 exports.waitForSceneReady = waitForSceneReady;
 exports.wheel = wheel;
 //# sourceMappingURL=index.cjs.map