页面检查与交互
找到页面之后,你可以把要完成的任务交给 agent。它通过快照理解页面结构,选择元素执行操作,再读取页面状态确认结果。
切换主题,并确认生效
继续连接指南中的对话:agent 已读取 lynx-devtool skill,并找到了 Settings 页面。下面沿用同一个 client android-phone:8901 和 session 1,让它完成一次主题切换。
把刚才那个 Settings 页切换到 Ocean 主题,帮我确认是否生效。
思路:先查看页面结构,找到 Ocean 按钮,并记录切换前的背景色。
agent-lynx snapshot --client android-phone:8901 --session 1找到 Ocean 按钮
# 检查上一节选中的页面。这里只展示与主题切换有关的快照分支。
agent-lynx snapshot --client android-phone:8901 --session 1@e1 [scroll-view] @(207,426) {scrollable}
└─ @e2 [view] @(207,436)
├─ @e3 [view] @(207,46)
│ ├─ @e4 [text] "Settings" @(207,35)
│ └─ …
├─ @e6 [view] @(207,153)
│ ├─ …
│ └─ @e10 [view] @(207,183)
│ ├─ …
│ └─ @e15 [view] @(324,182)
│ └─ @e16 [text] "Ocean" @(323,183)
└─ …agent-lynx get style @e1 --property background-color --client android-phone:8901 --session 1记录当前背景色
# 读取页面根容器的计算样式,留作切换后的对照。
agent-lynx get style @e1 --property background-color --client android-phone:8901 --session 1background-color: rgba(9, 9, 11, 1)思路:Ocean 文字位于 @e15 按钮内。我会点击这个容器,再检查页面的实际变化。
agent-lynx tap @e15 --snapshot --client android-phone:8901 --session 1已点击并刷新快照
# 点击当前快照中的 Ocean 按钮,并刷新 daemon 缓存的元素引用。
agent-lynx tap @e15 --snapshot --client android-phone:8901 --session 1Tapped @e15 at (324,182). Snapshot refreshed with 69 refs.思路:接着读取新快照,重新确认页面根节点,再比较它的背景色。
agent-lynx snapshot --client android-phone:8901 --session 1确认最新元素引用
# 读取操作后的元素树。主题切换后结构相同,这里仍节选主题分支。
agent-lynx snapshot --client android-phone:8901 --session 1@e1 [scroll-view] @(207,426) {scrollable}
└─ @e2 [view] @(207,436)
├─ @e3 [view] @(207,46)
│ ├─ @e4 [text] "Settings" @(207,35)
│ └─ …
├─ @e6 [view] @(207,153)
│ ├─ …
│ └─ @e10 [view] @(207,183)
│ ├─ …
│ └─ @e15 [view] @(324,182)
│ └─ @e16 [text] "Ocean" @(323,183)
└─ …agent-lynx get style @e1 --property background-color --client android-phone:8901 --session 1背景色已改变
# 使用新快照中的根节点读取背景色,核对主题是否发生变化。
agent-lynx get style @e1 --property background-color --client android-phone:8901 --session 1background-color: rgba(15, 23, 42, 1)已切换到 Ocean 主题。页面根容器的背景色从
rgba(9, 9, 11, 1) 变为 rgba(15, 23, 42, 1)
,与这个示例的 Ocean 主题背景色一致。
这段对话从页面结构中找到目标:Ocean 文字位于 @e16,包裹它的按钮容器是 @e15。点击后,agent 读取新的元素树,再比较页面根节点的计算样式。最终结论由操作前后的页面状态支撑。
@eN 是当前页面快照中的元素引用,由 daemon 在命令之间保存。页面跳转、重载或内容变化后,应读取新快照,再从中选择目标。示例里主题切换没有改变树结构,编号保持相同;其他页面的编号可能改变。
目标在屏幕外时,先滚动再检查
完整快照可以包含标为 offscreen 的节点。它们能帮助 agent 知道页面还有什么内容。接着查看 Settings 页底部,就需要先找到 scrollable 容器,滚动后再检查可见区域。
再看看这个页面底部还有什么内容,只查看,不用点击按钮。
思路:先检查完整快照,找到滚动容器和当前屏幕外的内容。
agent-lynx snapshot --client android-phone:8901 --session 1底部按钮在屏幕外
# 完整快照也包含屏幕外的节点。这里只展示页面底部的分支。
agent-lynx snapshot --client android-phone:8901 --session 1@e1 [scroll-view] @(207,426) {scrollable}
└─ @e2 [view] @(207,436)
├─ …
└─ @e61 [view] @(207,816)
├─ @e62 [view] @(207,818)
│ ├─ @e63 [text] "Danger Zone" @(207,808)
│ └─ @e64 [text] "Irreversible and destructive actions." @(207,832)
└─ @e65 [view] @(207,871) {offscreen}
├─ @e66 [view] @(91,871) {offscreen}
│ └─ @e67 [text] "Delete Account" @(91,871) {offscreen}
└─ @e68 [view] @(186,871) {offscreen}
└─ @e69 [text] "Cancel" @(186,871) {offscreen}思路:底部节点带有 offscreen 标记。我会向下滚动 @e1,再查看可见区域。
agent-lynx scroll @e1 --direction down --snapshot --client android-phone:8901 --session 1已向下滚动
# 滚动最新快照中标为 scrollable 的容器,并刷新元素引用。
agent-lynx scroll @e1 --direction down --snapshot --client android-phone:8901 --session 1Scrolled @e1 down. Snapshot refreshed with 69 refs.agent-lynx snapshot --visible-only --client android-phone:8901 --session 1确认底部可见内容
# 读取滚动后的可见元素。底部节点已进入视口,以下节选对应分支。
agent-lynx snapshot --visible-only --client android-phone:8901 --session 1@e1 [scroll-view] @(207,426) {scrollable}
└─ @e2 [view] @(207,376)
├─ …
└─ @e61 [view] @(207,756)
├─ @e62 [view] @(207,758)
│ ├─ @e63 [text] "Danger Zone" @(207,748)
│ └─ @e64 [text] "Irreversible and destructive actions." @(207,772)
└─ @e65 [view] @(207,811)
├─ @e66 [view] @(91,811)
│ └─ @e67 [text] "Delete Account" @(91,811)
└─ @e68 [view] @(186,811)
└─ @e69 [text] "Cancel" @(186,811)页面底部是 Danger Zone,包含 Delete Account 和 Cancel 按钮,以及不可逆操作的说明。我只滚动查看了内容。
这里的验证依据是滚动后的可见快照:底部按钮已经进入视口。若只想确认当前画面中的元素,可以让 agent 使用 snapshot --visible-only;需要了解屏幕外还有什么时,则读取完整快照。
检查与交互能力
下一节的标注截图使用同一个 Settings 示例,展示可见标注框与元素引用如何对应。若操作后没有出现预期变化,可以继续查看日志和运行时状态。具体参数、快照刷新行为和等待单位见 CLI 参考。