BrowseMind

BrowseMind is a Chromium/Brave Manifest V3 extension that lets you select any text on a web page and ask an AI for a response. The answer appears in a draggable, scrollable floating panel at the bottom of the page.

Features

• ON/OFF toggle in the popup.
• Ask AI button appears near any user selection.
• Two AI back‑ends: Ollama (local or cloud/keyed with Bearer token) and any OpenAI‑compatible API.
• Settings page lets you configure provider URL, model, API key (for Ollama Cloud / proxy or OpenAI compatible endpoints), theme, response style, and a Debug console.
• Context‑menu integration (right‑click → Ask AI).
• Theme‑aware UI (system / light / dark).
• Storage in chrome.storage.local with sensible defaults.
• Full TypeScript codebase, bundled with esbuild.
• Basic Jest tests for core utilities.

Project Structure

BrowseMind/
├─ manifest.json
├─ package.json
├─ tsconfig.json
├─ README.md
├─ src/
│  ├─ background/service-worker.ts
│  ├─ content/content.ts
│  ├─ content/page-reader.ts
│  ├─ ai/ai-service.ts
│  ├─ ai/provider-manager.ts
│  ├─ ai/provider.ts
│  ├─ ai/ollama.ts
│  ├─ ai/api-client.ts
│  ├─ ai/prompts.ts
│  ├─ popup/popup.html
│  ├─ popup/popup.ts
│  ├─ popup/popup.css
│  ├─ options/options.html
│  ├─ options/options.ts
│  ├─ options/options.css
│  └─ shared/
│     ├─ types.ts
│     ├─ storage.ts
│     ├─ constants.ts
│     └─ utils.ts
├─ assets/icons/   (place your 16/48/128 PNG icons here)
├─ tests/          (Jest test suite)
└─ dist/           (generated by `npm run build`)

Building & Running

# Install dependencies
npm install

# Run tests (optional)
npm test

# Build the extension (creates ./dist)
npm run build

1. Open Brave → Extensions → Developer mode.
2. Click Load unpacked and select the dist/ folder generated above.
3. The extension icon appears; click it to open the popup and enable/disable the extension or adjust settings.
4. Visit any web page, select text, and an Ask AI button will appear near the selection.
5. Click the button → answer shows in a floating bottom panel.

Debug Mode

When Debug Mode is ON, the floating panel includes a console showing:

• Provider and endpoint used
• Model name
• Sanitized request payload (API keys are masked)
• HTTP status
• Sanitized response
• Request duration
• Errors (if any) Use Clear Logs to empty the console.

Testing

The test suite lives under tests/ and uses Jest with jsdom for DOM‑related tests.

npm test

License

MIT – feel free to fork, modify, and publish!