Getting Started

This guide walks you through installing BrowseGenius locally, loading it into Chrome, and performing the first AI-generated run.

Prerequisites

• Node.js ≥ 18 and npm or Yarn 1.x
• A Chrome or Chromium-based browser with Developer Mode enabled
• An OpenAI API key that has access to GPT-4.1, GPT-4o, or the o1 family
• Optional: A BrowseGenius account for cloud sync and cross-device access
• Optional: An OpenPipe API key if you want to log prompts/responses

Install dependencies

yarn install

This installs both the extension dependencies and the VitePress documentation stack.

Build & load the extension

1. Generate the unpacked build:

   yarn start

   The dev server continuously writes bundles into build/ and watches for file changes.

2. Open chrome://extensions, enable Developer mode, and click Load unpacked.

3. Select the build/ directory created by the dev server.

4. Pin the extension to the toolbar for quick access (optional).

Configure AI providers

1. Open the BrowseGenius popup (click the extension icon or use Cmd+Shift+Y / Ctrl+Shift+Y)
2. Click the Settings icon
3. Enter your OpenAI API Key - stored securely in browser storage only
4. Select your preferred model (GPT-4.1, GPT-4o, GPT-4o mini, o1, or o1-mini)
5. Optional: Enter your Extension API Key (starts with bgx_) for cloud sync
6. Click Save Keys

Cloud Sync Setup (Optional)

To enable cloud sync and cross-device access:

1. Create a BrowseGenius account:

   curl -X POST https://api.browsegenius.com/api/v1/auth/signup \
     -H "Content-Type: application/json" \
     -d '{"email":"your@email.com","password":"your_password","name":"Your Name"}'

2. Login and generate an Extension API Key:

   # Get JWT token
   curl -X POST https://api.browsegenius.com/api/v1/auth/login \
     -H "Content-Type: application/json" \
     -d '{"email":"your@email.com","password":"your_password"}'
   
   # Create extension key
   curl -X POST https://api.browsegenius.com/api/v1/extension-keys \
     -H "Authorization: Bearer YOUR_JWT_TOKEN" \
     -d '{"name":"My Browser"}'

3. Copy the API key (format: bgx_...) and paste it in extension Settings

See Backend Integration for full details.

First capture session

1. Navigate to a representative page in your target application.
2. Click Capture screen in the popup. Repeat until you have up to five pivotal screens (auth, dashboards, transactions, etc.).
3. Annotate each capture with notes the LLM should consider (environment, data setup, edge cases).

Generate and run a suite

1. Press Generate plan. BrowseGenius templatizes the DOM, composes a GPT-4 prompt, and returns a prioritized list of test cases.
2. Review the proposed flows, adjust priorities if needed, and click Run suite.
3. Open the DevTools panel → BrowseGenius to watch step-by-step progress, actions, and validations.

Export evidence

After a run completes, download the HTML + JSON report bundle from the popup. The bundle contains logs, metadata, screenshots/DOM captures, and test summaries for easy sharing with your team.

Reports are saved via the chrome.downloads API. Ensure the browser grants download permission to the extension.