bun-browser

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Browse — Browser QA Tool

Browse — 浏览器QA工具

Overview

概述

browse
is a CLI tool for AI-agent-driven browser automation. It wraps Playwright behind a persistent daemon that listens on a Unix socket, so every command after the first cold-start (~3s) runs in sub-200ms. Session state (cookies, localStorage, auth tokens) persists across commands. Use it for QA verification, visual checks, form interaction, auth testing, and automated healthchecks.
browse
是一款由AI Agent驱动的浏览器自动化CLI工具。它在持久化守护进程后封装了Playwright,该守护进程监听Unix socket,因此首次冷启动(约3秒)后的所有命令运行时间都在200毫秒以内。会话状态(Cookie、localStorage、身份验证令牌)可在多个命令间持久化。可用于QA验证、视觉检查、表单交互、身份验证测试以及自动化健康检查。

Quick start

快速开始

Just run any command — the daemon cold-starts automatically if it isn't already running.
browse goto https://staging.example.com    # navigate
browse snapshot                            # see page structure with refs
browse screenshot                          # capture the page
browse quit                                # shut down the daemon
First useful sequence:
browse goto <url>
browse snapshot
browse screenshot
.
只需运行任意命令——如果守护进程尚未运行,它会自动冷启动。
browse goto https://staging.example.com    # 导航
browse snapshot                            # 查看带引用标记的页面结构
browse screenshot                          # 捕获页面截图
browse quit                                # 关闭守护进程
实用操作序列:
browse goto <url>
browse snapshot
browse screenshot

Command reference

命令参考

Navigation and content

导航与内容

browse goto <url>                          Navigate to URL, return page title
browse text                                Return visible text content of the page
browse quit                                Shut down the daemon
browse wipe                                Clear all session data (cookies, storage, buffers, refs)
browse benchmark [--iterations N]          Measure command latency (p50/p95/p99)
browse goto <url>                          导航至指定URL,返回页面标题
browse text                                返回页面可见文本内容
browse quit                                关闭守护进程
browse wipe                                清除所有会话数据(Cookie、存储、缓冲区、引用标记)
browse benchmark [--iterations N]          测量命令延迟(p50/p95/p99)

Timeout control

超时控制

Any command accepts
--timeout <ms>
to override the default 30s timeout:
browse goto https://slow-page.example.com --timeout 60000
Timeout precedence:
--timeout
flag > config file
timeout
> 30s default. Commands
quit
and
benchmark
are exempt from timeout.
所有命令都可通过
--timeout <ms>
参数覆盖默认的30秒超时时间:
browse goto https://slow-page.example.com --timeout 60000
超时优先级:
--timeout
参数 > 配置文件中的
timeout
设置 > 30秒默认值。
quit
benchmark
命令不受超时限制。

Snapshot and interaction (ref system)

快照与交互(引用标记系统)

browse snapshot                            Interactive elements with refs (@e1, @e2, ...)
browse snapshot -i                         Include structural elements (headings, text)
browse snapshot -f                         Full accessibility tree dump
browse click @eN                           Click element by ref
browse fill @eN "value"                    Fill input by ref (clears first)
browse select @eN "option"                 Select dropdown option by visible text
browse snapshot                            生成带引用标记(@e1、@e2等)的可交互元素快照
browse snapshot -i                         包含结构性元素(标题、文本)
browse snapshot -f                         导出完整可访问性树
browse click @eN                           通过引用标记点击元素
browse fill @eN "value"                    通过引用标记填充输入框(会先清空内容)
browse select @eN "option"                 通过可见文本选择下拉选项

Visual and debugging

视觉与调试

browse screenshot [path]                   Full-page screenshot (auto-generates path if omitted)
browse screenshot --viewport               Viewport only (no scroll)
browse screenshot --selector ".css"        Element-level screenshot
browse console                             Console messages since last call (drains buffer)
browse console --level error               Filter to a specific level (error, warning, log, info, debug)
browse console --keep                      Return messages without clearing the buffer
browse network                             Failed requests (4xx/5xx) since last call (drains buffer)
browse network --all                       All requests including successful ones
browse network --keep                      Return requests without clearing the buffer
browse screenshot [path]                   生成全页截图(若省略路径则自动生成)
browse screenshot --viewport               仅捕获视口内容(不滚动)
browse screenshot --selector ".css"        捕获指定CSS选择器对应的元素截图
browse console                             返回上次调用后的控制台消息(清空缓冲区)
browse console --level error               过滤指定级别消息(error、warning、log、info、debug)
browse console --keep                      返回消息但不清空缓冲区
browse network                             返回上次调用后的失败请求(4xx/5xx状态码,清空缓冲区)
browse network --all                       返回所有请求(包括成功请求)
browse network --keep                      返回请求但不清空缓冲区

Auth and session

身份验证与会话

browse auth-state save <path>              Export cookies + localStorage to file
browse auth-state load <path>              Restore session from file
browse login --env <name>                  Automated login using configured environment
browse tab list                            Show open tabs with indices
browse tab new [url]                       Open new tab (optionally navigating to URL)
browse tab switch <index>                  Switch to tab by 1-based index
browse tab close [index]                   Close tab by index (defaults to current)
browse auth-state save <path>              将Cookie + localStorage导出至文件
browse auth-state load <path>              从文件恢复会话
browse login --env <name>                  使用配置的环境变量自动完成登录
browse tab list                            显示所有打开的标签页及其索引
browse tab new [url]                       打开新标签页(可指定导航URL)
browse tab switch <index>                  切换至指定索引的标签页(索引从1开始)
browse tab close [index]                   关闭指定索引的标签页(默认关闭当前标签页)

Flows and assertions

流程与断言

browse flow list                           List configured flows from browse.config.json
browse flow <name> --var key=value         Execute a named flow with variable substitution
browse assert visible <selector>           Assert element is visible on page
browse assert not-visible <selector>       Assert element is not visible
browse assert text-contains <text>         Assert page body contains text
browse assert text-not-contains <text>     Assert page body does not contain text
browse assert url-contains <substring>     Assert current URL contains substring
browse assert url-pattern <regex>          Assert current URL matches regex
browse assert element-text <sel> <text>    Assert element's text contains string
browse assert element-count <sel> <n>      Assert element count equals n
browse assert permission <name> granted    Check permission via config (navigates to page)
browse assert permission <name> denied     Check permission denial via config
browse healthcheck --var base_url=<url>    Run healthcheck across configured pages
browse wipe                                Clear cookies, storage, buffers, refs, close extra tabs
browse flow list                           列出browse.config.json中配置的所有流程
browse flow <name> --var key=value         执行指定名称的流程并替换变量
browse assert visible <selector>           断言元素在页面上可见
browse assert not-visible <selector>       断言元素在页面上不可见
browse assert text-contains <text>         断言页面正文包含指定文本
browse assert text-not-contains <text>     断言页面正文不包含指定文本
browse assert url-contains <substring>     断言当前URL包含指定子串
browse assert url-pattern <regex>          断言当前URL匹配指定正则表达式
browse assert element-text <sel> <text>    断言指定元素的文本包含指定字符串
browse assert element-count <sel> <n>      断言指定元素的数量等于n
browse assert permission <name> granted    通过配置检查权限(会导航至指定页面)
browse assert permission <name> denied     通过配置检查权限是否被拒绝
browse healthcheck --var base_url=<url>    在配置的页面上运行健康检查
browse wipe                                清除Cookie、存储、缓冲区、引用标记,关闭多余标签页

The ref system

引用标记系统

Refs are the primary way to target elements on the page. They replace CSS selectors for most interactions.
  • Always snapshot before interacting. Refs are assigned by
    browse snapshot
    and are the only way to target elements.
  • Refs are ephemeral. They regenerate on every
    snapshot
    call. Old refs become invalid.
  • Refs go stale after navigation. Any
    goto
    or click that triggers navigation invalidates refs. The tool returns a clear error — just run
    browse snapshot
    again.
  • Ref format:
    @e1
    ,
    @e2
    ,
    @e3
    , etc. Assigned sequentially in depth-first order.
Typical interaction loop:
browse snapshot              # see what's on the page
browse fill @e3 "test"       # fill the search field
browse click @e4             # click a button
browse snapshot              # re-snapshot after the page changes
If you see
"Refs are stale"
or
"Unknown ref"
, run
browse snapshot
to refresh.
引用标记是定位页面元素的主要方式,多数交互操作可替代CSS选择器。
  • 交互前务必先生成快照:引用标记由
    browse snapshot
    命令分配,是定位元素的唯一有效方式。
  • 引用标记是临时的:每次调用
    snapshot
    都会重新生成引用标记,旧标记会失效。
  • 导航后引用标记会过期:任何
    goto
    命令或触发导航的点击操作都会使引用标记失效。工具会返回明确的错误提示——只需重新运行
    browse snapshot
    即可。
  • 引用标记格式
    @e1
    @e2
    @e3
    等,按深度优先顺序依次分配。
典型交互流程
browse snapshot              # 查看页面当前元素
browse fill @e3 "test"       # 填充搜索框
browse click @e4             # 点击按钮
browse snapshot              # 页面变化后重新生成快照
若看到
"Refs are stale"
"Unknown ref"
提示,运行
browse snapshot
刷新引用标记即可。

QA methodology

QA测试方法

Recommended workflow for a QA pass:
  1. Navigate:
    browse goto <url>
    .
  2. Observe:
    browse snapshot
    to see page structure.
    browse screenshot
    for visual state.
  3. Check for errors:
    browse console --level error
    after every navigation.
  4. Interact:
    browse fill
    ,
    browse click
    ,
    browse select
    to exercise forms and flows.
  5. Verify:
    browse snapshot
    or
    browse screenshot
    after each interaction to confirm the expected result.
  6. Repeat: Move through the application's pages and flows.
For configured applications, use
browse healthcheck
first to get a quick pass/fail across key pages, then drill into failures.
推荐的QA测试流程:
  1. 导航
    browse goto <url>
  2. 观察:运行
    browse snapshot
    查看页面结构,
    browse screenshot
    保存视觉状态。
  3. 检查错误:每次导航后运行
    browse console --level error
    检查控制台错误。
  4. 交互操作:使用
    browse fill
    browse click
    browse select
    测试表单与流程。
  5. 验证结果:每次交互后运行
    browse snapshot
    browse screenshot
    确认预期结果。
  6. 重复操作:遍历应用的所有页面与流程。
针对已配置的应用,可先运行
browse healthcheck
快速检查关键页面的通过/失败状态,再深入排查失败项。

Authentication

身份验证

Preferred — configured login:
browse login --env staging
Uses credentials from environment variables defined in
browse.config.json
. Navigates to the login page, fills credentials, submits, and waits for the success condition.
Manual login:
browse goto https://app.example.com/login
browse snapshot
browse fill @e1 "user@example.com"
browse fill @e2 "password123"
browse click @e3
browse snapshot        # verify redirect / dashboard loaded
Session reuse:
browse auth-state save /tmp/auth.json      # after logging in
browse auth-state load /tmp/auth.json      # in a future session
Save auth state after a successful login. Load it in future sessions to skip re-authentication.
Session cleanup:
Use
browse wipe
to clear all session data without restarting the daemon:
  • After testing with production-like credentials.
  • Before switching between user roles/accounts.
  • At the end of a QA session.
推荐方式——配置化登录
browse login --env staging
使用
browse.config.json
中定义的环境变量凭据,自动导航至登录页、填充凭据、提交表单,并等待登录成功条件触发。
手动登录
browse goto https://app.example.com/login
browse snapshot
browse fill @e1 "user@example.com"
browse fill @e2 "password123"
browse click @e3
browse snapshot        # 验证是否跳转至仪表盘
会话复用
browse auth-state save /tmp/auth.json      # 登录成功后保存会话状态
browse auth-state load /tmp/auth.json      # 后续会话中加载状态
登录成功后保存身份验证状态,后续会话中加载该状态可跳过重新登录步骤。
会话清理
使用
browse wipe
命令清除所有会话数据,无需重启守护进程:
  • 使用类生产环境凭据测试后。
  • 切换用户角色/账户前。
  • QA测试会话结束后。

Common failure patterns and recovery

常见故障模式与恢复方案

SymptomCauseFix
"Refs are stale"
Page changed since last snapshotRun
browse snapshot
"Unknown ref: @e7"
Ref doesn't exist in current snapshotRun
browse snapshot
to see available refs
"Daemon connection lost"
Daemon crashed or was killedJust run the command again — CLI auto-restarts the daemon and retries once
"Command timed out after Nms"
Page is slow or unresponsiveUse
--timeout 60000
for slow pages, or check URL/network
"Daemon crashed and recovery failed"
Daemon restart also failedCheck system resources, try
browse quit
then retry
"No element matching selector"
CSS selector is wrongCheck the selector, use
browse snapshot -f
for full tree
Login failsCredentials missing or wrongCheck env vars, verify login URL, use
browse screenshot
to see the page
症状原因解决方法
"Refs are stale"
自上次快照后页面已发生变化运行
browse snapshot
"Unknown ref: @e7"
当前快照中不存在该引用标记运行
browse snapshot
查看可用的引用标记
"Daemon connection lost"
守护进程崩溃或被终止重新运行命令即可——CLI会自动重启守护进程并重试一次
"Command timed out after Nms"
页面加载缓慢或无响应对慢页面使用
--timeout 60000
参数,或检查URL/网络状态
"Daemon crashed and recovery failed"
守护进程重启失败检查系统资源,尝试运行
browse quit
后重试
"No element matching selector"
CSS选择器错误检查选择器,使用
browse snapshot -f
查看完整元素树
登录失败凭据缺失或错误检查环境变量,验证登录URL,使用
browse screenshot
查看页面状态

Configuration

配置

The tool is configured via
browse.config.json
in the project root. All sections except
environments
are optional.
json
{
  "environments": {
    "staging": {
      "loginUrl": "https://staging.example.com/login",
      "userEnvVar": "BROWSE_STAGING_USER",
      "passEnvVar": "BROWSE_STAGING_PASS",
      "usernameField": "input[name=email]",
      "passwordField": "input[name=password]",
      "submitButton": "button[type=submit]",
      "successCondition": { "urlContains": "/dashboard" }
    }
  },
  "flows": {
    "signup": {
      "description": "Test the signup flow",
      "variables": ["base_url", "test_email", "test_pass"],
      "steps": [
        { "goto": "{{base_url}}/register" },
        { "fill": { "input[name=email]": "{{test_email}}" } },
        { "click": "button[type=submit]" },
        { "wait": { "urlContains": "/welcome" } },
        { "screenshot": true },
        { "assert": { "textContains": "Welcome" } }
      ]
    }
  },
  "permissions": {
    "create-user": {
      "page": "{{base_url}}/admin/users",
      "granted": { "visible": "button.create-user" },
      "denied": { "textContains": "Access denied" }
    }
  },
  "healthcheck": {
    "pages": [
      { "url": "{{base_url}}/dashboard", "screenshot": true, "console": "error" },
      { "url": "{{base_url}}/settings", "assertions": [{ "visible": ".settings-form" }] }
    ]
  },
  "timeout": 45000
}
See the project documentation for the full configuration schema.
工具通过项目根目录下的
browse.config.json
文件进行配置,除
environments
外所有配置项均为可选。
json
{
  "environments": {
    "staging": {
      "loginUrl": "https://staging.example.com/login",
      "userEnvVar": "BROWSE_STAGING_USER",
      "passEnvVar": "BROWSE_STAGING_PASS",
      "usernameField": "input[name=email]",
      "passwordField": "input[name=password]",
      "submitButton": "button[type=submit]",
      "successCondition": { "urlContains": "/dashboard" }
    }
  },
  "flows": {
    "signup": {
      "description": "Test the signup flow",
      "variables": ["base_url", "test_email", "test_pass"],
      "steps": [
        { "goto": "{{base_url}}/register" },
        { "fill": { "input[name=email]": "{{test_email}}" } },
        { "click": "button[type=submit]" },
        { "wait": { "urlContains": "/welcome" } },
        { "screenshot": true },
        { "assert": { "textContains": "Welcome" } }
      ]
    }
  },
  "permissions": {
    "create-user": {
      "page": "{{base_url}}/admin/users",
      "granted": { "visible": "button.create-user" },
      "denied": { "textContains": "Access denied" }
    }
  },
  "healthcheck": {
    "pages": [
      { "url": "{{base_url}}/dashboard", "screenshot": true, "console": "error" },
      { "url": "{{base_url}}/settings", "assertions": [{ "visible": ".settings-form" }] }
    ]
  },
  "timeout": 45000
}
完整配置架构请查看项目文档。