跳到正文
FunCoding

搜索

搜索文档、Skill 和 MCP

verify

Drive an engine app headlessly in a pty, record a video of the whole verification, and open a summary page (video + timeline + checks) with pixel open.

浏览器自动化3.7k.claude/skills/verify/SKILL.md

安装

把这段话发给 Claude Code、Codex 或 Cursor。智能体会先检查安全性,你确认后才安装。

读取 https://funcoding.ai/skills/zenbu-labs/terminal-browser/verify/install.md ,按里面的步骤帮我安装这个 Skill。

SKILL.md

Apps here render via the kitty graphics protocol, so they can be verified without a real terminal. Every verification is recorded: the harness in tools/verify-recorder/ captures every frame the app emits, overlays your inputs (click ripples, caption bar), encodes a video, and generates a summary page. Do not hand-roll one-off pty scripts that only dump PNGs.

Writing a verification

Write a driver script (in /tmp is fine) using the checked-in package:

import sys
sys.path.insert(0, "<repo>/tools/verify-recorder")
from driver import Driver
from recorder import Recorder

rec = Recorder("wheel-pan", title="Wheel pan keeps cursor anchored")
d = Driver(["<repo>/engine/target/debug/typing"], rec,
           cols=120, rows=32, xpixel=1200, ypixel=800)

d.pump(3.0)                                  # pump between actions so frames arrive
rec.check("app painted", d.frame_size is not None, f"{d.frame_size}")
w, h = d.frame_size                          # REAL framebuffer size — always use this

d.text("hello", "type into editor")          # every input takes a description
d.click(w // 2, h // 3, "select the note")   # mouse coords are pixels (1016 mode)
d.wheel(w // 2, h // 2, down=True, n=3, description="scroll content")
d.pump(1.0)
rec.check("scroll redrew", len(rec.frames) > 40, f"{len(rec.frames)} frames")
rec.still("after-scroll")                    # named snapshot for the summary page

d.stop("ctrl+c")                             # or "ctrl+q" depending on the app
rec.finish()                                 # composites markers, encodes mp4, writes summary
  • Driver spawns the argv in a pty (TERM=xterm-kitty, TIOCSWINSZ with pixel dims, answers the \x1b[?1016$p mouse probe), decodes kitty a=T,f=32,o=z frames, and feeds them to the recorder. Node apps: spawn ["npx", "tsx", "src/main.tsx", ...] with cwd= the package dir (tsx resolves tsconfig from cwd; a wrong cwd silently drops jsx config).
  • Input methods: key("enter"/"esc"/"ctrl+q"/"super+shift+z"), text, click, press/drag/release (a drag needs all three — click sends press+release together), move, wheel. Descriptions become the video caption bar and the summary timeline — write what the step is testing.
  • rec.check(name, ok, detail) for every assertion; rec.still(name) to pin the current frame into the summary.
  • Give checks real assertions (frame deltas, decoded pixel colors via recorder.png_read(rec.frames[-1]["path"])) — the summary shows pass/fail.

Ending a verification (required)

rec.finish() prints the run dir and summary path. Always end by opening the summary in a split:

pixel open file:///tmp/verify-runs/<name>-<stamp>/summary.html

That page is the deliverable: what was tested (clickable timeline that seeks the video), the checks table, the stills, and the video of the whole run. Watch out for FAIL rows before declaring the verification passed.

Gotchas

  • The engine rounds the window down to the cell grid, so the framebuffer can be narrower than the requested winsize. Take coordinates from d.frame_size, never from the requested pixels, or clicks land ~5% off.
  • Keep pumping after quit (d.stop does) or the exit is never observed.
  • Escape must be kitty CSI-u (d.key("esc") handles it); a bare \x1b makes the app swallow the next escape sequence as literal text.
  • If a press lands on a node without handlers, the engine dispatches the click at the release position — a missed drag can silently click something else.
  • Hover state only updates on move events; end interactions with a move if the screenshot should show hover styling.
  • Apps taking a file path argv need an ABSOLUTE path (their cwd is the package dir).
  • Run artifacts live in /tmp/verify-runs/<name>-<stamp>/: frames/, events.jsonl, run.json, verification.mp4, summary.html.

相似的 Skill

webapp-testing
anthropics/skills180k

webapp-testing

Toolkit for interacting with and testing local web applications using Playwright. Supports verifying frontend functionality, debugging UI behavior, capturing browser screenshots, and viewing browser logs.

浏览器自动化

browser-testing-with-devtools
addyosmani/agent-skills103k

browser-testing-with-devtools

Tests in real browsers via Chrome DevTools MCP. Use when building or debugging anything that runs in a browser. Use when you need to inspect the DOM, capture console errors, analyze network requests, profile performance, or verify visual output with real runtime data. Requires the chrome-devtools MCP server to be configured.

浏览器自动化

webapp-testing
ComposioHQ/awesome-claude-skills77k

webapp-testing

Toolkit for interacting with and testing local web applications using Playwright. Supports verifying frontend functionality, debugging UI behavior, capturing browser screenshots, and viewing browser logs.

浏览器自动化

browser
code-yeongyu/oh-my-openagent70k

browser

Drives a real browser through the omowright library from the js eval kernel: sites the user is already signed into, forms and clicks, JS-rendered pages, screenshots, web QA, extension popups, a human handoff for login, CAPTCHA or OTP, and a browser you own for scraping, bot-scored targets, network capture and QA traces. Use for any interactive browser task; not for a plain search or an unblocked static fetch.

浏览器自动化

agent-browser
shanraisshan/claude-code-best-practice67k

agent-browser

Browser automation CLI for AI agents. Use when the user needs to interact with websites, including navigating pages, filling forms, clicking buttons, taking screenshots, extracting data, testing web apps, or automating any browser task. Triggers include requests to "open a website", "fill out a form", "click a button", "take a screenshot", "scrape data from a page", "test this web app", "login to a site", "automate browser actions", or any task requiring programmatic web interaction.

浏览器自动化

cherry-regression-test
CherryHQ/cherry-studio52k

cherry-regression-test

Run Cherry Studio critical-path system regression tasks through the repository-owned Playwright E2E workflow. Use for full regression, release acceptance, development-branch system validation, or a named cherry-regression-test task on GitHub-hosted macOS and Windows runners.

浏览器自动化