Expect架构全景图Supervisor、Agent、Browser、Cookies五大核心包如何协作【免费下载链接】expectExpect tests your agents code in a real browser项目地址: https://gitcode.com/gh_mirrors/expect6/expectExpect 是一款让 AI 编程代理在真实浏览器里测试自己代码的开源工具它读取你的 Git 变更、自动生成测试计划并用 Playwright 在真实浏览器中执行检查性能、安全、设计与完整性问题再报告给代理去修复。下面从架构视角拆解 Expect 的五大核心包——supervisor、agent、browser、cookies、shared 各自负责什么以及它们如何协作完成一次完整的测试。一、Expect 是什么一条命令的浏览器测试和 Puppeteer、Cypress 等工具需要你手写脚本、维护选择器不同Expect 的定位是给代理装上 QA 超能力读取代码变更自动分析 unstaged、分支 diff 或指定 commit生成测试计划把变更转成可执行的测试步骤真实浏览器执行用 Playwright CDP 驱动真实 Chrome还能注入你系统浏览器的 Cookie模拟已登录的真实用户报告驱动修复把发现的问题交还代理修复后重跑验证二、整体架构一个仓库分工明确Expect 是一个 pnpm monorepo配合 turbo 做构建编排通过 pnpm-workspace.yaml 定义了packages/*与apps/*两组工作区位置内容角色packages/supervisor/expect/supervisor总指挥编排整个测试流程packages/agent/expect/agent代理桥统一接入各家编码代理packages/browser/expect/browser浏览器引擎自动化 快照 MCPpackages/cookies/expect/cookies身份注入提取真实浏览器 Cookiepackages/shared/expect/shared公共底座模型、提示词、工具函数apps/cli/Expect CLI终端交互入口Ink 界面packages/typescript-sdk/expect-sdk面向开发者的编程 SDK依赖关系呈现出清晰的分层结构supervisor 依赖 agent 与 browseragent 依赖 browserbrowser 依赖 cookies而 shared 不依赖任何业务包是所有包的公共底座。三、supervisor编排全流程的总指挥supervisor 包packages/supervisor/package.json是整个系统的调度中心核心组件包括Executorexecutor.ts执行引擎。先通过 Git 服务收集当前分支、变更文件、diff 预览与近期提交再构造执行上下文驱动代理按计划逐条执行测试步骤Plannerplanner.ts把代码变更翻译成结构化测试计划TestPlanReporterreporter.ts汇总每步结果输出最终测试报告Git / Githubgit/git.ts分支、diff、提交等 Git 操作封装Watchwatch.ts持续监听模式代码变更时自动评估并触发测试FlowStorageflow-storage.ts保存与复用测试流程flow支持-f slug快速重跑你可以把它理解为项目经理自己不写测试但知道每一步该让谁做什么。四、agent打通各家编码代理的统一桥Expect 支持 Claude Code、Codex、GitHub Copilot、Gemini CLI、Cursor、OpenCode、Factory Droid 等多家代理。agent 包packages/agent/package.json通过ACPAgent Client Protocol实现了统一抽象detect-agents.ts扫描PATH自动检测本机安装了哪些代理支持-a provider手动指定acp-client.ts与代理建立 ACP 会话流式接收执行事件与用量信息agent.tsAgent服务的核心实现向上暴露统一的流式接口这样 supervisor 无需关心背后到底是哪个代理换一家代理只需换一个后端实现架构上的可插拔性就来自这里。五、browser真实浏览器自动化的核心browser 包是 Expect 的手脚基于 Playwright 提供真实 DOM 级自动化而非截图坐标的计算机使用路线Browser 服务browser.ts启动/连接 Chromeheaded 或 headless创建页面并执行点击、输入等动作CDP 自动发现cdp-discovery.ts可接管一个已打开的 Chrome 实例--cdp或--profile复用现有配置文件快照与 Diffdiff.ts把页面压缩成带引用编号的可读树状快照并对比两次快照找出变化让代理能看懂页面MCP 服务mcp/server.ts、mcp/start-http.ts把浏览器能力封装成 MCP 工具供各类代理按需调用文档见 docs/mcp.md可视化 Overlayruntime/overlay/用 React 在页面上渲染光标、操作标记与进度让测试过程看得见六、cookies让测试用户变成真实用户很多 Bug 只在登录态下出现。cookies 包packages/cookies/负责从你的系统浏览器中提取真实 Cookie 并注入到测试浏览器中浏览器检测browser-detector.ts自动发现本机安装的 Chrome、Firefox、Safari 等及其配置Chromium 系读取chromium.ts解析 SQLite Cookie 库并完成解密CDP 通道cdp-client.ts通过 CDP 直接从运行中的浏览器拉取 Cookie一键提取cookies.ts统一入口browser 包在执行前调用它完成身份注入CI 场景下可用--no-cookies或--ci跳过该步骤无头运行、自动确认计划。七、shared五大包脚下的公共底座shared 包被其余所有业务包依赖提供约定与通用能力模型定义models.tsTestPlan、执行事件等跨包共享的数据结构提示词工程prompts.ts构造规划与执行阶段给代理的提示词浏览器容量估算estimate-browser-capacity.ts根据系统内存估算可安全开多少个浏览器实例可观测性与分析observability/、analytics/链路追踪与遥测八、端到端协作一次测试是怎么跑的把五个包串起来一次典型的/expect运行流程如下CLI 入口apps/cli/ 的终端界面解析参数变更范围、代理、目标 URL、浏览器模式上下文收集supervisor 的 Executor 调 Git 拿到分支、变更文件与 diff 预览规划Planner 把变更翻译成测试计划展示给用户确认-y可跳过执行agent 包建立 ACP 会话代理借助 browser 包的 MCP 工具逐步操作真实页面如需登录态cookies 包已提前注入身份报告与修复Reporter 汇总失败项代理修复代码后自动重跑验证直到通过整个链路中supervisor 出题、agent 做题、browser 动手、cookies 提供身份、shared 提供规则——职责边界干净这也是它容易扩展新代理、新浏览器能力的根本原因。九、上手指南三步体验 如果你想在本地跑起来git clone https://gitcode.com/gh_mirrors/expect6/expect cd expect pnpm install安装技能按官方说明让代理拉取 Expect 页面并执行初始化脚本启动测试在 Claude Code、Codex 等代理中输入/expect看它工作代理生成计划 → 真实浏览器逐步执行 → 发现问题并自动修复重验小结Expect 的架构精髓在于分层清晰——supervisor 编排、agent 适配、browser 自动化、cookies 注入身份、shared 统一约定五包各司其职又通过 Effect 依赖注入紧密协作把让 AI 代理在真实浏览器里验收自己的代码变成了一条命令的事。【免费下载链接】expectExpect tests your agents code in a real browser项目地址: https://gitcode.com/gh_mirrors/expect6/expect创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考