Use 1Password to log in with Browserbase

BROWSERBASE_API_KEY=your_browserbase_api_key
OPENAI_API_KEY=your_openai_api_key
OP_SERVICE_ACCOUNT_TOKEN=your_1password_service_account_token

import { z } from "zod";
import { createClient } from "@1password/sdk";
import { Stagehand } from "@browserbasehq/stagehand";

async function main() {
  // Initialize 1Password SDK client for secure credential retrieval
  const client = await createClient({
    auth: process.env.OP_SERVICE_ACCOUNT_TOKEN!,
    integrationName: "My Browserbase and 1Password Integration",
    integrationVersion: "v1.0.0",
  });

  // Initialize Stagehand with Browserbase environment
  const stagehand = new Stagehand({
    env: "BROWSERBASE",
  });
  await stagehand.init();

  // Retrieve credentials from 1Password vault
  const username = await client.secrets.resolve("op://Browserbase Agent/Browserbase/username");
  const password = await client.secrets.resolve("op://Browserbase Agent/Browserbase/password");

  // Navigate to Browserbase sign-in page
  const page = stagehand.context.pages()[0];
  await page.goto("https://www.browserbase.com/sign-in", { waitUntil: "domcontentloaded" });
  console.log('Navigated to Browserbase sign-in page')

  // Login process
  await stagehand.act(`Type in the username: ${username}`);
  console.log('Typed in the username')

  await stagehand.act('Click continue')
  console.log('Clicked continue')

  await stagehand.act(`Type in the password: ${password}`);
  console.log('Typed in the password')

  await stagehand.act('Click the sign in button')
  console.log('Clicked the sign in button')

  // Wait for the page to load
  await page.waitForLoadState('domcontentloaded')
  console.log('Page loaded')

  // Extract project information from the dashboard
  const { projectId } = await stagehand.extract(
    "Extract the project ID of the Browserbase account",
    z.object({
      projectId: z.string(),
    }),
  );

  const { totalSessions } = await stagehand.extract(
    "Extract the total sessions for the period for the project",
    z.object({
      totalSessions: z.number(),
    }),
  );

  console.log('For Project ID: ', projectId, ' the total sessions for the last 30 days is: ', totalSessions)

  // Close the stagehand session
  await stagehand.close();
}

main();