buninu-browser 0.2.3 → 0.2.4

package/lib/cdp-server.js

@@ -44,9 +44,11 @@ export class CdpServer {
       for (const target of state.targets.values()) {
         if (target.screencast && target.screencastEmit) pushScreencastFrame(context, state, target);
       }
+      if (state.implicitTarget?.screencast) pushScreencastFrame(context, state, state.implicitTarget);
     });
     context.onLifecycle?.((name) => {
       for (const target of state.targets.values()) emitLifecycle(target, name);
+      if (state.implicitTarget) emitLifecycle(state.implicitTarget, name);
     });
 
     const server = Bun.serve({
@@ -178,6 +180,7 @@ export class CdpServer {
                 ...(sessionId ? { sessionId } : {}),
               });
             };
+            emit.owner = ws;
             const result = await dispatch(
               context,
               state,
@@ -206,6 +209,13 @@ export class CdpServer {
           }
         },
         close(ws) {
+          for (const target of state.targets.values()) {
+            if (target.screencastEmit?.owner === ws) stopScreencast(target);
+            if (target.lifecycleEmit?.owner === ws) target.lifecycleEmit = null;
+          }
+          const implicit = state.implicitTarget;
+          if (implicit?.screencastEmit?.owner === ws) stopScreencast(implicit);
+          if (implicit?.lifecycleEmit?.owner === ws) implicit.lifecycleEmit = null;
           serverLog("[CdpServer] client disconnected");
         },
       },
@@ -350,6 +360,7 @@ async function dispatch(ctx, state, method, params, sessionId, emit) {
       const target = state.targets.get(params.targetId);
       if (!target) return { success: false };
 
+      stopScreencast(target);
       await ctx.close?.();
       state.initialNavigations.get(params.targetId)?.navigated.resolve();
       state.initialNavigations.get(params.targetId)?.settled.resolve();
@@ -450,7 +461,7 @@ async function dispatch(ctx, state, method, params, sessionId, emit) {
       // A javascript: URL runs in the current document: no new loader or history entry.
       if (/^\s*javascript:/i.test(String(params.url))) {
         await ctx.navigate?.(String(params.url).trim());
-        if (target.screencast) await emitScreencastFrame(ctx, state, target, emit);
+        if (target.screencast) await pushScreencastFrame(ctx, state, target);
         return { frameId: target.frameId, loaderId: target.loaderId };
       }
       // Events of the next document belong to its new loader.
@@ -460,7 +471,7 @@ async function dispatch(ctx, state, method, params, sessionId, emit) {
       target.title = await getContextTitle(ctx, target);
       target.history[target.historyIndex].title = target.title;
       if (target.screencast) {
-        await emitScreencastFrame(ctx, state, target, emit);
+        await pushScreencastFrame(ctx, state, target);
       }
       state.initialNavigations.get(target.targetId)?.navigated.resolve();
 
@@ -512,6 +523,7 @@ async function dispatch(ctx, state, method, params, sessionId, emit) {
     }
     case "Page.startScreencast": {
       const target = getSessionTarget(state, sessionId);
+      stopScreencast(target);
       target.screencast = { ...params };
       target.screencastEmit = emit;
       // As in Chrome, the reply does not wait for the first frame (nor the
@@ -519,12 +531,14 @@ async function dispatch(ctx, state, method, params, sessionId, emit) {
       void pushScreencastFrame(ctx, state, target);
       return {};
     }
-    case "Page.screencastFrameAck":
+    case "Page.screencastFrameAck": {
+      const target = getSessionTarget(state, sessionId);
+      if (target.screencastFrames.delete(params.sessionId) && target.screencastPending) void pushScreencastFrame(ctx, state, target);
       return {};
+    }
     case "Page.stopScreencast": {
       const target = getSessionTarget(state, sessionId);
-      target.screencast = null;
-      target.screencastEmit = null;
+      stopScreencast(target);
       return {};
     }
     case "Page.reload": {
@@ -707,7 +721,7 @@ async function dispatch(ctx, state, method, params, sessionId, emit) {
           navigateTarget(state, target, navigation.url, emit, { addHistory: true });
           target.title = navigation.title ?? await getContextTitle(ctx, target);
           target.history[target.historyIndex].title = target.title;
-          if (target.screencast) await emitScreencastFrame(ctx, state, target, emit);
+          if (target.screencast) await pushScreencastFrame(ctx, state, target);
         }
       }
       return {};
@@ -817,6 +831,7 @@ function createTarget(state, url = "about:blank", options = {}) {
       deviceScaleFactor: 1,
     },
     screencast: null,
+    screencastFrames: new Set(),
   };
   state.targets.set(targetId, target);
   state.initialNavigations.set(targetId, {
@@ -857,9 +872,20 @@ function emitLifecycle(target, name) {
   emit("Page.lifecycleEvent", { frameId: target.frameId, loaderId: target.loaderId, name, timestamp });
 }
 
-/** One screencast frame at a time; changes during a capture coalesce into one more. */
+// Bound the amount of image data queued to a slow CDP client. Two outstanding
+// frames keep the pipe moving while acknowledging one; later updates coalesce.
+const MAX_SCREENCAST_FRAMES = 2;
+function stopScreencast(target) {
+  target.screencast = null;
+  target.screencastEmit = null;
+  target.screencastPending = false;
+  target.screencastFrames.clear();
+}
+
+/** One capture at a time, with bounded unacknowledged frames. */
 async function pushScreencastFrame(ctx, state, target) {
-  if (target.screencastBusy) {
+  if (!target.screencast || !target.screencastEmit) return;
+  if (target.screencastBusy || target.screencastFrames.size >= MAX_SCREENCAST_FRAMES) {
     target.screencastPending = true;
     return;
   }
@@ -867,8 +893,9 @@ async function pushScreencastFrame(ctx, state, target) {
   try {
     do {
       target.screencastPending = false;
-      await emitScreencastFrame(ctx, state, target, target.screencastEmit);
-    } while (target.screencastPending && target.screencast && target.screencastEmit);
+      await emitScreencastFrame(ctx, state, target);
+    } while (target.screencastPending && target.screencast && target.screencastEmit
+      && target.screencastFrames.size < MAX_SCREENCAST_FRAMES);
   } catch (error) {
     serverError(`[CdpServer] screencast frame failed: ${error?.message ?? error}`);
   } finally {
@@ -876,10 +903,14 @@ async function pushScreencastFrame(ctx, state, target) {
   }
 }
 
-async function emitScreencastFrame(ctx, state, target, emit) {
-  const data = await screenshotData(ctx, target, target.screencast ?? {});
-  if (!data) return;
+async function emitScreencastFrame(ctx, state, target) {
+  const stream = target.screencast, emit = target.screencastEmit;
+  const data = await screenshotData(ctx, target, stream);
+  if (!data || stream !== target.screencast || emit !== target.screencastEmit) return;
   const scrollOffset = await ctx.scrollOffset?.() ?? { x: 0, y: 0 };
+  if (stream !== target.screencast || emit !== target.screencastEmit) return;
+  const sessionId = state.nextScreencastFrameId++;
+  target.screencastFrames.add(sessionId);
   emit("Page.screencastFrame", {
     data,
     metadata: {
@@ -891,7 +922,7 @@ async function emitScreencastFrame(ctx, state, target, emit) {
       scrollOffsetY: scrollOffset.y,
       timestamp: performance.now() / 1000,
     },
-    sessionId: state.nextScreencastFrameId++,
+    sessionId,
   });
 }
 
@@ -1000,6 +1031,8 @@ function getImplicitTarget(state) {
 
   state.implicitTarget = {
     targetId: "implicit-target",
+    screencast: null,
+    screencastFrames: new Set(),
     frameId: "implicit-target",
     loaderId: "implicit-loader",
     type: "page",

package/lib/happy-dom/document-base.js

@@ -0,0 +1,33 @@
+import Node from "../../vendor/happy-dom/packages/happy-dom/src/nodes/node/Node.ts";
+import Document from "../../vendor/happy-dom/packages/happy-dom/src/nodes/document/Document.ts";
+import HTMLHyperlinkElementUtility from "../../vendor/happy-dom/packages/happy-dom/src/nodes/html-hyperlink-element/HTMLHyperlinkElementUtility.ts";
+
+/** HTML document base URL, shared by the inert DOM and its page bindings. */
+export function documentBaseURL(node) {
+  const document = node?.nodeType === 9 ? node : node?.ownerDocument;
+  const fallback = document?.URL ?? "about:blank";
+  const base = document?.querySelector?.("base[href]");
+  if (!base) return fallback;
+  try {
+    const url = new URL(base.getAttribute("href"), fallback);
+    return url.protocol === "data:" || url.protocol === "javascript:" ? fallback : url.href;
+  } catch { return fallback; }
+}
+
+// Happy DOM selects the first <base>, including ones with only a target.
+// Correcting both accessors keeps native URL attributes and renderer loads
+// on the same base, without modifying the vendored implementation.
+for (const prototype of [Node.prototype, Document.prototype]) {
+  Object.defineProperty(prototype, "baseURI", {
+    configurable: true, get() { return documentBaseURL(this); },
+  });
+}
+
+// Hyperlink component accessors use this shared method, so pathname/search
+// setters and origin/hash getters resolve consistently with href itself.
+HTMLHyperlinkElementUtility.prototype.getHref = function () {
+  const value = this.element.getAttribute("href");
+  if (value === null) return "";
+  try { return new URL(value, documentBaseURL(this.element)).href; }
+  catch { return value; }
+};

package/lib/happy-dom/parser.js

@@ -1,6 +1,9 @@
 import HTMLParser from "../../vendor/happy-dom/packages/happy-dom/src/html-parser/HTMLParser.ts";
 import Window from "../../vendor/happy-dom/packages/happy-dom/src/window/Window.ts";
+import * as PropertySymbol from "../../vendor/happy-dom/packages/happy-dom/src/PropertySymbol.ts";
 import "./selector-pseudo-adapter.js";
+import "./svg-attribute-adapter.js";
+import "./document-base.js";
 
 const IMPLICIT_HEAD_ELEMENTS = new Set([
   "BASE", "BASEFONT", "BGSOUND", "LINK", "META", "NOFRAMES", "SCRIPT", "STYLE", "TEMPLATE", "TITLE",
@@ -12,8 +15,18 @@ const IMPLICIT_HEAD_ELEMENTS = new Set([
  * Page JavaScript and subresource loading stay disabled here. They belong to
  * the renderer scheduler and network service rather than the tree builder.
  */
-export function parseHTMLDocument(html, url = "about:blank") {
-  const window = new Window({
+export function parseHTMLDocument(html, url = "about:blank", referrer = "") {
+  const window = createInertWindow(url);
+  window.document[PropertySymbol.referrer] = referrer;
+
+  new HTMLParser(window).parse(String(html), window.document);
+  normalizeImplicitHead(window.document, implicitHeadCount(String(html)));
+  return { window, document: window.document };
+}
+
+/** An isolated parser context: no script execution, resource loads or page custom elements. */
+export function createInertWindow(url = "about:blank") {
+  return new Window({
     url,
     settings: {
       disableJavaScriptEvaluation: true,
@@ -27,10 +40,6 @@ export function parseHTMLDocument(html, url = "about:blank") {
       navigation: { disableFallbackToSetURL: true },
     },
   });
-
-  new HTMLParser(window).parse(String(html), window.document);
-  normalizeImplicitHead(window.document, implicitHeadCount(String(html)));
-  return { window, document: window.document };
 }
 
 /**

package/lib/happy-dom/selector-matcher.js

@@ -37,9 +37,9 @@ export function compileSelector(element, selector) {
 }
 
 /** Whether `element` matches a compiled selector, as element.matches(selector) would. */
-export function matchesCompiled(element, compiled) {
+export function matchesCompiled(element, compiled, scope = element) {
   for (const items of compiled) {
-    if (matchItems(element, element, items, 0, null)) return true;
+    if (matchItems(scope, element, items, 0, null)) return true;
   }
   return false;
 }

package/lib/happy-dom/selector-pseudo-adapter.js

@@ -1,9 +1,28 @@
 import SelectorItem from "../../vendor/happy-dom/packages/happy-dom/src/query-selector/SelectorItem.ts";
+import { compileSelector, matchesCompiled } from "./selector-matcher.js";
 
 // Happy DOM's :empty checks only element children. CSS also excludes elements
 // with nonempty text nodes (including whitespace); comments do not count.
 const original = SelectorItem.prototype.matchPseudoItem;
+const selectorLists = new WeakMap();
 SelectorItem.prototype.matchPseudoItem = function (scope, element, siblings, pseudo, ignoreErrors) {
+  if (pseudo.name === "focus-within") {
+    const focused = element.ownerDocument?.activeElement;
+    return focused && (focused === element || element.contains(focused)) ? {priorityWeight:10} : null;
+  }
+  // Functional selector lists match their complete complex selectors. The
+  // upstream per-item path tests only a group's first compound, so e.g.
+  // :where(h2 code) incorrectly matches the h2 instead of its code child.
+  if (["is", "where", "not"].includes(pseudo.name) && pseudo.arguments) {
+    let compiled = selectorLists.get(pseudo);
+    if (compiled === undefined) {
+      compiled = compileSelector(element, pseudo.arguments) ?? null;
+      selectorLists.set(pseudo, compiled);
+    }
+    const matches = compiled && matchesCompiled(element, compiled, scope);
+    return (pseudo.name === "not" ? !matches : matches)
+      ? { priorityWeight: pseudo.name === "where" ? 0 : 10 } : null;
+  }
   if (pseudo.name === "empty") {
     for (const child of element.childNodes) {
       if (child.nodeType === 1 || (child.nodeType === 3 || child.nodeType === 4) && child.data.length) return null;

package/lib/happy-dom/svg-attribute-adapter.js

@@ -0,0 +1,50 @@
+import HTMLParser from "../../vendor/happy-dom/packages/happy-dom/src/html-parser/HTMLParser.ts";
+
+// HTML tokenization ASCII-lowercases every attribute, including foreign
+// content. Tree construction then restores the standard SVG spellings.
+// https://html.spec.whatwg.org/multipage/parsing.html#adjust-svg-attributes
+const adjustedNames = new Map(`attributeName attributeType baseFrequency baseProfile calcMode clipPathUnits
+  diffuseConstant edgeMode filterUnits glyphRef gradientTransform gradientUnits kernelMatrix kernelUnitLength
+  keyPoints keySplines keyTimes lengthAdjust limitingConeAngle markerHeight markerUnits markerWidth
+  maskContentUnits maskUnits numOctaves pathLength patternContentUnits patternTransform patternUnits
+  pointsAtX pointsAtY pointsAtZ preserveAlpha preserveAspectRatio primitiveUnits refX refY repeatCount repeatDur
+  requiredExtensions requiredFeatures specularConstant specularExponent spreadMethod startOffset stdDeviation
+  stitchTiles surfaceScale systemLanguage tableValues targetX targetY textLength viewBox viewTarget
+  xChannelSelector yChannelSelector zoomAndPan`.trim().split(/\s+/).map(name => [name.toLowerCase(), name]));
+const space = character => character === " " || character === "\t" || character === "\n" || character === "\r" || character === "\f";
+
+function adjustNames(source) {
+  let index = 0, copied = 0, output = "";
+  while (index < source.length) {
+    while (space(source[index]) || source[index] === "/") index++;
+    const start = index;
+    while (index < source.length && !space(source[index]) && source[index] !== "=" && source[index] !== "/" && source[index] !== ">") index++;
+    if (index === start) { index++; continue; }
+    const name = source.slice(start, index);
+    const lower = name.replace(/[A-Z]/g, character => character.toLowerCase());
+    const adjusted = adjustedNames.get(lower) ?? lower;
+    if (name !== adjusted) {
+      output += source.slice(copied, start) + adjusted;
+      copied = index;
+    }
+    while (space(source[index])) index++;
+    if (source[index] !== "=") continue;
+    index++;
+    while (space(source[index])) index++;
+    const quote = source[index];
+    if (quote === '"' || quote === "'") {
+      index++;
+      while (index < source.length && source[index] !== quote) index++;
+      if (index < source.length) index++;
+    } else {
+      while (index < source.length && !space(source[index]) && source[index] !== ">") index++;
+    }
+  }
+  return copied ? output + source.slice(copied) : source;
+}
+
+const parseAttributes = HTMLParser.prototype.parseEndOfStartTag;
+HTMLParser.prototype.parseEndOfStartTag = function (source, selfClosing) {
+  if (source && this.nextElement?.namespaceURI === "http://www.w3.org/2000/svg") source = adjustNames(source);
+  return parseAttributes.call(this, source, selfClosing);
+};

package/lib/headless-shell.js

@@ -173,7 +173,7 @@ export async function createBrowser({
           recordFragment(url, fragmentFrom);
           return;
         }
-        navigate(url, { downloadName, post }).catch((error) => console.error(`buninu-browser: navigation failed: ${error.message}`));
+        navigate(url, { downloadName, post, referrer: host.documentUrl }).catch((error) => console.error(`buninu-browser: navigation failed: ${error.message}`));
       },
       onDownload: ({ url, name, data }) => {
         if (host !== current) return;
@@ -259,7 +259,7 @@ export async function createBrowser({
    * final origin. `invoke` pins the renderer (used when restoring a
    * restarted renderer).
    */
-  async function load(url, invoke = null, downloadName = null, post = null) {
+  async function load(url, invoke = null, downloadName = null, post = null, referrer = null) {
     const started = performance.now();
     if (downloadName !== null && resource && withoutHash(url) === withoutHash(resource.url)) {
       return download({ url: resource.url, body: resource.body, attributeName: downloadName, totalBytes: resource.body.byteLength });
@@ -273,7 +273,7 @@ export async function createBrowser({
       try {
         const target = new URL(url);
         const response = ["http:", "https:"].includes(target.protocol)
-          ? await network.navigate(target.href, { post, onResponse: (raw, finalUrl) => {
+          ? await network.navigate(target.href, { post, referrer: referrer ?? post?.referrer ?? null, onResponse: (raw, finalUrl) => {
             if (!raw.ok || (downloadName === null && !isAttachment(raw.headers.get("content-disposition")))) return null;
             return download({ url: finalUrl, body: raw.body, disposition: raw.headers.get("content-disposition") ?? "",
               attributeName: downloadName ?? "", totalBytes: Number(raw.headers.get("content-length")) || 0 });
@@ -292,6 +292,7 @@ export async function createBrowser({
           status: response.status,
           statusText: response.statusText,
           cookie: network.documentCookie(response.url),
+          referrer: response.referrer ?? "",
         };
       } catch (error) {
         document = { url, error: String(error) };
@@ -324,7 +325,7 @@ export async function createBrowser({
     Object.assign(history[historyIndex], { x: offset.x, y: offset.y });
   }
 
-  async function navigate(url, { downloadName = null, post = null } = {}) {
+  async function navigate(url, { downloadName = null, post = null, referrer = null } = {}) {
     const resolved = new URL(url, currentUrl).href;
     // A javascript: URL runs in the current document; history does not change.
     if (resolved.startsWith("javascript:")) {
@@ -336,7 +337,7 @@ export async function createBrowser({
     if (!post && downloadName === null && withoutHash(resolved) === withoutHash(currentUrl)) {
       currentUrl = resolved;
     } else {
-      const result = await load(resolved, null, downloadName, post);
+      const result = await load(resolved, null, downloadName, post, referrer);
       if (result?.downloaded) return null;
       // The document is at the URL redirects ended on; the request's fragment
       // carries over to it unless it has its own (Fetch §4.4, HTML §7.4.6).
@@ -406,6 +407,7 @@ export async function createBrowser({
     screenshot: (options = {}) => composite("screenshot", {
       format: options.format === "jpeg" || options.format === "webp" ? options.format : "png",
       quality: Number.isFinite(options.quality) ? options.quality : 80,
+      optimizeForSpeed: options.optimizeForSpeed === true,
     }),
     title: () => call("title"),
     /**
@@ -466,7 +468,8 @@ export async function createBrowser({
         recordFragment(href, clicked.fragmentFrom);
         return { url: href, title: await call("title") };
       }
-      const result = await navigate(href, { downloadName: typeof clicked === "object" ? clicked.download ?? null : null });
+      const result = await navigate(href, { downloadName: typeof clicked === "object" ? clicked.download ?? null : null,
+        referrer: current.documentUrl });
       return result === null ? null : { url: href, title: await call("title") };
     },
     evaluate: (expression) => call("evaluate", String(expression)),

package/lib/input/hit-test.js

@@ -80,39 +80,82 @@ export function hitTest(tree, layout, x, y, scroll, viewport) {
  * pointer events. Null when the point hits nothing.
  */
 export function elementAtPoint(tree, displayList, x, y, scroll) {
+  const domNode = renderNodeAtPoint(tree, displayList, x, y, scroll)?.domNode;
+  return domNode?.nodeType === 1 ? domNode : domNode?.parentElement ?? null;
+}
+
+/** Also preserves generated controls, whose owning DOM element differs from their render node. */
+export function renderNodeAtPoint(tree, displayList, x, y, scroll) {
   const hittable = hitTestable(tree);
   const nodeId = hitTarget(displayList, x, y, scroll, (id) => !hittable(tree.nodesById.get(id)));
-  const domNode = nodeId == null ? null : tree.nodesById.get(nodeId)?.domNode;
-  return domNode?.nodeType === 1 ? domNode : domNode?.parentElement ?? null;
+  return nodeId == null ? null : tree.nodesById.get(nodeId) ?? null;
 }
 
-/** Returns the content-coordinate bounds contributed by an element's text descendants. */
-export function elementBounds(tree, layout, element) {
-  const rects = [];
+// Layout objects are immutable after the layout pass. Keeping their lookup
+// tables under a weak key releases old document nodes when a layout is dropped.
+const geometryIndexes = new WeakMap();
+
+function geometryIndex(tree, layout) {
+  let index = geometryIndexes.get(layout);
+  if (index?.tree === tree) return index;
+  const byNode = new Map(), boxes = new WeakMap();
+  for (const box of layout.boxes) if (!box.inline && !byNode.has(box.nodeId)) byNode.set(box.nodeId, box);
+  for (const node of tree.nodesById.values()) {
+    if (node.pseudo || node.domNode?.nodeType !== 1 || boxes.has(node.domNode)) continue;
+    // The first actual render node is authoritative, even if it is inline.
+    const box = byNode.get(node.id);
+    boxes.set(node.domNode, box ? { node, box } : null);
+  }
+  index = { tree, boxes, textBounds: null };
+  geometryIndexes.set(layout, index);
+  return index;
+}
+
+/** The first real render node and block box belonging to an element. */
+export function elementBox(tree, layout, element) {
+  return tree && layout ? geometryIndex(tree, layout).boxes.get(element) ?? null : null;
+}
+
+function textBoundsIndex(tree, layout) {
+  const bounds = new WeakMap();
   for (const fragment of layout.fragments) {
     for (const run of fragment.runs) {
       const renderNode = tree.nodesById.get(run.nodeId);
       const owner = renderNode?.domNode?.nodeType === 1
         ? renderNode.domNode
         : renderNode?.domNode?.parentElement;
-      if (!owner || (owner !== element && !element.contains(owner))) continue;
+      if (!owner) continue;
       // A replaced element (an image) spans its own box, not its line's height.
       const replaced = run.type === "image" && run.y != null;
       const top = replaced ? run.y : fragment.y;
-      rects.push({
-        left: run.x,
-        top,
-        right: run.x + run.width,
-        bottom: top + (replaced ? run.height : fragment.height),
-      });
+      const right = run.x + run.width;
+      const bottom = top + (replaced ? run.height : fragment.height);
+      for (let ancestor = owner; ancestor; ancestor = ancestor.parentElement) {
+        const rect = bounds.get(ancestor);
+        if (rect) {
+          rect.left = Math.min(rect.left, run.x);
+          rect.top = Math.min(rect.top, top);
+          rect.right = Math.max(rect.right, right);
+          rect.bottom = Math.max(rect.bottom, bottom);
+        } else bounds.set(ancestor, { left: run.x, top, right, bottom });
+      }
     }
   }
-  if (!rects.length) return null;
-  const left = Math.min(...rects.map((rect) => rect.left));
-  const top = Math.min(...rects.map((rect) => rect.top));
-  const right = Math.max(...rects.map((rect) => rect.right));
-  const bottom = Math.max(...rects.map((rect) => rect.bottom));
-  return Object.freeze({ left, top, right, bottom, width: right - left, height: bottom - top });
+  return bounds;
+}
+
+/** Returns the content-coordinate bounds contributed by an element's text descendants. */
+export function elementBounds(tree, layout, element) {
+  const index = geometryIndex(tree, layout);
+  index.textBounds ??= textBoundsIndex(tree, layout);
+  const rect = index.textBounds.get(element);
+  if (!rect) return null;
+  if (rect.width === undefined) {
+    rect.width = rect.right - rect.left;
+    rect.height = rect.bottom - rect.top;
+    Object.freeze(rect);
+  }
+  return rect;
 }
 
 /**
@@ -120,19 +163,24 @@ export function elementBounds(tree, layout, element) {
  * visibility: hidden or pointer-events: none (both inherited, so a visible
  * or pointer-events: auto descendant still does). Text uses its element's style.
  */
+const hitTestableIndexes = new WeakMap();
 function hitTestable(tree) {
+  const cached = hitTestableIndexes.get(tree);
+  if (cached) return cached;
   const styles = new Map();
   for (const node of tree.nodesById.values()) {
     if (node.domNode?.nodeType === 1 && node.style && !node.pseudo && !styles.has(node.domNode)) {
       styles.set(node.domNode, node.style);
     }
   }
-  return (renderNode) => {
+  const accepts = (renderNode) => {
     const domNode = renderNode?.domNode;
     const element = domNode?.nodeType === 1 ? domNode : domNode?.parentElement;
     const style = (renderNode?.pseudo ? renderNode.style : null) ?? styles.get(element);
     return !style || (style.visibility !== "hidden" && style.pointerEvents !== "none");
   };
+  hitTestableIndexes.set(tree, accepts);
+  return accepts;
 }
 
 function closestInteractive(node) {