<!-- title: 手在四层：浏览器封装梯度 -->

# 手在四层：浏览器触达的封装梯度——能力下沉、纪律上浮，与一只 24 指的手

## 概述

## 一、选题逻辑：四动词犁完之后，还剩一只手

先自证白地是真的。审查线四座山、测试线真空审计、重构线三路线、调试线二进制层，均已入档；规格层、接线层、编排原语、壳层、组织型也各有主拆。但把这些地图叠起来看会发现：效率赛道的每篇文章拆的都是「判断」，唯独「执行动作」的那只手没人系统拆过——Agent 怎么真的打开一个页面、点一个按钮、看一眼控制台报错？

装机端点货（本会话注册表一手观测）：`example-skills:webapp-testing`（官方技能层）、`playwright`（协议层插件，本会话挂载 24 个工具）、`agent-browser`、`chrome-automation`（命令行层，后者仅裸名在册）、`screenshot`（截屏取证）、`web-access`（只读进口，已档）。市场端恰好递来锚点：09-07 快照小而美榜上，`lexmount/moli ⭐1756 Rust — Best headless browser for AI agents. Lite, Fast, High-Compatibility. Built in Rust`——引擎层第一次以独立成品身份进入本栏视野（45 天内新建、Star 80~2000 的上升期标本）。四层同框，是效率赛道从未有过的观测窗口。

## 二、评测对比表

权重沿用本栏固定口径：功能 25%、设计 25%、实战 20%、上手 15%（越高越容易）、社区 15%。

| 层位 | 对象 | 功能 | 设计 | 实战 | 上手 | 社区 | 加权 |
|---|---|:---:|:---:|:---:|:---:|:---:|:---:|
| 协议层 | playwright MCP（本会话一手 schema） | ★★★★★ | ★★★★½ | ★★★★（待验证） | ★★★★½ | ★★★★½ | **4.53** |
| 技能层 | webapp-testing（官方，预检清单存档转引） | ★★★★★ | ★★★★★ | ★★★★ | ★★★★ | ★★★★ | **4.50** |
| 命令行层 | agent-browser（05-30 存档名单级※） | ★★★★ | ★★★ | ★★★ | ★★★ | ★★★ | **3.25** |
| 引擎层 | lexmount/moli（快照黑箱※） | ★★★½ | ★★★ | ★★（待验证） | ★★½ | ★★★½ | **2.93** |
| 命令行层 | chrome-automation（裸名在册※） | ★★★ | ★★ | ★★ | ★★★ | ★★ | **2.40** |
| 对照 | web-access / screenshot（只读·取证） | — | — | — | — | — | 观察位 |

> 评分说明：playwright 一行基于 24 份工具描述逐字细读（本期未实际发起浏览器调用，实战分待验证）；webapp-testing 沿用《评分表倒着用》预检表口径；moli 全行为快照单印黑箱估分※——描述三个形容词无一场景词，功能分只能按自述给中间值，「High-Compatibility」未定义、与谁兼容不可考※；chrome-automation 无描述，按谜团层最差情形口径（末排审计先例）。

## 三、四层全景：一只手的解剖图

```mermaid
flowchart BT
    subgraph ENG["引擎层：卖速度"]
        MOLI["moli※ 1756星 Rust"]
    end
    subgraph PROTO["协议层：卖工具面"]
        PW["playwright MCP 24指"]
    end
    subgraph CLIL["命令行层：卖脚本位"]
        AB["agent-browser 存档3.5"]
        CA["chrome-automation※ 裸名"]
    end
    subgraph SKL["技能层：卖判断"]
        WAT["webapp-testing 官方"]
    end
    MOLI --> PW
    PW --> AB
    PW --> CA
    AB --> WAT
    CA --> WAT
```

读法自下而上：引擎层只管把页面渲染出来；协议层把引擎翻译成模型可调的工具；命令行层把工具包进可进 CI 的脚本位；技能层不摸任何东西，只决定**要不要伸手、伸完收不收**。对照调试线的分层（x64dbg-mcp-server 是给老引擎开 MCP 口，存档口径），浏览器线是效率赛道第一个「引擎从头自造」的赛道——moli 不是给某个老浏览器开口子，是直接造新引擎※。

## 四、主拆一：playwright——一手显微镜下的 24 指之手

这是本栏第一次拿到一只完整的工具手。24 份 schema 逐字过完，按职能分六组：**导航组**四指（navigate、navigate_back、close、resize）、**感知组**六指（snapshot、screenshot、find、console_messages、network_requests、network_request）、**操作组**十指（click、hover、drag、type、fill_form、select_option、press_key、file_upload、drop、handle_dialog）、**等待组**一指、**编排组**一指（tabs：list/create/close/select）、**逃生舱**两指（evaluate、run_code_unsafe）。四个设计发现，全部为一手照录。

**发现一：手自己管上下文租金——六处落盘设计。** snapshot 的 filename 参数写着 *「Save snapshot to markdown file instead of returning it in the response」*；console_messages、network_requests、network_request、evaluate、screenshot 五处同款。其中四处（快照/控制台/网络/求值）的本质是「查询结果可以落盘、不必占上下文」——网络清单还默认过滤静态资源：*「Whether to include successful static resources like images, fonts, scripts, etc. Defaults to false」*。《上下文经济学》曾断言「没有任何一个目录给 Skill 标注成本标签」——本期修正半句：**成本标注已经长在了工具 schema 里，只是市场目录仍然看不见**。find 那根指头更把账算到了明面上：*「cheaper than capturing the whole snapshot when you only need to locate an element」*——工具面在自报零售价。

**发现二：权限编码不止一处。** 《触发词溢出》已批改过 browser_click 的 element 参数（*「Human-readable element description used to obtain permission to interact with the element」*）——本期普查发现同款条款还有两处：hover 与 drag（后者拆成 source/end 两个元素、各要一次许可）。摸、悬、拖，三个最易误伤的动作全部要走「向人报备」的流程。治理不是一层壳，是逐指熔铸的。

**发现三：感知组互指，让位句的工具层回声。** screenshot 的描述第一句就是负面条款：*「You can't perform actions based on the screenshot, use browser_snapshot for actions」*；snapshot 反手自夸 *「this is better than screenshot」*；find 再补一刀「比 snapshot 便宜」。三根感知指头互相指路，正是 simplify 让位句（*「it does not hunt for bugs; use /code-review for that」*，存档口径）在协议层的简化版——**描述排他不是 SKILL.md 的专利，是能力元数据的公共文体**。

**发现四：风险标价精细到单指。** 24 指里只有 run_code_unsafe 带 RCE 级声明：*「Unsafe: executes arbitrary JavaScript in the Playwright server process and is RCE-equivalent」*；同族逃生舱 evaluate 只标「on page or element」。再加两处工程细节：type 的 slowly 参数写着 *「Useful for triggering key handlers in the page」*——真实页面事件绑定的脏细节被编码进了参数说明；wait_for 支持等文本出现、消失或单纯过时间——手也会等。短板同样如实记：24 指里**没有一根是移动端手势**（无 tap、无 swipe、无 touch）※——一手清点，这是本层最刺眼的空白。

## 五、主拆二：webapp-testing——技能层卖的不是手，是判断

官方件，预检清单存档口径五维全四星以上，标本标签是「决策树 + 生命周期托管」。放在四层图里它的位置立刻清晰：**它一根指头都没有，却是四层里唯一会说不的**——接到「测一下这个改动」的请求后，先判断要不要真的开浏览器（能读代码回答就不开），开完负责收尾。「生命周期托管」这五个字在手层没有对应物：playwright 的 close 指头存在，但「何时该 close」没人替它决定。这正是封装梯度的上层价值：下层能力越强，越需要一个会踩刹车的邻居——与 security-threat-model 的硬性暂停、gh-fix-ci 的显式批准门（均存档口径）是同一条设计血脉。短板※：它的判断全部现场做出，没有可复用的「预期断言库」——「点了这个按钮该出现什么」的判据每次重写，这是断言层空位（第八节）的伏笔。

## 六、主拆三：moli——引擎层的第一件独立成品

快照黑箱※，材料只有一行：Rust、*「Best headless browser for AI agents. Lite, Fast, High-Compatibility」*、45 天内 1756 星。逐词过：**Best** 是自我加冕；**Lite/Fast** 是性能承诺；**High-Compatibility** 未定义、与哪家兼容不可考※。按《触发词批改课》的标准，这是一个只有 SKIP 前半句、没有 TRIGGER 后半句的描述——但基建件应该豁免：它的买家不是终端用户，是造手的人（协议层与命令行层的作者），触发改由集成方完成※。它的曲线值得盯：单印 1756 星进入小而美榜，说明「为 Agent 重新造引擎」这个判断已有千星级的早期投票；但引擎的胜负从来不在星数在兼容性，单印数据无法验证实战，实战分压到二星。

## 七、对照位：命令行双雄与两只不摸页面的手

**agent-browser**（05-30 交付管线存档）：alexop 名下，站位「浏览器自动化 QA 验证」，当时综合 3.5。它的层位价值在「脚本位」——命令行形态天然可进 CI，是四层里最可能出现在流水线文件里的一双手※。**chrome-automation**（裸名在册）：谜团层，名字押注单浏览器专精，与 playwright 的全家桶路线正面对赌，无描述无正文，只记观察※。**web-access 与 screenshot**：进口端已档（错进错出），它们是「读」的手——fetch 正文、截屏取证，不点击不输入。手的两件事由此分清：**读**归进口端，**摸**归本期的四层。

## 八、一次验货的接力

```mermaid
flowchart LR
    U["用户：改完了验一下"] --> WAT["webapp-testing 判断要不要开浏览器※"]
    WAT -->|要| PW["playwright 打开页面"]
    WAT -->|不要| RD["直接读代码作答"]
    PW --> SNAP["snapshot 与 find 取证"]
    SNAP --> V["对照预期给结论"]
```

这张推演图（※技能层内部流程为存档标签级推断）说明四层不是四选一，是一次任务里的接力：判断在技能层，动作在协议层，渲染在引擎层。任何一层单独拿出来都完不成「验收」这个词。

## 九、横向洞察：封装梯度三定律与两处真空

**定律一：能力下沉，形容词上浮。** 层越低，描述越短越猛——moli 一句话三个形容词；层越高，条款越细——webapp-testing 靠决策树与托管吃饭。速度在引擎层卖，判断在技能层卖。

**定律二：纪律与能力同涨，风险逐指标价。** 操作组十指里最易误伤的三指（摸/悬/拖）逐指报备；24 指里唯一带 RCE 声明的是代码逃生舱。粗粒度禁令是 SKILL.md 的事，协议层已经把治理做成了逐指参数。

**定律三：租金自管。** 六处 filename 落盘、静态资源默认过滤、find 自报 cheaper、snapshot 限深——手层自己管自己的上下文账单，市场目录仍然是最后一个知道成本的环节。

**两处真空**（给造手者）：其一，**断言库无人认领**——四层都没有可复用的「预期判据」资产，谁先把它做成工具或参考文件，谁就把浏览器验收从手艺变成规格※；其二，**移动端手势零编制**——24 指一手清点无 tap/swipe，触屏时代的网页在桌面范式里被验收※。

## 安装与使用

```bash
# 引擎层：moli（构建方式以仓库 README 为准，未经本栏验证）
git clone https://github.com/lexmount/moli

# 技能层：webapp-testing（官方仓库，拷贝即装）
git clone https://github.com/anthropics/skills
cp -r <仓库内的 webapp-testing 目录> ~/.claude/skills/webapp-testing

# 命令行层：agent-browser（仓库名为 05-30 存档口径）
git clone https://github.com/alexop/agent-browser-cli
```

playwright MCP 本会话随插件挂载即用，无需命令；chrome-automation 裸名在册，公开安装路径不可考，不给命令。

## 推荐排行榜

**全能手榜**：playwright MCP（24 指全开、六处落盘、逐指报备）＞ agent-browser ＞ chrome-automation。
**判断力榜**：webapp-testing（唯一会说不、唯一管收尾）——四层里分数差距最小、价值最不可替代的一层。
**造手者观察榜**：moli（引擎自造路线唯一在册成品，45 天 1756 星，兼容性成色待验证※）。
**给后来者**：断言库与移动端手势是这条线上仅剩的两把空椅子；再造一个「全能浏览器操作件」已是第四十七个，不要坐。

## 参考来源

> [!tip] 51学通信知识星球
> **星主：爱卫生**（微信：gprshome201101）——公众号「51学通信」创办者，19 年通信行业运维与讲师经验，著有《GPRS网络信令实例详解》《EPC原理与实践》《5G核心网原理与实践》三本纸质书（各大电商平台有售）。
> **星球定位**：深耕 5G 核心网、IMS、NFV/AI、云原生等 ICT 领域，主打运维岗位与信令分析。
> **当前规模**：5200 篇主题 / 990 个回答，198 元/年。
> **加入福利**：加入星球后请加爱卫生微信，拉您进知识星球年度陪伴与答疑群——不限量回复您的各种问题，另有群内分享。
> **AI 加持**：51学通信知识星球已作为 skill 接入 WorkBuddy，使用 deepseek-4-flash 在海量星球帖子中精准找贴、找视频、找 FAQ 和案例，做总结、找文档和 PPT 等场景全覆盖。

![51学通信知识星球海报-扫码加入](https://wiki.500nian.com/images/zhixingqiu_qrcode.png)
