DEV Community

VANSH ARORA
VANSH ARORA

Posted on

How the TokenCap Chrome Companion Injects Local Context into ChatGPT, Claude, and Gemini

#ai #devtools #vscode #productivity

When working in web AI chats, manually feeding context is tedious. You need to pick relevant files, strip sensitive keys, format markdown, and stay under the model context window.

We built the TokenCap Companion (Manifest V3 Chrome Extension) to automate this workflow securely.

How It Operates Under Manifest V3

  1. Sandboxed Local Query: When you open the extension popup, it queries http://127.0.0.1:4545/generate with your local pairing token.
  2. Model-Aware Budgeting: You pick your active target model (GPT-4o, Claude 3.5 Sonnet, Gemini 1.5 Pro). The extension requests a payload formatted specifically for that context window.
  3. Content Script Injection: Using content scripts (content/chatgpt.js, content/claude.js, content/gemini.js), the companion locates the active chat prompt DOM element and populates it. 
[TokenCap Companion Popup]
Project: my-saas-api
Task: "Add rate limiting to /api/auth routes"
Model: Claude 3.5 Sonnet
Token Count: 8,450 / 200,000 (Safe)
[ Inject Into Chat ]
Enter fullscreen mode Exit fullscreen mode

The extension requests only minimal permissions (storage, activeTab, clipboardWrite), and source code is never transmitted outside localhost.

Download and install instructions at tokencap.vansharora.app

Top comments (0)