MCP client integration

Twin Browser + Visual Studio Code

VS Code’s Copilot agent mode supports MCP servers, configured in `.vscode/mcp.json` for a workspace or in your user profile. Note the shape difference: VS Code uses a top-level `servers` key where most other clients use `mcpServers`.

Get an API key Read the docs

MCP client4-step setupBearer key auth

How Twin plugs into Visual Studio Code

Add Twin to `.vscode/mcp.json` and the agent in your editor can run a browser task against the app you are building — sign into a local or staging environment, walk a flow, and report what it found. Keep the config in the repo and everyone on the team gets the same tools; VS Code also supports prompted `inputs` if you would rather not commit a key at all.

Twin is the browser execution layer your stack calls. The first run cold-compiles a skill via skill compilation; every similar request after that is matched from the cache and replayed deterministically, so your marginal cost per run trends toward zero rather than climbing with usage.

app.example.com

Visual Studio Code → Twin

Receive goal from Visual Studio Codedone
Compile DOM → token-efficient indexed statedone
Match the semantic dispatch cacherunning
Replay compiled skill — 0 LLM callsqueued

What you get through Visual Studio Code

Every integration is a thin wrapper over the same execution layer, so the cache, the replay, and the corpus apply no matter how you call in.

Semantic dispatch cache

A re-phrased goal fuzzy-matches an already-compiled skill, so most calls never touch the LLM.

Deterministic replay

A compiled skill replays the exact action path with zero LLM calls — fast, repeatable, cheap.

Cross-tenant skill corpus

A skill compiled once can be safely reused across tenants, so the hit rate climbs as the network runs.

One Bearer key

Auth, usage-based billing, and an audit log run on every call — the same key works from every integration.

Wire it up

Drop Twin into Visual Studio Code.

Copy, paste, and swap in your Bearer key. The first run compiles a skill; repeats match the semantic dispatch cache and replay deterministically.

.vscode/mcp.jsonjson

{
  "servers": {
    "twin-browser": {
      "command": "npx",
      "args": ["-y", "twin-browser-mcp"],
      "env": { "TWIN_API_KEY": "ab_live_…" }
    }
  }
}

// Committing a key is a bad habit even in a private repo — VS Code supports
// prompted "inputs" so the value is entered once per session instead.

Base URL https://twin-browser.com/api/v1 · auth Authorization: Bearer ab_live_… · over MCP the same engine is run_goal, compile_skill and run_skill — the full tool table.

Get an API key
Create an ab_live_ key in the Twin dashboard under Keys & Secrets.
Create .vscode/mcp.json
Use the servers key — VS Code differs from the mcpServers shape other clients use.
Add the server
command npx, args -y twin-browser-mcp, with TWIN_API_KEY in env (or an input so VS Code prompts for it).
Start it
Start the server from the editor, then use agent mode and ask for a web task.

Read the Visual Studio Code docs API reference

FAQ

Visual Studio Code on Twin — common questions

Why does VS Code use "servers" and not "mcpServers"?

It is just VS Code’s own configuration schema. The server, the transport and the tools are identical — only the wrapper key differs, which is the single most common reason a copied config silently does nothing.

Can I keep the key out of the repo?

Yes. VS Code’s mcp.json supports prompted inputs, so the key is entered when the server starts rather than committed. Either way it is a tenant credential — revoke and rotate it from the dashboard if it leaks.

Go deeper

Cursor

MCP client

Cursor is an AI-native code editor with a built-in agent that can call MCP tools. Servers are registered in `.cursor/mcp.json` for a project or `~/.cursor/mcp.json` globally, and their tools become available to the agent while you work.

Windsurf

MCP client

Windsurf is Codeium’s AI-native editor, whose Cascade agent supports MCP servers. Servers are registered in `~/.codeium/windsurf/mcp_config.json` in the same `mcpServers` shape most clients use.

MCP (Model Context Protocol)

Protocol

MCP is an open protocol that lets an LLM application discover and call external tools over a standard interface. An MCP client — Claude Desktop, Claude Code, Cursor, Windsurf, VS Code, Cline — launches or connects to an MCP server, lists its tools, and invokes them on the model’s behalf, with no bespoke glue per app.

Wire up Visual Studio Code in minutes.

Free to start. Usage-based credits from $29/mo — each call billed the higher of its flat action price or its metered cost.

Get an API key See pricing