communication MCP Server
Browser companion plugin for AI coding assistants — Chrome automation MCP, in-page hint messaging, and persistent project memory across Claude Code sessions.
Discovered via github-topic:model-context-protocol and last synced 3mo ago.
1. Install the package
npm install super-tester
Attach a file to a page target via a strategy chain: `direct` (`DOM.setFileInputFiles`) → `intercept` (file-chooser dialog) → `drop` (synthesized `DataTransfer` + `DragEvent`) → `paste` (synthesized `ClipboardEvent`). Bypasses the native OS file picker entirely. Target by `selector`, `ref`, `trigger`, or `auto: { near }`. Smart-wait confirms upload (preview thumbnail / 2xx upload response / custom `successSelector`).
Block until a matching network response arrives (`urlGlob`/`urlContains`, `method`, `statusGte`/`statusLt`, `timeoutMs`). Proves a write actually persisted instead of guessing from the UI.
Create/update a playbook (validates frontmatter and required sections).
Post an OS notification asking the human to look (captcha, choice, or "done — come look"). Click focuses the window.
One-call health gate: `ok=false` if **any** console error/uncaught exception **or** any `>=400`/failed request happened since the page loaded (`sinceNavigation` default, or `sinceMs`, with `ignoreUrlContains`). Failed-request entries include `.body`.
Click by selector (CDP). Pass `intent` to **cache** the selector for next time.
Hash the live page assets (`script`/`css`/`document`) with sha256 + a `pageHash`. Confirm the **live bundle hash == the built hash** so you never test a stale cached deploy.
Remove a playbook + workflow + screenshots.
Generate a self-contained HTML dashboard from the library; opens in the active browser session.
Enumerate every actionable control on the page (`scope:"all"\
Static-analyze the project's frontend (Next.js / Vite / CRA) and emit draft playbooks per route + form. Solves cold-start on in-house apps.
Stage a file into the per-project library at `.continuum/uploads/`. Accepts `path`, https `url`, `dataUrl`, or `base64`. Returns a stable `stashId` (sha256-based, idempotent) reusable across many uploads.
Given a successful trace, create or update the matching playbook. Inputs and steps auto-inferred.
Replay a playbook (with self-heal) using provided inputs; recursively executes `composes`/`next` chains; returns verdict + evidence.
Perform one action (`click`/`type`/`navigate`/`press_key`/`click_at`) and classify the result: `WORKS` / `NO-OP` / `ERROR` / `NAVIGATES`. A `NO-OP` (clickable but nothing changed) is a **dead control = defect**. Returns `urlChanged`, `domChanged`, `networkDelta`, `consoleDelta`.
List playbooks under `.continuum/playbooks/`, filter by origin/tag/verifiable.
Bless a run's per-step screenshots as the new visual reference; bumps `playbook_version`.
Deterministic auth/state seeding — set `localStorage`, `sessionStorage`, and `cookies` (or `clear`) in one call so a flow starts from a known logged-in state.
Return one playbook with meta + body sections + workflow JSON.
Score-match playbooks against a URL, intent, or task description.
run
Validate that a playbook's `type: secret` inputs are resolvable (env or `.continuum/secrets/`). Returns availability only — never values.
Export one or more playbooks to a single JSON bundle file. Includes embedded base64 screenshots.
Import a playbook bundle (file / inline JSON / https URL). Supports `overwrite` + `rewriteOrigin` (e.g., staging → production).
What it is
Focus + clear + insertText. Pass `intent` to cache.
`emulate_viewport` is preferred for layout/responsive testing — it's deterministic, doesn't disturb anything else, matches Chrome DevTools' Device Mode, and actually changes what the page's JavaScript sees. `window_resize` is for when you genuinely need real OS-level window dimensions. ### Exhaustive QA coverage mode Beyond one-off checks, Mochi can run an **exhaustive QA pass** (`/qa exhaustive`) that enumerates every actionable control with `browser_audit_interactives`, drives each one through `browser_act_and_observe`, gates every page and action with `browser_assert_no_errors`, and assigns one of five verdicts to each control: **WORKS**, **NO-OP** (defect), **ERROR** (defect), **NAVIGATES**, or **DISABLED**. Results are recorded in a **verification ledger** with provenance stamping, and a built-in **honesty gate** refuses to report a run as "pass" while any control is still UNTESTED/UNCERTAIN — the rule is never "everything works" but *"N of M controls verified — here is each result, and here is what I could NOT verify and why."* Hard-won tooling quirks live in a persistent [tooling-gotchas note](skills/browser/references/gotchas.md) so they're never re-learned. ## Memory model Two layers, stored as plain JSON files under `<project>/.continuum/` (no database, no native bindings). ### 1) Selector cache — keyed by `(origin, intent)` Every `browser_click` / `browser_type` call may carry an **intent** ("click sign in button", "email field"). On success, the resolved selector is cached at `(origin, intent)`. The agent can short-circuit discovery by calling `browser_recall_selector` before snapshotting: ``` browser_recall_selector {intent:"click sign in button"} → {found:true, selector:'button[aria-label="Sign in"]', last_box:{...}} browser_click {ref:'button[aria-label="Sign in"]', intent:"click sign in button"} ``` The cache survives Chrome restarts, project reloads, server restarts. ### 2) Workflows — keyed by `(origin, name)` Every successful action inside a session is appended to an in-memory **trace**. `browser_workflow_save {name:"login"}` persists the trace as an ordered list of steps. `browser_workflow_run {name:"login"}` replays them. Replay strategy per step: 1. Try the step's stored selector. If it resolves → click. 2. Else: try other entries from the selector cache for the same `intent`. 3. Else: **self-heal** by ARIA role + name from a fresh snapshot. If found, update both the step record AND the selector cache, continue. 4. Else: return a rich failure envelope (tried selectors, role/name, screenshot, suggestion) so the agent can recover. The agent doesn't need to think about caching — just pass `intent`. Workflows build themselves out of normal exploration and replay deterministically next time. ### Step-by-step feedback contract Every replayed step returns: ```json { "step": 2, "action": "click", "intent": "click sign in button", "status": "pass", // pass
Persist current session's auto-traced actions as a named workflow.
`true`
List session tabs + CDP attachment state.
Resize/move/maximize the actual window (only safe with `newWindow`).
Inspect the cache.
Purpose
`process.cwd()`
What it does
Compact visible text lines, optionally filtered by query. Use before snapshot for reading/searching content.
Real keyboard event (CDP).
Replay. Cached selector → self-heal by role+name → screenshot on miss.
platform-detected
New tab group + primary tab. Pass `newWindow:true` to spawn a fresh window. Posts a click-to-focus notification instead of stealing focus.
Detach debugger, ungroup or close session tabs.
Navigate primary tab, wait for load.
Open new tab inside the session group.
Close a specific session tab.
Compact visible links with text, href, selector ref, and box.
ARIA tree with stable refs + pixel boxes. Defaults to compact, viewport-only, redacted, depth-limited, and 12KB capped.
Search the stored snapshot by text/name/role/ref/tag and return tiny excerpts.
Return one compact subtree from the stored snapshot by ref, text, or query path.
Click at pixel coords (CDP).
Absolute `{x,y}` or relative `{deltaX,deltaY}`.
Sleep up to 60s.
PNG/JPEG (viewport / fullPage / elementRef).
Device Mode via CDP. Presets + custom width/height/DPR/UA.
Verify `url-contains`, `url-equals`, `title-contains`, `element-exists`, `element-missing`, `text-contains`, `text-equals`. Returns `{ok, got}`.
"Do I already know how to find X on this site?" Returns cached selector or null.
Drop a cached entry.
Last N runs of a workflow.
Tool
self_healed "durationMs": 12 } ``` Failures additionally include `tried`, `role`, `name`, `screenshotDataUrl`, and a `suggestion`. ### Typical agent flow **First time** ("test the login flow"): ``` browser_session_start browser_navigate {url:"https://staging.myapp.com/login"} browser_recall_selector {intent:"email field"} → not found browser_snapshot browser_type {ref:"input[name=email]", text:"…", intent:"email field"} browser_recall_selector {intent:"click sign in"} → not found browser_click {ref:"button.signin", intent:"click sign in"} browser_assert {kind:"url-contains", value:"/dashboard"} browser_workflow_save {name:"login"} ``` **Next time** ("retest login"): ``` browser_session_start browser_workflow_run {name:"login", origin:"https://staging.myapp.com"} → {status:"pass", stepsTotal:5, stepsPassed:5, results:[…]} ``` If the UI was refactored, the run still passes — the engine self-heals and updates the cache. If it can't find the element at all, the agent gets a screenshot and a suggestion, and falls back to snapshot + AI discovery. ### Portability Workflows are portable JSON. Commit them alongside your app: ```bash # in agent flow: browser_workflow_export {name:"login"} # returns JSON payload # write to repo: tests/super-tester/login.json # later, on a fresh machine: browser_workflow_import {payload: <json>} ``` ## Concurrent Claude sessions You can run **multiple Claude Code sessions at once**, each with its own super-tester scope. The first MCP server to start binds port 9009 and becomes the **broker**; subsequent MCP servers detect the conflict and connect to the broker as **clients**, forwarding their browser commands through it. Each Claude session gets its own `clientId`, and the extension keeps a separate tab group per client. Sessions are fully isolated — Session A's clicks/navigates never touch Session B's tabs. ``` Claude session 1 ──stdio──► MCP-A ─────► (broker, owns port 9009 + extension WS) └──┐ Claude session 2 ──stdio──► MCP-B ─────► (client → forwards via MCP-A) └──┐ Claude session 3 ──stdio──► MCP-C ─────► (client → forwards via MCP-A) Extension holds Map<clientId, Session> — one tab group per Claude session. ``` The selector cache and workflow store are shared across sessions (per-origin, in `.continuum/`), so a workflow recorded in Session A can be replayed from Session B without re-learning anything. ## Claude Code shortcuts After installing the `mochi` plugin (see [Install](#install-one-plugin-one-extension-done) above), the `browser` MCP server runs automatically. No `claude mcp add-json` needed. After restarting Claude Code, use: ```text /browser test localhost:3000 use browser to verify the login flow use the browser MCP and check console errors ``` The MCP tools are named `browser_session_start`, `browser_navigate`, `browser_snapshot`, `browser_click`, `browser_screenshot`, `browser_console_messages`, `browser_network_requests`, and related `browser_*` tools. If the broker process dies (for example, the first Claude Code session exits), the remaining MCP clients automatically race to recover. One client promotes itself to the new broker, the extension reconnects to it, and clients request their previous `clientId` so existing tab groups remain attached to the right Claude session. New Claude sessions can then connect to the recovered broker. Commands from the same client are serialized inside the extension to prevent same-session races such as `session_start` overlapping `navigate` or `session_end`. Different client sessions still run in parallel, each scoped to its own tab group. ## Boundary guarantees - **Spawned tabs** (target=_blank, `window.open`, etc.) are auto-grouped into the session group via `chrome.tabs.onCreated`. - **Drag a tab out of the group** → it's released from the session, no longer touched. - **All operations validate** that the target tab is still in the session group. If you ungroup or close the group, the next tool call fails cleanly. - **Other Chrome windows / tabs / groups** are never queried, never modified. - **Per-client isolation:** every operation is scoped to the originating Claude session's tab group. Cross-session reads/writes are impossible at the protocol level. - **Service-worker restart recovery:** session metadata is persisted in `chrome.storage.local` and restored against live tab groups when the extension wakes back up. ## Environment variables
`9009`
unset
`~/.super-tester/super-tester-profile`
`20000`
`<project>/.continuum/`
Likely cause / fix
Send messages and upload files to Slack channels using the `slack` CLI. Supports direct messages, channel posts, file uploads, and thread replies.
Bidirectional Telegram bridge — talk to Claude from your phone. Built into OpenPaw.
Discover agents across local node and mesh peers at runtime — their roles, handles, and how to communicate with or delegate to them.
Apply data visualization and storytelling principles from Storytelling with Data by Cole Nussbaumer Knaflic. Covers choosing effective visuals (line, bar, table, scatterplot), eliminating clutter (Gestalt principles, data-ink ratio), focusing attention (preattentive attributes, strategic color), thinking like a designer (affordances, alignment, white space), and narrative structure (three-act story, horizontal/vertical logic, Big Idea). Trigger on "data visualization", "chart design", "dashboard design", "data storytelling", "presentation chart", "declutter chart", "bar chart", "line chart", "data narrative", "slide deck data", "chart review", "viz critique", "storytelling with data".
🔬 A curated collection of 23,000+ agent skills for empirical research across 8 social science disciplines. | 精选 23,000+ AI Agent 技能库，覆盖8大社会科学学科的实证研究。CoPaper.AI 20分钟完成一篇可复现的规范实证论文，并支持用户上传 Skills。-- Maintained by CoPaper.AI from Stanford REAP.
🔬 A curated collection of 23,000+ agent skills for empirical research across 8 social science disciplines. | 精选 23,000+ AI Agent 技能库，覆盖8大社会科学学科的实证研究。CoPaper.AI 20分钟完成一篇可复现的规范实证论文，并支持用户上传 Skills。-- Maintained by CoPaper.AI from Stanford REAP.
AgentNetworkProtocol(ANP) is an open source protocol for agent communication. Our vision is to define how agents connect with each other, building an open, secure, and efficient collaboration network for billions of intelligent agents.
Learn how to use the c-slack Claude skill. Complete guide with installation instructions and examples.
Learn how to use the c-telegram Claude skill. Complete guide with installation instructions and examples.
Learn how to use the Letter Writer Claude skill. Complete guide with installation instructions and examples.