Lybic Docs

Browser Use

The Lybic sandbox integrates the Playwright library, allowing you to easily use the Lybic sandbox as a backend for Browser Use.

Referring to Port Mapping and Forwarding, you can create port mappings to expose browser ports within the sandbox (such as Chromium's CDP port). Then use tools like Playwright or Puppeteer to connect to that port for browser automation operations. On top of this, you can combine it with AI frameworks (such as Stagehand) to implement AI-powered web automation.

Playwright Example

In your code, use the chromium.connectOverCDP method to connect to the sandbox-mapped CDP URL (9222), and include the X-Gateway-Access-Token header for authentication:

import { chromium } from 'playwright';

const browser = await chromium.connectOverCDP(
  'wss://<YOUR_GATEWAY_HOST_HERE>',
  {
    headers: {
      'X-Gateway-Access-Token': 'YOUR_GATEWAY_ACCESS_TOKEN_HERE' // Replace with your gateway auth token
      // ... other headers if needed
    }
  }
);

const context = browser.contexts()[0];
const page = await context.newPage();

Puppeteer Over CDP

Puppeteer, similar to Playwright, can also connect to the sandbox-mapped browser port (9222) via CDP:

import puppeteer from 'puppeteer-core';

const browser = await puppeteer.connect({
  browserWSEndpoint: 'wss://<YOUR_GATEWAY_HOST_HERE>',
  headers: {
    'X-Gateway-Access-Token': 'YOUR_GATEWAY_ACCESS_TOKEN_HERE' // Replace with your auth token
    // ... other headers if needed
  }
});

const page = await browser.newPage();
await page.goto('https://example.com');

Mixed Usage

Same browser, different contexts (recommended):

const pwBrowser = await chromium.connectOverCDP(ws);
const pwContext = await pwBrowser.newContext();

// Puppeteer
const ppBrowser = await puppeteer.connect({ browserWSEndpoint: ws });
const ppContext = await ppBrowser.createIncognitoBrowserContext();
CapabilityPlaywrightPuppeteer
Automation Testing
Raw CDP Operations
Trace / Video
DevTools Extensions

Using only Puppeteer CDP without Page API:

const client = await page.context().newCDPSession(page);

await client.send('Network.enable');
await client.send('Page.enable');

client.on('Network.requestWillBeSent', e => {
  console.log(e.request.url);
});

Selenium Server / Grid Exposing WebDriver URL

In the Lybic sandbox, you can also run Selenium Server / Grid to expose the WebDriver URL, allowing remote browser automation with Selenium.

Refer to Executing Long-Running Async Tasks to start Selenium Server in the background:

java -jar /usr/local/binary/selenium-server.jar standalone # linux
java -jar C:\coding\binary\selenium-server.jar standalone # windows

Refer to Port Mapping and Forwarding to forward the Selenium Server port (default 4444). Then you can connect remotely via the WebDriver URL:

const { Builder } = require('selenium-webdriver');

(async () => {
    const driver = await new Builder()
        // Attach the request token in the URL
        .usingServer('https://<YOUR_GATEWAY_HOST_HERE>?X-Gateway-Access-Token=YOUR_GATEWAY_ACCESS_TOKEN_HERE')
        .forBrowser('chrome')
        .build();

    await driver.get('https://example.com');

    // ... other operations

    await driver.quit();
    proxy.close();
})();

Connecting to Browser with Stagehand

Stagehand is a browser automation framework for controlling web browsers using natural language and code. By combining the power of artificial intelligence with the precision of code, Stagehand makes web automation flexible, maintainable, and truly reliable.

Similarly, when connecting Stagehand to a browser in the Lybic sandbox, you need to add the X-Gateway-Access-Token token for authentication, which you can attach in the URL.

You can use Stagehand to connect to the browser in the Lybic sandbox. Here is an example code showing how to connect to the browser in the sandbox through a proxy:

import { Stagehand } from "@browserbasehq/stagehand";

const stagehand = new Stagehand({
    env: "LOCAL",
    localBrowserLaunchOptions: {
        headless: false, // Show browser window
        devtools: true, // Open developer tools
        viewport: { width: 1280, height: 720 },
        cdpUrl:"wss://<YOUR_GATEWAY_HOST_HERE>?X-Gateway-Access-Token=YOUR_GATEWAY_ACCESS_TOKEN_HERE", // pass token in URL
        userDataDir: './chrome-user-data', // Persist browser data
        preserveUserDataDir: true, // Keep data after closing
        chromiumSandbox: false, // Disable sandbox (adds --no-sandbox)
        ignoreHTTPSErrors: true, // Ignore certificate errors
        locale: 'en-US', // Set browser language
        deviceScaleFactor: 1.0, // Display scaling
        downloadsPath: './downloads', // Download directory
        acceptDownloads: true, // Allow downloads
        connectTimeoutMs: 30000, // Connection timeout
    },
});

await stagehand.init();

On this page