Browser Extensions

For applications requiring enhanced functional capabilities, providing your own Chrome extension is a great option. With Browserbase, using extensions is easy.

​

Sample Extension

Here’s a simple example extension that modifies page titles. It consists of two files:

{
    "manifest_version": 3,
    "version": "1.0",
    "name": "My Test Extension",
    "description": "Test of a simple browser extension",
    "content_scripts": [
        {
            "matches": [
                "https://www.sfmoma.org/*"
            ],
            "js": [
                "content-script.js"
            ]
        }
    ]
}

​

Upload Your Extension

Once you have your extension files zipped up, you can upload it using our SDK:

from browserbase import Browserbase

bb = Browserbase(api_key="your-api-key")

# Upload the extension
with open("extension.zip", "rb") as f:
    extension = bb.extensions.create(f)

extension_id = extension.id
print(f"Extension uploaded with ID: {extension_id}")

from browserbase import Browserbase

bb = Browserbase(api_key="your-api-key")

# Upload the extension
with open("extension.zip", "rb") as f:
    extension = bb.extensions.create(f)

extension_id = extension.id
print(f"Extension uploaded with ID: {extension_id}")

import { Browserbase } from '@browserbasehq/sdk';
import fs from 'fs';

const bb = new Browserbase('your-api-key');

// Upload the extension
const file = fs.createReadStream('extension.zip');
const extension = await bb.extensions.create({ file });

const extensionId = extension.id;
console.log(`Extension uploaded with ID: ${extensionId}`);

​

Create a Session with Your Extension

To use your extension, create a new session with the extension enabled:

from browserbase import Browserbase

bb = Browserbase(api_key="your-api-key")

# Create a session with the extension
session = bb.sessions.create(
    project_id="your-project-id",
    extension_id="your-extension-id"
)

print(f"Session created with ID: {session.id}")

from browserbase import Browserbase

bb = Browserbase(api_key="your-api-key")

# Create a session with the extension
session = bb.sessions.create(
    project_id="your-project-id",
    extension_id="your-extension-id"
)

print(f"Session created with ID: {session.id}")

import { Browserbase } from '@browserbasehq/sdk';

const bb = new Browserbase('your-api-key');

// Create a session with the extension
const session = await bb.sessions.create({
    projectId: 'your-project-id',
    extensionId: 'your-extension-id'
});

console.log(`Session created with ID: ${session.id}`);

​

Verify the Extension

To verify your extension is working:

1. Connect to your session using Playwright or Selenium
2. Navigate to a page where your extension should be active
3. Check for the expected modifications or behaviors

For the sample extension above, navigate to https://www.sfmoma.org and verify that the page title has been modified with the additional text.