@opentiny/next-sdk 0.4.2 → 0.4.3

package/page-tools/tool-config.ts

@@ -1,100 +0,0 @@
-/**
- * tool-config.ts
- *
- * registerPageAgentTool 的完整运行期配置：顶层选项（enableHighlight 等）+ 统一无障碍配置（a11yConfig）。
- * 两者合并到同一个配置对象里，提供唯一一套运行期读写 API（getPageAgentToolConfig/setPageAgentToolConfig）：
- * 注册时初始化一次，之后可随时读取/修改，无需分别记住两套 get/set 函数。
- */
-
-import type { A11yConfig, ResolvedA11yConfig } from './a11y/config'
-import { DEFAULT_A11Y_CONFIG, mergeA11yConfig, mergeA11yConfigs } from './a11y/config'
-
-export interface PageAgentToolConfig {
-  /** 是否启用元素高亮 */
-  enableHighlight: boolean
-  /** 是否在工具调用后移除遮罩， 默认值为 true 移除 */
-  removeMaskAfterToolCall?: boolean
-  /**
-   * 统一无障碍配置：按角色（roles）、状态（states：selected/disabled/error/warning 等）自定义规则，
-   * 以及白名单/黑名单/自定义暴露属性/弹窗选择器。已与默认配置合并（数组类字段是拼接结果）。
-   */
-  a11yConfig: ResolvedA11yConfig
-}
-
-/**
- * 用于初始化（registerPageAgentTool 的入参）或运行期 setPageAgentToolConfig 的补丁对象：
- * enableHighlight 为覆盖式更新；a11yConfig 为拼接式合并（数组类字段追加，不丢已有规则，语义见 a11y/config.ts）。
- */
-export interface PageAgentToolConfigPatch {
-  /** 是否启用元素高亮 */
-  enableHighlight?: boolean
-  /** 是否在工具调用后移除遮罩， 默认值为 true 移除 */
-  removeMaskAfterToolCall?: boolean
-  /** 是否在工具调用后移除遮罩 */
-  /** 统一无障碍配置，会与当前生效的 a11yConfig 按数组拼接合并 */
-  a11yConfig?: A11yConfig
-}
-
-/** registerPageAgentTool(options) 的入参类型，与运行期补丁 {@link PageAgentToolConfigPatch} 完全一致 */
-export type PageAgentToolOptions = PageAgentToolConfigPatch
-
-/** 默认生效的完整工具配置 */
-export const DEFAULT_PAGE_AGENT_TOOL_CONFIG: PageAgentToolConfig = {
-  enableHighlight: false,
-  removeMaskAfterToolCall: true,
-  a11yConfig: DEFAULT_A11Y_CONFIG
-}
-
-declare global {
-  interface Window {
-    /** 运行期唯一生效的 page-agent-tool 完整配置（已与默认值合并），可通过 getPageAgentToolConfig/setPageAgentToolConfig 读写 */
-    __webmcpcli_toolConfig?: PageAgentToolConfig
-  }
-}
-
-/** 读取当前生效的完整工具配置（已与默认值合并）。未初始化时返回默认配置 */
-export function getPageAgentToolConfig(): PageAgentToolConfig {
-  if (typeof window !== 'undefined' && window.__webmcpcli_toolConfig) {
-    return window.__webmcpcli_toolConfig
-  }
-  return {
-    enableHighlight: DEFAULT_PAGE_AGENT_TOOL_CONFIG.enableHighlight,
-    removeMaskAfterToolCall: DEFAULT_PAGE_AGENT_TOOL_CONFIG.removeMaskAfterToolCall,
-    a11yConfig: mergeA11yConfig()
-  }
-}
-
-function resolvePatch(patch: PageAgentToolConfigPatch, base: PageAgentToolConfig): PageAgentToolConfig {
-  return {
-    enableHighlight: patch.enableHighlight ?? base.enableHighlight,
-    removeMaskAfterToolCall: patch.removeMaskAfterToolCall ?? base.removeMaskAfterToolCall,
-    a11yConfig: mergeA11yConfigs(base.a11yConfig, patch.a11yConfig ?? {})
-  }
-}
-
-/**
- * 更新当前生效配置。
- * - patch 为对象时：enableHighlight 覆盖式更新；a11yConfig 与当前配置按数组拼接合并（不丢已有规则）
- * - patch 为函数时：入参为当前生效配置，返回值直接与默认配置合并（而不是再与 current 相加）。
- *   这样函数体内可以对 current.a11yConfig 做任意过滤/裁剪（如按条件"移除"某条旧规则），
- *   返回值即为最终生效的配置，不会因为再与 current 相加而让被过滤掉的旧规则"复活"
- * - options.mode = 'replace' 时（仅影响对象类型的 patch）：不与"当前生效配置"合并，而是与默认配置重新合并
- * 返回合并后的最新完整配置，并写回运行期存储供 buildBrowserStateResponse/buildA11yTree 等读取。
- */
-export function setPageAgentToolConfig(
-  patch: PageAgentToolConfigPatch | ((current: PageAgentToolConfig) => PageAgentToolConfigPatch),
-  options?: { mode?: 'merge' | 'replace' }
-): PageAgentToolConfig {
-  const mode = options?.mode ?? 'merge'
-  const current = getPageAgentToolConfig()
-
-  const next =
-    typeof patch === 'function'
-      ? resolvePatch(patch(current), DEFAULT_PAGE_AGENT_TOOL_CONFIG)
-      : resolvePatch(patch, mode === 'replace' ? DEFAULT_PAGE_AGENT_TOOL_CONFIG : current)
-
-  if (typeof window !== 'undefined') {
-    window.__webmcpcli_toolConfig = next
-  }
-  return next
-}

package/page-tools/utils/dom.ts

@@ -1,158 +0,0 @@
-import { extractSelectors } from '../a11y/config'
-import { getPageAgentToolConfig } from '../tool-config'
-
-// ─── 辅助：Shadow DOM 事件穿透 ───────────────────────────────────────────
-// 外部包 inputTextElement/selectOptionElement 派发的合成事件 composed:false，
-// 无法穿透 shadow boundary，导致事件委托框架（如 React）收不到 shadow 内元素的
-// input/change 事件。这里对 shadow DOM 内元素补发 composed:true 事件。
-export function isInShadowDom(el: Element): boolean {
-  return el.getRootNode() instanceof ShadowRoot
-}
-
-export function dispatchComposedEvents(el: Element, ...types: string[]) {
-  for (const type of types) {
-    el.dispatchEvent(new Event(type, { bubbles: true, composed: true }))
-  }
-}
-
-// ─── 辅助：穿透 Shadow DOM 的查询 ─────────────────────────────────────────
-export function deepQuerySelectorAll(selector: string, root: Document | Element | ShadowRoot = document): Element[] {
-  const elements = Array.from(root.querySelectorAll(selector))
-  
-  const walker = document.createTreeWalker(root, NodeFilter.SHOW_ELEMENT, null)
-  let currentNode: Node | null = walker.currentNode
-  while (currentNode) {
-    if ((currentNode as Element).shadowRoot) {
-      elements.push(...deepQuerySelectorAll(selector, (currentNode as Element).shadowRoot!))
-    }
-    currentNode = walker.nextNode()
-  }
-  return elements
-}
-
-// ─── 辅助：等待 DOM 变更稳定 ────────────────────────────────────────────
-// click/fill/select 操作后，框架（Angular/React/Vue）可能异步插入校验错误、
-// 条件渲染选项等动态内容。用 MutationObserver 监听 DOM 变更，等待变更平息后
-// 再构建 A11y 树，确保动态插入的内容（如 ng-star-inserted 校验提示）被捕获。
-export function waitForDomSettled(timeout = 600, settleTime = 150): Promise<void> {
-  return new Promise<void>((resolve) => {
-    let settled = false
-    let settleTimer: ReturnType<typeof setTimeout> | undefined
-    const finish = () => {
-      if (settled) return
-      settled = true
-      observer.disconnect()
-      if (settleTimer) clearTimeout(settleTimer)
-      resolve()
-    }
-    // 每次有 DOM 变更时重置 settle 计时器；变更平息 settleTime 后视为稳定
-    const observer = new MutationObserver(() => {
-      if (settleTimer) clearTimeout(settleTimer)
-      settleTimer = setTimeout(finish, settleTime)
-    })
-    // 若无任何变更，settleTime 后直接结束
-    settleTimer = setTimeout(finish, settleTime)
-    // 超时保护：timeout 后强制结束，避免无限等待
-    setTimeout(finish, timeout)
-    observer.observe(document.body, {
-      childList: true,
-      subtree: true,
-      attributes: true,
-      attributeFilter: ['class', 'style', 'hidden'],
-    })
-  })
-}
-
-// ─── 辅助：检测页面级模态弹窗/遮罩层 ────────────────────────────────────
-// 仅检测真正阻塞交互的模态弹窗（确认框、提交对话框等），
-// 不检测顶部通知横幅、站内消息等非模态提示，避免误报导致 AI 循环
-export function detectPageDialog(): string {
-  const seen = new Set<Element>()
-  const dialogs: string[] = []
-  // 仅匹配明确的模态弹窗选择器，避免宽泛子串匹配误报
-  // 统一取 getPageAgentToolConfig().a11yConfig.dialogSelectors（已含默认值 + 用户配置）
-  const selectors = getPageAgentToolConfig().a11yConfig.dialogSelectors
-
-  for (const selector of selectors) {
-    try {
-      for (const el of deepQuerySelectorAll(selector)) {
-        if (seen.has(el)) continue
-        // 跳过 SDK 自身遮罩
-        if (el.id?.includes('page-agent-runtime')) continue
-        if (el.closest('#page-agent-runtime_simulator-mask')) continue
-
-        const rect = el.getBoundingClientRect()
-        if (rect.width < 50 || rect.height < 50) continue
-        const style = window.getComputedStyle(el as HTMLElement)
-        if (style.display === 'none' || style.visibility === 'hidden') continue
-
-        // 模态性验证：必须是 fixed/absolute 且 z-index 较高
-        const isFixed = style.position === 'fixed' || style.position === 'absolute'
-        const zIndex = parseInt(style.zIndex || '0', 10)
-        if (!isFixed || zIndex < 100) continue
-
-        // 必须覆盖视口中心区域（真正的模态弹窗会遮挡页面中心）
-        const vw = window.innerWidth
-        const vh = window.innerHeight
-        const coversCenter = rect.left < vw * 0.6 && rect.right > vw * 0.4 &&
-                             rect.top < vh * 0.6 && rect.bottom > vh * 0.4
-        if (!coversCenter) continue
-
-        seen.add(el)
-        const text = (el.textContent || '').trim().replace(/\s+/g, ' ')
-        if (text.length > 5) {
-          // 提取弹窗内的可交互按钮，帮助 AI 快速决策
-          const btns = el.querySelectorAll('button, [role="button"], a')
-          const btnTexts = Array.from(btns)
-            .map(b => (b.textContent || '').trim())
-            .filter(t => t.length > 0 && t.length < 20)
-            .slice(0, 5)
-          const btnInfo = btnTexts.length ? ` [可操作按钮: ${btnTexts.join(' / ')}]` : ''
-          dialogs.push(`${text.substring(0, 300)}${btnInfo}`)
-        }
-      }
-    } catch {
-      // 忽略选择器异常
-    }
-  }
-
-  if (dialogs.length === 0) return ''
-  return `\n[页面弹窗检测] 检测到 ${dialogs.length} 个模态弹窗，请优先处理:\n${dialogs.map((d, i) => `${i + 1}. ${d}`).join('\n')}\n`
-}
-
-// ─── 辅助：检测页面可见的表单校验错误 ──────────────────────────────────
-// 操作后自动扫描页面中的校验错误提示，提取文本并提醒 AI，
-// 避免 AI 卡住时不知道是因为有校验错误未处理
-export function detectValidationErrors(): string {
-  const seen = new Set<Element>()
-  const errors: string[] = []
-  // 校验错误选择器：ARIA 标准 + 主流 UI 框架（可配置）
-  // 统一取 getPageAgentToolConfig().a11yConfig.states.error（已含默认值 + 用户配置）
-  const selectors = extractSelectors(getPageAgentToolConfig().a11yConfig.states.error)
-
-  for (const selector of selectors) {
-    try {
-      for (const el of deepQuerySelectorAll(selector)) {
-        if (seen.has(el)) continue
-        // 跳过嵌套在已收集的错误元素内的子元素，避免重复
-        if (Array.from(seen).some(s => s.contains(el))) continue
-
-        const rect = el.getBoundingClientRect()
-        if (rect.width < 1 || rect.height < 1) continue
-        const style = window.getComputedStyle(el as HTMLElement)
-        if (style.display === 'none' || style.visibility === 'hidden') continue
-
-        const text = (el.textContent || '').trim().replace(/\s+/g, ' ')
-        if (text.length > 2 && text.length < 200) {
-          seen.add(el)
-          errors.push(text)
-        }
-      }
-    } catch {
-      // 忽略选择器异常
-    }
-  }
-
-  if (errors.length === 0) return ''
-  return `\n[校验提示] 检测到 ${errors.length} 个表单校验错误，请先修复后再继续:\n${errors.map((e, i) => `${i + 1}. ${e}`).join('\n')}\n`
-}

package/page-tools/utils/scroll.ts

@@ -1,58 +0,0 @@
-// ─── 辅助：获取滚动目标的当前位置信息（仿 page-agent getPageInfo）────────
-// 同时支持 window（文档滚动）和任意 Element（容器滚动）
-export function getScrollInfo(target: Window | Element = window) {
-  if (target === window) {
-    const pageHeight = Math.max(document.documentElement.scrollHeight, document.body.scrollHeight)
-    const pageWidth = Math.max(document.documentElement.scrollWidth, document.body.scrollWidth)
-    const scrollY = window.scrollY
-    const scrollX = window.scrollX
-    const pixelsBelow = Math.max(0, pageHeight - (window.innerHeight + scrollY))
-    const pixelsRight = Math.max(0, pageWidth - (window.innerWidth + scrollX))
-    return {
-      scrollY, scrollX,
-      pixelsAbove: scrollY, pixelsBelow,
-      pixelsLeft: scrollX, pixelsRight,
-      pagesAbove: window.innerHeight > 0 ? scrollY / window.innerHeight : 0,
-      pagesBelow: window.innerHeight > 0 ? pixelsBelow / window.innerHeight : 0,
-      atTop: scrollY <= 1,
-      atBottom: pixelsBelow <= 1,
-      atLeft: scrollX <= 1,
-      atRight: pixelsRight <= 1,
-    }
-  } else {
-    const el = target as Element
-    const scrollTop = el.scrollTop
-    const scrollLeft = el.scrollLeft
-    const pixelsBelow = el.scrollHeight - el.clientHeight - scrollTop
-    const pixelsRight = el.scrollWidth - el.clientWidth - scrollLeft
-    return {
-      scrollY: scrollTop, scrollX: scrollLeft,
-      pixelsAbove: scrollTop, pixelsBelow: Math.max(0, pixelsBelow),
-      pixelsLeft: scrollLeft, pixelsRight: Math.max(0, pixelsRight),
-      pagesAbove: el.clientHeight > 0 ? scrollTop / el.clientHeight : 0,
-      pagesBelow: el.clientHeight > 0 ? Math.max(0, pixelsBelow) / el.clientHeight : 0,
-      atTop: scrollTop <= 1,
-      atBottom: pixelsBelow <= 1,
-      atLeft: scrollLeft <= 1,
-      atRight: pixelsRight <= 1,
-    }
-  }
-}
-
-// 等待 smooth scroll 结束：优先监听 scrollend，超时兜底（边界无位移时 scrollend 可能不触发）
-export function waitForScrollEnd(target: Window | Element, timeout = 2000): Promise<void> {
-  return new Promise((resolve) => {
-    let settled = false
-    const el = target === window ? document : (target as Element)
-    const finish = () => {
-      if (settled) return
-      settled = true
-      el.removeEventListener('scrollend', onScrollEnd)
-      clearTimeout(timer)
-      resolve()
-    }
-    const onScrollEnd = () => finish()
-    const timer = setTimeout(finish, timeout)
-    el.addEventListener('scrollend', onScrollEnd, { once: true })
-  })
-}

package/remoter/QrCode.ts

@@ -1,54 +0,0 @@
-import QRCodePck from 'qrcode'
-
-/** QrCode 类的配置信息 */
-export type QrCodeOption = ConstructorParameters<typeof QrCode>[1]
-
-/**
- * 二维码工具类,根据传入的value,生成相应的二维码，并输出到 <canvas> 或  <img>上。
- * @example
- * const qr= new QrCode('https://www.baidu.com', { size: 100 })
- *
- * qr.toCanvas(canvasDom)
- * qr.toImage(imgDom)
- */
-export class QrCode {
-  private value: string
-  private size: number
-  private margin: number
-  private color: string
-  private bgColor: string
-
-  constructor(value: string, { size = 200, margin = 4, color = '#000', bgColor = '#fff' }) {
-    this.value = value
-    this.size = size
-    this.margin = margin
-    this.color = color
-    this.bgColor = bgColor
-  }
-
-  get qrCodeOption() {
-    return {
-      width: this.size,
-      margin: this.margin,
-      color: {
-        dark: this.color, // 前景色
-        light: this.bgColor // 背景色
-      }
-    }
-  }
-
-  /** 生成二维码的 Data URL（base64 图片） */
-  async toDataURL(): Promise<string> {
-    return QRCodePck.toDataURL(this.value, this.qrCodeOption)
-  }
-
-  /** 渲染二维码到指定的 canvas 元素 */
-  async toCanvas(canvas: HTMLCanvasElement): Promise<void> {
-    return QRCodePck.toCanvas(canvas, this.value, this.qrCodeOption)
-  }
-
-  /** 渲染二维码到指定的 img 元素 */
-  async toImage(img: HTMLImageElement): Promise<void> {
-    img.src = await this.toDataURL()
-  }
-}