This guide walks you through launching a Browserbase session with the 1Password Chrome extension, authenticating your vault, and confirming autofill on login forms. This is ideal for flows that require login or authentication where you want to avoid hardcoding credentials into your code.

This guide assumes you have a 1Password account and a Browserbase account and a project created. If you don’t, you can create your 1password account here and create a Browserbase account here.

​
1. Install Dependencies

npm install playwright-core @browserbasehq/sdk dotenv @browserbasehq/stagehand

Create a .env file:

.env
BROWSERBASE_API_KEY=your_browserbase_api_key
BROWSERBASE_PROJECT_ID=your_browserbase_project_id
EXTENSION_ZIP_PATH=./1password.zip
OPENAI_API_KEY=your_openai_api_key

​
2. Zip the Extension

Assuming that you have the 1Password extension installed, you’ll need to locate and zip the extension files from your local Chrome install.

1

Find where Chrome stores extensions

Mac: ~/Library/Application Support/Google/Chrome/Default/Extensions

Windows: C:\Users<YourUsername>\AppData\Local\Google\Chrome\User Data\Default\Extensions

2

Identify & Zip the 1Password extension folder

Find the versioned subfolder inside the 1Password extension directory. The extension ID should be aeblfdkhhhdcdjpifhhbdiojplfjncoa.

Navigate to the versioned folder (e.g., 2.15.1_0) and zip it:

cd ~/Library/Application\ Support/Google/Chrome/Default/Extensions/aeblfdkhhhdcdjpifhhbdiojplfjncoa/2.15.1_0
zip -r 1password.zip .
3

Move 1password.zip to an accessible location

mv 1password.zip ./
4

Update your .env

EXTENSION_ZIP_PATH=./1password.zip

​
3. Upload Extension to Browserbase

Use the Browserbase SDK to upload the zipped extension:

import Browserbase from "@browserbasehq/sdk";
import { createReadStream } from "fs";

export async function createExtension(bb: Browserbase): Promise<string> {
  const extensionPath = process.env.EXTENSION_ZIP_PATH!;
  const extension = await bb.extensions.create({
    file: createReadStream(extensionPath),
  });
  console.log(`Extension uploaded with ID: ${extension.id}`);
  console.log(`Load this extension into your .env file as EXTENSION_ID`);
  return extension.id;
}

Copy the returned extensionId and update your .env file:

.env
EXTENSION_ID=your_uploaded_extension_id

​
4. Configure Browserbase Environment

Update your Browserbase setup to load the extension:

import { ConstructorParams, Stagehand } from "@browserbasehq/stagehand";
import dotenv from "dotenv";

dotenv.config();

const stagehandConfig = (): ConstructorParams => ({
  env: "BROWSERBASE",
  modelName: "CHOOSE_MODEL",
  modelClientOptions: { apiKey: process.env.MODEL_API_KEY! },
  browserbaseSessionCreateParams: {
    projectId: process.env.BROWSERBASE_PROJECT_ID!,
    browserSettings: {
      extensionId: process.env.EXTENSION_ID!,
    },
  },
});
const stagehand = new Stagehand(stagehandConfig());
await stagehand.init();
const page = stagehand.page;
await page.goto("chrome-extension://aeblfdkhhhdcdjpifhhbdiojplfjncoa/app/app.html#/page/welcome");

​
5. Authenticate 1Password

Navigate to the 1Password extension page: chrome-extension://aeblfdkhhhdcdjpifhhbdiojplfjncoa/app/app.html#/page/welcome

​
6. Confirm Autofill!

Navigate to a login page where credentials are stored in your vault:

await page.goto("https://browserbase.com/sign-in");
await page.waitForLoadState("networkidle");

Watch for autofill behavior and that’s it! You’ve authenticated your 1Password vault inside Browserbase and confirmed login autofill.

​
Next Steps

Contexts

Learn more about using contexts to automate workflows across login-gated sites

Session Replay

Learn more about using session replay to debug and optimize your workflows