Create a new page to test scrollable judgement similar to interactive-dynamic.html

[galaxyeye]

Background

There is a need to create a new HTML test page, similar to interactive-dynamic.html, specifically for testing scrollable judgement on elements.

Requirements

• Implement a new HTML page (e.g., interactive-scrollable.html) that contains elements designed to test scrollability detection.
• The page should include at least an element with id scroll_basic that is scrollable.
• Ensure the element can be targeted by the following test snippet:

val basic = service.findElement(ElementRefCriteria(cssSelector = "#scroll_basic"))
    ?: findNodeById(root, "scroll_basic")
assertNotNull(basic)
assertEquals(true, basic!!.isScrollable, "#scroll_basic should be scrollable")

• Add more scenarios for scrollable and non-scrollable elements as needed.
• The new page should be easily extensible for additional scroll-related test cases.

Value

• Improves automated testing for scrollability detection.
• Provides a platform for verifying element scrollability in UI tests.

现有逻辑

核心结论

• isScrollable 是 DOMTreeNodeEx 的一个可空布尔字段，只有在构建“增强 DOM 树”时且启用滚动分析时才会被写入。
• 计算以快照数据为前提：必须包含样式、rects 信息（computedStyles、clientRects、scrollRects），否则一律返回 null 或 false。
• 基础判断严格：需要 overflow/overflow-x/overflow-y 至少有一个为 scroll 或 auto，且 scrollRect 在宽或高上比 clientRect 大超过 1px；否则视为不可滚动。
• 进一步增强：对 iframe/body/html 有加强校验；对嵌套滚动容器进行“去重”（避免祖先已经是滚动容器时把子容器也标成滚动，除非其滚动区域明显不同）。

详细路径与逻辑

第 1 层：基础滚动判断 (ScrollUtils.isActuallyScrollable)

• 文件 ai/platon/pulsar/browser/driver/chrome/dom/ScrollUtils.kt
• 规则摘要：
  • 读取 snapshotNode.computedStyles 的 overflow / overflow-x / overflow-y，只要其中之一是 "scroll" 或 "auto" 才认为“允许滚动”；否则直接 false。
  • 要求 snapshotNode.clientRects 和 snapshotNode.scrollRects 同时存在；否则 false。
  • 对 iframe/frame、body/html 有“尺寸比较”的逻辑，但注意它们依然受 “overflow 必须允许滚动”的前置限制：
    • 只有在 overflow 条件满足后，才进一步判断 scrollRect 宽/高是否比 clientRect 大超过 1px。
  • 对普通元素：只要 scrollRect 宽/高任一维度比 clientRect 大超过 1px 即可认为可滚动。
• 小提示：这意味着对于很多页面常见的 body/html 在未显式设置 overflow 的情况下，这里会返回 false；即使内容超过视口也不会被判为滚动容器。这是当前实现的严格性所在。

第 2 层：增强逻辑 (ChromeCdpDomService.calculateScrollability)

• 文件 ai/platon/pulsar/browser/driver/chrome/dom/ChromeCdpDomService.kt
• 流程：
  1. 若 snap 为空，返回 null（不给出滚动结论）。
  2. 先调用 ScrollUtils.isActuallyScrollable(node) 作为“基础结论”
     • 如果基础结论是 false，直接返回 false（不会再走后续增强判断）。
  3. 对 iframe/body/html 做“更严格”的内容判定
     • 再次比较 scrollRect 与 clientRect 的尺寸（>1px 容差），确保确实有可滚动内容。
  4. 嵌套滚动去重
     • 查看 ancestors 是否已存在 isScrollable==true 且祖先有 scrollRects。
     • 如果祖先已是滚动容器，则比较当前元素的 scrollRects 与祖先们的 scrollRects 是否“几乎相同”：
       • x/y/width/height 与任意祖先的差都小于 5px 视为相同；则当前不标记为滚动，以避免重复。
       • 只有当前 scroll 区域与祖先明显不同，才保留为 true。