fix: normalize test renderer rect origins (#407)

RtlZeroMemory · web-flow · commit 69854bea78f2 · 2026-05-17T09:48:29.000+04:00
* fix: normalize test renderer rect origins

* fix: preserve offscreen test rect origins

* test: stabilize manual hot reload checks
diff --git a/packages/core/src/testing/__tests__/testRenderer.test.ts b/packages/core/src/testing/__tests__/testRenderer.test.ts
@@ -85,6 +85,77 @@ describe("createTestRenderer", () => {
     assert.ok((bottom?.rect.y ?? 0) >= (top?.rect.y ?? 0) + (top?.rect.h ?? 0));
   });
 
+  test("query rect origins are clamped to the viewport while raw layout keeps scroll offsets", () => {
+    const viewport = { cols: 5, rows: 3 };
+    const renderer = createTestRenderer({ viewport });
+
+    const result = renderer.render(
+      ui.column(
+        { id: "scroll", width: 5, height: 3, overflow: "scroll", scrollX: 99, scrollY: 99 },
+        [
+          ui.box({ id: "oversized", border: "none", mr: -4, mb: -1 }, [
+            ui.text("123456789"),
+            ui.text("line2"),
+            ui.text("line3"),
+            ui.text("line4"),
+          ]),
+        ],
+      ),
+    );
+
+    for (const node of result.nodes) {
+      assert.ok(node.rect.x >= 0, `${node.kind} x should be inside viewport`);
+      assert.ok(node.rect.y >= 0, `${node.kind} y should be inside viewport`);
+      assert.ok(node.rect.w >= 0, `${node.kind} width should be non-negative`);
+      assert.ok(node.rect.h >= 0, `${node.kind} height should be non-negative`);
+    }
+
+    assert.deepEqual(result.findById("oversized")?.rect, { x: 0, y: 0, w: 9, h: 4 });
+
+    let rawOversizedX: number | null = null;
+    let rawOversizedY: number | null = null;
+    result.forEachLayoutNode((rect, props) => {
+      if (props.id === "oversized") {
+        rawOversizedX = rect.x;
+        rawOversizedY = rect.y;
+      }
+    });
+    assert.notEqual(rawOversizedX, null);
+    assert.notEqual(rawOversizedY, null);
+    assert.ok((rawOversizedX ?? 0) < 0);
+    assert.ok((rawOversizedY ?? 0) < 0);
+  });
+
+  test("query rect origins preserve positive offscreen layout positions", () => {
+    const viewport = { cols: 8, rows: 2 };
+    const renderer = createTestRenderer({ viewport });
+
+    const result = renderer.render(
+      ui.column({ gap: 0 }, [
+        ui.box({ id: "anchor", border: "none", height: 1 }, [ui.text("anchor")]),
+        ui.box({ id: "offscreen", border: "none", position: "absolute", left: 11, top: 4 }, [
+          ui.text("offscreen"),
+        ]),
+      ]),
+    );
+
+    const offscreen = result.findById("offscreen");
+    assert.notEqual(offscreen, null);
+    assert.ok((offscreen?.rect.x ?? 0) > viewport.cols);
+    assert.ok((offscreen?.rect.y ?? 0) > viewport.rows);
+
+    let rawOffscreenX: number | null = null;
+    let rawOffscreenY: number | null = null;
+    result.forEachLayoutNode((rect, props) => {
+      if (props.id === "offscreen") {
+        rawOffscreenX = rect.x;
+        rawOffscreenY = rect.y;
+      }
+    });
+    assert.equal(offscreen?.rect.x, rawOffscreenX);
+    assert.equal(offscreen?.rect.y, rawOffscreenY);
+  });
+
   test("trace callback receives render timing and detail payload", () => {
     const events: unknown[] = [];
     const renderer = createTestRenderer({
diff --git a/packages/core/src/testing/renderer.ts b/packages/core/src/testing/renderer.ts
@@ -130,6 +130,15 @@ function normalizeTheme(theme: Theme | ThemeDefinition | undefined): Theme {
 const EMPTY_PROPS: TestNodeProps = Object.freeze({});
 const EMPTY_PATH: readonly number[] = Object.freeze([]);
 
+function normalizeRectOriginToViewport(rect: Rect, _viewport: TestViewport): Rect {
+  return {
+    x: Math.max(rect.x, 0),
+    y: Math.max(rect.y, 0),
+    w: rect.w,
+    h: rect.h,
+  };
+}
+
 function asPropsRecord(value: unknown, mode: TestRendererMode): TestNodeProps {
   if (typeof value !== "object" || value === null) return EMPTY_PROPS;
   // Runtime mode favors lower allocation overhead for hot render paths.
@@ -219,7 +228,11 @@ class RecordingDrawlistBuilder implements DrawlistBuilder {
   }
 }
 
-function collectNodes(layoutTree: LayoutTree, mode: TestRendererMode): readonly TestRenderNode[] {
+function collectNodes(
+  layoutTree: LayoutTree,
+  viewport: TestViewport,
+  mode: TestRendererMode,
+): readonly TestRenderNode[] {
   const out: TestRenderNode[] = [];
 
   const walk = (node: LayoutTree, path: readonly number[]): void => {
@@ -229,7 +242,7 @@ function collectNodes(layoutTree: LayoutTree, mode: TestRendererMode): readonly
 
     const base: TestRenderNode = {
       kind: node.vnode.kind,
-      rect: node.rect,
+      rect: normalizeRectOriginToViewport(node.rect, viewport),
       props,
       id,
       path: mode === "runtime" ? EMPTY_PATH : Object.freeze(path.slice()),
@@ -549,10 +562,10 @@ export function createTestRenderer(opts: TestRendererOptions = {}): TestRenderer
 
     const ops = builder.snapshotOps();
     let nodesCache: readonly TestRenderNode[] | null =
-      mode === "test" ? collectNodes(layoutTree, mode) : null;
+      mode === "test" ? collectNodes(layoutTree, viewport, mode) : null;
     const getNodes = (): readonly TestRenderNode[] => {
       if (nodesCache !== null) return nodesCache;
-      nodesCache = collectNodes(layoutTree, mode);
+      nodesCache = collectNodes(layoutTree, viewport, mode);
       return nodesCache;
     };
     let screenTextCache: string | null = null;
diff --git a/packages/node/src/__tests__/hotStateReload.test.ts b/packages/node/src/__tests__/hotStateReload.test.ts
@@ -8,6 +8,8 @@ import { type HotStateReloadErrorContext, createHotStateReload } from "../dev/ho
 
 type State = Readonly<{ count: number }>;
 
+const MANUAL_RELOAD_DEBOUNCE_MS = 10_000;
+
 async function withTempDir<T>(run: (dir: string) => Promise<T> | T): Promise<T> {
   const dir = mkdtempSync(join(tmpdir(), "rezi-hsr-test-"));
   try {
@@ -192,7 +194,7 @@ test("createHotStateReload reloadNow refreshes transitive imports and swaps view
       },
       viewModule,
       moduleRoot: dir,
-      debounceMs: 25,
+      debounceMs: MANUAL_RELOAD_DEBOUNCE_MS,
     });
 
     try {
@@ -236,7 +238,7 @@ test("createHotStateReload resolves bare package imports from nearest node_modul
       },
       viewModule,
       moduleRoot: src,
-      debounceMs: 25,
+      debounceMs: MANUAL_RELOAD_DEBOUNCE_MS,
     });
 
     try {
@@ -276,7 +278,7 @@ test("createHotStateReload keeps previous view when reload fails", async () => {
       },
       viewModule,
       moduleRoot: dir,
-      debounceMs: 25,
+      debounceMs: MANUAL_RELOAD_DEBOUNCE_MS,
       onError: (_error, context) => {
         errors.push(context);
       },
@@ -471,7 +473,7 @@ test("createHotStateReload reloadNow refreshes transitive imports and swaps rout
       },
       routesModule,
       moduleRoot: dir,
-      debounceMs: 25,
+      debounceMs: MANUAL_RELOAD_DEBOUNCE_MS,
     });
 
     try {
@@ -509,7 +511,7 @@ test("createHotStateReload keeps previous routes when route reload fails", async
       },
       routesModule,
       moduleRoot: dir,
-      debounceMs: 25,
+      debounceMs: MANUAL_RELOAD_DEBOUNCE_MS,
       onError: (_error, context) => {
         errors.push(context);
       },
@@ -561,7 +563,7 @@ test("createHotStateReload routes mode supports default export resolver", async
       },
       routesModule,
       moduleRoot: dir,
-      debounceMs: 25,
+      debounceMs: MANUAL_RELOAD_DEBOUNCE_MS,
     });
 
     try {
@@ -594,7 +596,7 @@ test("createHotStateReload routes mode reports invalid exports and keeps previou
       },
       routesModule: stableModule,
       moduleRoot: dir,
-      debounceMs: 25,
+      debounceMs: MANUAL_RELOAD_DEBOUNCE_MS,
       onError: (_error, context) => {
         contexts.push(context);
       },
@@ -616,7 +618,7 @@ test("createHotStateReload routes mode reports invalid exports and keeps previou
         },
         routesModule: invalidModule,
         moduleRoot: dir,
-        debounceMs: 25,
+        debounceMs: MANUAL_RELOAD_DEBOUNCE_MS,
         onError: (_error, context) => {
           contexts.push(context);
         },
