网站一改版自动化脚本就废？聊聊自愈回放的完整设计

网站一改版自动化脚本就废？聊聊自愈回放的完整设计

发布于 2026-09-10 · xbrowser v1.22.0

所有做过浏览器录制回放的团队，都会在三周后撞上同一堵墙：站点发了一次改版，.cta-primary 变成了 Button_variant__3xkQ，所有录制脚本在第 4 步集体阵亡。然后你重新录制、修补选择器，下个迭代再来一遍。

我们用 30 多季自动化攻防竞技场，专门解决"录制脚本如何在改版后活下来"这个问题。这篇文章拆解 xbrowser 回放引擎的自愈设计------在 xbrowser 里，replay 不是失败了事，而是自己恢复。

选择器的本质是一场赌注

一次录制的点击，本质上是押注："这个 CSS 选择器明天还能定位到同一个可交互元素。"每种策略都是不同的赌注，失败模式各不相同：

class 选择器：死于 CSS Module 哈希和原子化框架重构
文案选择器：死于文案修改（"登录" → "Sign in"）
序号选择器 （nth-child）：死于任何布局重排
坐标：死于视口变化和懒加载插入的占位元素

没有单一策略能活过所有改版。所以 xbrowser 的回放解析不是"选一种"，而是一条级联链------而全部工程含量都在这条链里。

自愈级联链

当录制的主选择器解析为空（或解析到错误的元素），回放器按这个顺序走：

css 复制代码

主选择器
  → 录制的文案兜底（textFallback）
  → 语义候选
      partial（id / name / placeholder / class 后缀）
      meta（type / placeholder / aria-label）
      文案锚（button/a 文案的 xpath）
      label 锚（label[for] / 祖先包裹 label）
      唯一 tag / 结构序号
  → 坐标恢复（录制 x/y + elementFromPoint 反解路径）
  → 盲位置（最后手段）
  → 放弃（宁可失败，不打错目标）

比清单更重要的是三个设计决策。

1. 指纹裁决，而不是匹配了就算

每个通过名称匹配的候选，还要和录制时捕获的元素指纹（type、placeholder、文案、尺寸）做分级比对：

type 或 placeholder 矛盾 → 硬拒绝。录制的密码框永远不允许自愈成文本输入框。
仅文案矛盾 → 软接受 。文案修改是实践中最高频 的改版形态，对文案硬拒会让自愈在最需要它的地方失效。软命中在输出里标记 ~soft，方便事后审计。

这一条分级决策，把诱饵测试（同文案、更大尺寸的间谍按钮）从 0/2 打到 2/2------同时不破坏"文案改版"场景。

2. 遮挡感知，而不只是"元素存在"

一个元素可以存在、指纹匹配，但被弹窗遮罩盖住。探测层会预演和真实点击相同的 hit-test------包括沿 getRootNode().host 穿透 shadow DOM------被遮挡的候选直接跳过。落到 cookie 横幅上的"自愈成功"，比失败更糟，因为它是静默的。

3. 自愈器有记忆

自愈成功后，映射关系（失效选择器 → 生效策略）写回按域名组织的知识文件，30 天 TTL 自动剪枝。同一脚本下次回放直接命中 known-heal：零探测成本。知识失效则自动遗忘，完整级联链重新接管。自愈越用越便宜。

但它真的有用吗？

我们的测试方式，就是任何宣称"健壮"的东西该有的测试方式：竞技场 。脚本化变异------class 改名（后缀装饰和全量替换两种）、文案重写、表单行对调、iframe 重挂载、诱饵元素、遮罩陷阱、虚拟列表重建------打到录制好的流程上，回放器必须命中语义正确的目标，判定依据是页面可观测状态，而不是"点到了某个元素"。

当前套件 30+ 场景全部保持 100% 语义正确率------包括那些教训最深的场景：

tag 兜底陷阱 ：裸 input/button 选择器永远"能解析"，于是短路了整个自愈链、点到了错误元素。修复------裸 tag 只对 textarea 这类天然唯一的 tag 生效------现在是我们处处应用的铁律：永远成功的候选，就是永远不验证的候选。
布局位移是坐标盲区：插一个 spacer 占位元素，所有录制坐标全部打偏，而结构序号依然命中。这就是坐标排在语义候选之后的原因。

上手

bash 复制代码

npm install -g @xbrowser/cli

# 录制一个流程
xbrowser record start --url https://example.com/form
# ......正常操作......
xbrowser record stop --output flow.yaml

# 网站改版后直接回放
xbrowser replay flow.yaml
# ✓ step 3  .old-cta → healed via text-anchor (button "立即开始")

回放会打印每一个自愈步骤和最终生效的策略，失败可诊断、自愈率可度量。整个引擎是确定性的------链路里没有 LLM，没有按次 token 成本，恢复是毫秒级的。

xbrowser 采用 MIT 协议开源：github.com/dyyz1993/xb... · npm: www.npmjs.com/package/@xb...

顺带一提：这篇文章的草稿、封面、多平台分发，都是 xbrowser 自己的内容管线完成的。它吃自己的狗粮。