@browserless/agent 14.0.1 → 14.0.3

package/package.json

@@ -2,7 +2,7 @@
   "name": "@browserless/agent",
   "description": "Drive a Puppeteer page toward a natural-language goal using finite decisions.",
   "homepage": "https://browserless.js.org",
-  "version": "14.0.1",
+  "version": "14.0.3",
   "main": "src",
   "author": {
     "email": "hello@microlink.io",
@@ -47,6 +47,7 @@
     "test": "ava",
     "start": "browserless exec examples/wallapop.js --no-headless",
     "benchmark": "browserless exec scripts/benchmark.js",
+    "perf": "node scripts/perf-baseline.js",
     "compare": "browserless exec scripts/compare.js"
   },
   "license": "MIT",
@@ -58,5 +59,5 @@
     "access": "public"
   },
   "types": "src/index.d.ts",
-  "gitHead": "3a6195884bad55e5b3bd1a9aaf221ceaeb7d3d32"
+  "gitHead": "f26f8ff96f57c2f2a848837097b560bd25ddd78a"
 }

package/src/snapshot.js

@@ -1,4 +1,4 @@
-/* global location, scrollX, scrollY, innerWidth, innerHeight, NodeFilter */
+/* global HTMLElement, location, scrollX, scrollY, innerWidth, innerHeight */
 // Adapted from browser-use/jev-ultrafast snapshot.js (MIT). See README.md.
 module.exports = function snapshot () {
   return (() => {
@@ -54,9 +54,39 @@ module.exports = function snapshot () {
       return active
     }
     const safe = e => !['password', 'file', 'hidden'].includes(e.type)
-    const visible = e =>
-      !cache.closest(e, '[aria-hidden="true"],[inert]') &&
-      e.checkVisibility({ checkOpacity: true, checkVisibilityCSS: true })
+    const hiddenMemo = new WeakMap()
+    const visibleMemo = new WeakMap()
+    const hiddenAncestor = element => {
+      const seen = []
+      for (let current = element; current; current = flatParent(current)) {
+        if (hiddenMemo.has(current)) {
+          const found = hiddenMemo.get(current)
+          for (const item of seen) hiddenMemo.set(item, found)
+          return found
+        }
+        seen.push(current)
+        if (current.matches('[aria-hidden="true"],[inert]')) {
+          for (const item of seen) hiddenMemo.set(item, current)
+          return current
+        }
+      }
+      for (const item of seen) hiddenMemo.set(item, null)
+      return null
+    }
+    const visible = e => {
+      if (visibleMemo.has(e)) return visibleMemo.get(e)
+      const shown =
+        !hiddenAncestor(e) && e.checkVisibility({ checkOpacity: true, checkVisibilityCSS: true })
+      visibleMemo.set(e, shown)
+      return shown
+    }
+    // cache.guard runs again at input time, so it must not reuse this snapshot's memos.
+    const visibleNow = e => {
+      for (let current = e; current; current = flatParent(current)) {
+        if (current.matches('[aria-hidden="true"],[inert]')) return false
+      }
+      return e.checkVisibility({ checkOpacity: true, checkVisibilityCSS: true })
+    }
     const name = (e, seen = new Set()) => {
       if (!e || seen.has(e)) return ''
       seen.add(e)
@@ -139,8 +169,10 @@ module.exports = function snapshot () {
         .filter(safe)
         .map(e => [identity(e), e.value, e.checked, e.selectedIndex, e.disabled, e.readOnly])
     ]
+    // A named form control shadows the form's own innerText property.
+    const readInnerText = Object.getOwnPropertyDescriptor(HTMLElement.prototype, 'innerText').get
     cache.guard = e => {
-      if (!e?.isConnected || !visible(e)) return null
+      if (!e?.isConnected || !visibleNow(e)) return null
       const scope =
         cache.closest(e, 'form,dialog,[role="dialog"],article,li,tr,[role="row"]') || flatParent(e)
       return [
@@ -165,7 +197,9 @@ module.exports = function snapshot () {
             ])
           : null,
         e.getAttribute('href'),
-        scope?.innerText?.slice(0, 6000) || '',
+        (scope instanceof HTMLElement
+          ? readInnerText.call(scope).slice(0, 6000)
+          : scope?.textContent?.slice(0, 6000)) || '',
         [...(cache.closest(e, 'form')?.querySelectorAll('input,textarea,select') || [])]
           .filter(safe)
           .map(field => [
@@ -252,37 +286,65 @@ module.exports = function snapshot () {
     const words = []
     const range = document.createRange()
     let length = 0
-    for (const root of roots) {
-      const walker = document.createTreeWalker(
-        root === document ? document.body : root,
-        NodeFilter.SHOW_TEXT
-      )
-      let node
-      while ((node = walker.nextNode()) && length < 6000) {
-        const value = node.textContent.trim()
-        const parent = node.parentElement || root.host
-        if (
-          !value ||
-          !parent ||
-          parent.closest('script,style,noscript,template') ||
-          !visible(parent)
-        ) {
-          continue
-        }
+    const TEXT_SKIP = new Set(['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEMPLATE'])
+    const intersectsViewport = rect =>
+      rect.width > 0 &&
+      rect.height > 0 &&
+      rect.bottom > 0 &&
+      rect.top < innerHeight &&
+      rect.right > 0 &&
+      rect.left < innerWidth
+    const outsideViewport = rect =>
+      rect.width > 0 &&
+      rect.height > 0 &&
+      (rect.bottom <= 0 || rect.top >= innerHeight || rect.right <= 0 || rect.left >= innerWidth)
+    const fullyInside = rect =>
+      rect.top >= 0 &&
+      rect.left >= 0 &&
+      rect.bottom <= innerHeight &&
+      rect.right <= innerWidth &&
+      rect.width > 0 &&
+      rect.height > 0
+    const pushText = (node, skipRect) => {
+      if (length >= 6000 || node.nodeType !== 3) return
+      const value = node.textContent.trim()
+      if (!value) return
+      if (!skipRect) {
         range.selectNodeContents(node)
-        const r = range.getBoundingClientRect()
-        if (
-          r.width > 0 &&
-          r.height > 0 &&
-          r.bottom > 0 &&
-          r.top < innerHeight &&
-          r.right > 0 &&
-          r.left < innerWidth
-        ) {
-          words.push(value)
-          length += value.length
+        if (!intersectsViewport(range.getBoundingClientRect())) return
+      }
+      words.push(value)
+      length += value.length
+    }
+    // Off-screen subtrees are skipped. A fixed node inside one of those subtrees is not read.
+    const collectText = element => {
+      if (length >= 6000 || TEXT_SKIP.has(element.tagName)) return
+      const rect = element.getBoundingClientRect()
+      if (outsideViewport(rect)) return
+      const inside = fullyInside(rect)
+      if (!intersectsViewport(rect) || !visible(element)) {
+        for (const node of element.childNodes) {
+          if (node.nodeType === 1) collectText(node)
         }
+        return
+      }
+      for (const node of element.childNodes) {
+        if (length >= 6000) return
+        if (node.nodeType === 3) pushText(node, inside)
+        else if (node.nodeType === 1) collectText(node)
+      }
+    }
+    for (const root of roots) {
+      if (length >= 6000) break
+      if (root === document) {
+        if (document.body) collectText(document.body)
+        continue
+      }
+      const host = root.host
+      if (host && visible(host)) {
+        for (const node of root.childNodes) pushText(node)
       }
+      for (const child of root.children) collectText(child)
     }
     const unsupported = []
     for (const e of queryAll('iframe,canvas,input[type="password"],input[type="file"]')) {