Browserbase Browser

Browserbase fits deployments that want managed browser sessions plus CDP-level control through playwright-core. ViteHub keeps the top-level browser API capability-based, while browser.native and session.native expose the raw Browserbase and Playwright handles when you need provider-specific power.

Before you start

Install the Browserbase SDK and playwright-core alongside @vitehub/browser.

pnpm add https://pkg.pr.new/vite-hub/vitehub/@vitehub/browser@main @browserbasehq/sdk playwright-core

Set BROWSERBASE_API_KEY in the runtime environment. Add BROWSERBASE_PROJECT_ID when Browserbase should target a specific project by default.

BROWSERBASE_API_KEY=your-api-key
BROWSERBASE_PROJECT_ID=your-project-id

ViteHub does not load .env files for you. Your app or runtime must load them into process.env.

Configure Browserbase

export default defineNuxtConfig({
  modules: ['@vitehub/browser/nuxt'],
  browser: {
    provider: 'browserbase',
    projectId: process.env.BROWSERBASE_PROJECT_ID,
  },
})

Browserbase-specific options

Set Browserbase-specific options such as projectId, region, proxies, keepAlive, apiKey, baseURL, or connectUrl in top-level browser config.

Define a browser

export default defineBrowser(async (payload: { url: string }, { browser }) => {
  return {
    html: await browser.content({
      session: {
        reuse: true,
        keepAlive: 120,
      },
      url: payload.url,
      waitForSelector: 'form',
    }),
  }
}, {
  viewport: {
    width: 1440,
    height: 900,
  },
})

What changes on Browserbase