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"
            ]
        }
    ]
}

You can download this sample extension here. The extension must be in a .zip file format with a manifest.json at the root. The file must be smaller than 4.5 MB.

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}`);

Starting a new session with an extension can increase the session creation time. The browser must be restarted to load the extension, which itself has nonzero load time.

Verify the Extension

To verify your extension is working:

Connect to your session using Playwright or Selenium
Navigate to a page where your extension should be active
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.

Introduction

Fundamentals

Features

Use Cases

Guides

Integrations

Sample Extension

Upload Your Extension

Create a Session with Your Extension

Verify the Extension

Introduction

Fundamentals

Features

Use Cases

Guides

Integrations

​Sample Extension

​Upload Your Extension

​Create a Session with Your Extension

​Verify the Extension

Sample Extension

Upload Your Extension

Create a Session with Your Extension

Verify the Extension