buninu-browser 0.2.2 → 0.2.4

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) {