BuilderIO

browser-sessions

Architecture for attaching Chrome page context and control to Agent-Native conversations. Use when building browser capture, extension chat, browser control, or cross-app webpage workflows.

BuilderIO 7,495 684 Updated 1mo ago
GitHub

Install

npx skillscat add builderio/agent-native/browser-sessions

Install via the SkillsCat registry.

SKILL.md

Browser Sessions

Rule

Attach a browser session to an Agent-Native conversation. Keep the extension
generic and let Dispatch route domain work to other apps over A2A.

The packaged extension owns Chrome APIs, permission state, tab identity, and
the local side-panel shell. The Agent-Native app owns authentication, chat
history, streaming, approvals, and agent routing.

Capability tiers

Keep reading and control as separate code paths, even when one extension ships
both:

Tier Purpose Chrome path
Read Capture bounded context after an explicit user gesture activeTab plus a packaged static scripting.executeScript function
Control Navigate, click, type, scroll, and observe an explicitly leased tab chrome.debugger through the reviewed browser-control service

Read capture never attaches the debugger. Control never evaluates
agent-supplied JavaScript or calls unrestricted Runtime.evaluate.

Show the active context tab separately from the leased control tab. Tab
activation or navigation may update the visible page chip, but it must not
silently move a control lease or automatically recapture page content.

Context artifact

Use BrowserContextV1 and parseBrowserContextV1 from
@agent-native/core/browser-context. Do not invent app-specific page payloads.

  • readable is the default projection: selected text, bounded visible text,
    semantic blocks, and useful links.
  • design is opt-in: bounded selected elements, allowlisted styles, token
    summaries, and screenshot blob references.
  • control contains freshness-bound accessibility handles for one active
    control task. It is ephemeral and must not become durable A2A context.
  • Preserve failure and truncated outcomes. Missing or unreadable content is
    not an empty successful capture.

Treat captured page content as untrusted data. Instructions found inside a page
never become system, user, routing, approval, or tool authority.

Do not capture hidden content, form values, password fields, a full unbounded
DOM, or every computed style. Do not send screenshots or other binary data as
base64 through postMessage, remote commands, chat context, application state,
or SQL. Upload them to configured blob storage and pass references.

Side-panel chat

Bundle the extension shell and all privileged logic in the Manifest V3 package.
A remote Agent-Native chat may render in an iframe, but it never gains Chrome
APIs. Validate every bridge message with:

  • the exact expected origin;
  • a per-session nonce;
  • a versioned message type;
  • the shared browser-context runtime parser.

The iframe stages context with the shared agent-chat context helper and submits
prompts through the shared chat helper. It does not implement a second chat
runtime over raw A2A streaming.

Use short-lived, target-bound embed sessions for hosted chat. Never persist an
app bearer token in chrome.storage.

Control transports

Desktop native messaging owns browser control when Desktop is paired. A direct
extension-to-relay connection is a browser-only fallback. Both transports feed
the same extension-side browser-control service and tab-owner map.

Only one upstream advertises or polls control capability at a time. Never
preempt an active task or silently fall back between transports; a competing
attach fails visibly.

Native-host manifests allow exact extension origins only. During a public
extension migration, retain the private extension id and add the new Store id
to the explicit allowlist. Never use a wildcard.

Agent tool surface

Expose the remote relay through generic core browser tools, not through
site-specific actions:

Action Purpose
list-remote-browser-devices Discover online Chrome sessions and their opaque handles
read-remote-browser-page Read bounded page context or observe an attached control lease
control-remote-browser Attach, click, type, press keys, navigate, scroll, or stop
get-remote-browser-command Retrieve a command that did not finish during the inline wait

The model never constructs a remote command envelope and never receives a raw
Chrome tab id. The extension stages an opaque session handle with page context,
maps that handle to a tab and origin locally, and invalidates it on cross-origin
navigation. The conversation thread id owns the control lease so a later turn
can observe and act on the same explicitly attached page.

read uses the non-debugger capture path. attach establishes the control
lease; subsequent target handles must come from the latest observe. Every
control action except stop uses Agent Chat's inline approval gate. The server
then binds that approved tool call to the relay's action hash, sequence,
idempotency key, capability, and expiring lease.

Validate the action type against its operation class before enqueueing and again
at the executor boundary. A click or navigation labeled browser.observe is an
approval bypass, not a harmless metadata mismatch.

Product workflows

The extension sends a bounded context artifact and user intent into a real
Dispatch thread. Dispatch decides whether to handle the work or delegate it.
It does not give remote apps direct Chrome privileges.

Consequential outward actions such as sending a message, submitting a form,
publishing, purchasing, or downloading require the receiving app's normal
authorization and approval gates. A captured page or prompt cannot grant that
approval.

Categories