docs: create providers/ section with dedicated provider pages (#928)

Add dedicated documentation pages for each cloud browser provider: Browser Use, Browserbase, Browserless, and Kernel (sorted alphabetically). Uses providers/ path per maintainer feedback. - Fix Kernel defaults to match source code (KERNEL_HEADLESS=true, KERNEL_STEALTH=false) — README had these inverted - Add Providers section to sidebar navigation - Simplify cdp-mode cloud providers section to link to new pages Fixes part of #774 Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-19 02:40:33 -05:00
parent 2d37967b7e
commit 2b3c5c26cd
11 changed files with 171 additions and 20 deletions
@@ -111,28 +111,10 @@ This enables control of:

 ## Cloud providers

-Use cloud browser infrastructure when local browsers aren't available:
+Use the `-p` flag to connect to a cloud browser provider instead of launching a local browser:

 ```bash
-# Browserbase
-export BROWSERBASE_API_KEY="your-api-key"
 agent-browser -p browserbase open https://example.com
-
-# Browser Use
-export BROWSER_USE_API_KEY="your-api-key"
-agent-browser -p browseruse open https://example.com
-
-# Kernel
-export KERNEL_API_KEY="your-api-key"
-agent-browser -p kernel open https://example.com
-
-# Browserless
-export BROWSERLESS_API_KEY="your-api-key"
-agent-browser -p browserless open https://example.com
-
-# Or via environment variable
-export AGENT_BROWSER_PROVIDER=browserbase
-agent-browser open https://example.com
 ```

-The `-p` flag takes precedence over `AGENT_BROWSER_PROVIDER`.
+See the [Providers](/providers/browser-use) section for setup and configuration of each supported provider: [Browser Use](/providers/browser-use), [Browserbase](/providers/browserbase), [Browserless](/providers/browserless), and [Kernel](/providers/kernel).
@@ -0,0 +1,7 @@
+import { pageMetadata } from "@/lib/page-metadata";
+
+export const metadata = pageMetadata("providers/browser-use");
+
+export default function Layout({ children }: { children: React.ReactNode }) {
+  return children;
+}
@@ -0,0 +1,24 @@
+# Browser Use
+
+[Browser Use](https://browser-use.com) provides cloud browser infrastructure for AI agents. Use it when running agent-browser in environments where a local browser isn't available (serverless, CI/CD, etc.).
+
+## Setup
+
+```bash
+export BROWSER_USE_API_KEY="your-api-key"
+agent-browser -p browseruse open https://example.com
+```
+
+Or use environment variables for CI/scripts:
+
+```bash
+export AGENT_BROWSER_PROVIDER=browseruse
+export BROWSER_USE_API_KEY="your-api-key"
+agent-browser open https://example.com
+```
+
+The `-p` flag takes precedence over `AGENT_BROWSER_PROVIDER`.
+
+When enabled, agent-browser connects to a Browser Use cloud session instead of launching a local browser. All commands work identically.
+
+Get your API key from the [Browser Use Cloud Dashboard](https://cloud.browser-use.com/settings?tab=api-keys). Free credits are available to get started, with pay-as-you-go pricing after.
@@ -0,0 +1,7 @@
+import { pageMetadata } from "@/lib/page-metadata";
+
+export const metadata = pageMetadata("providers/browserbase");
+
+export default function Layout({ children }: { children: React.ReactNode }) {
+  return children;
+}
@@ -0,0 +1,24 @@
+# Browserbase
+
+[Browserbase](https://browserbase.com) provides remote browser infrastructure to make deployment of agentic browsing agents easy. Use it when running agent-browser in environments where a local browser isn't feasible.
+
+## Setup
+
+```bash
+export BROWSERBASE_API_KEY="your-api-key"
+agent-browser -p browserbase open https://example.com
+```
+
+Or use environment variables for CI/scripts:
+
+```bash
+export AGENT_BROWSER_PROVIDER=browserbase
+export BROWSERBASE_API_KEY="your-api-key"
+agent-browser open https://example.com
+```
+
+The `-p` flag takes precedence over `AGENT_BROWSER_PROVIDER`.
+
+When enabled, agent-browser connects to a Browserbase session instead of launching a local browser. All commands work identically.
+
+Get your API key from the [Browserbase Dashboard](https://browserbase.com/overview).
@@ -0,0 +1,7 @@
+import { pageMetadata } from "@/lib/page-metadata";
+
+export const metadata = pageMetadata("providers/browserless");
+
+export default function Layout({ children }: { children: React.ReactNode }) {
+  return children;
+}
@@ -0,0 +1,39 @@
+# Browserless
+
+[Browserless](https://browserless.io) provides cloud browser infrastructure with a Sessions API. Use it when running agent-browser in environments where a local browser isn't available.
+
+## Setup
+
+```bash
+export BROWSERLESS_API_KEY="your-api-token"
+agent-browser -p browserless open https://example.com
+```
+
+Or use environment variables for CI/scripts:
+
+```bash
+export AGENT_BROWSER_PROVIDER=browserless
+export BROWSERLESS_API_KEY="your-api-token"
+agent-browser open https://example.com
+```
+
+The `-p` flag takes precedence over `AGENT_BROWSER_PROVIDER`.
+
+## Configuration
+
+<table>
+  <thead>
+    <tr><th>Variable</th><th>Description</th><th>Default</th></tr>
+  </thead>
+  <tbody>
+    <tr><td><code>BROWSERLESS_API_KEY</code></td><td>API token (required)</td><td></td></tr>
+    <tr><td><code>BROWSERLESS_API_URL</code></td><td>Base API URL (for custom regions or self-hosted)</td><td><code>https://production-sfo.browserless.io</code></td></tr>
+    <tr><td><code>BROWSERLESS_BROWSER_TYPE</code></td><td>Type of browser to use (<code>chromium</code> or <code>chrome</code>)</td><td><code>chromium</code></td></tr>
+    <tr><td><code>BROWSERLESS_TTL</code></td><td>Session TTL in milliseconds</td><td><code>300000</code></td></tr>
+    <tr><td><code>BROWSERLESS_STEALTH</code></td><td>Enable stealth mode</td><td><code>true</code></td></tr>
+  </tbody>
+</table>
+
+When enabled, agent-browser connects to a Browserless cloud session instead of launching a local browser. All commands work identically.
+
+Get your API token from the [Browserless Dashboard](https://browserless.io).
@@ -0,0 +1,7 @@
+import { pageMetadata } from "@/lib/page-metadata";
+
+export const metadata = pageMetadata("providers/kernel");
+
+export default function Layout({ children }: { children: React.ReactNode }) {
+  return children;
+}
@@ -0,0 +1,41 @@
+# Kernel
+
+[Kernel](https://www.kernel.sh) provides cloud browser infrastructure for AI agents with features like stealth mode and persistent profiles.
+
+## Setup
+
+```bash
+export KERNEL_API_KEY="your-api-key"
+agent-browser -p kernel open https://example.com
+```
+
+Or use environment variables for CI/scripts:
+
+```bash
+export AGENT_BROWSER_PROVIDER=kernel
+export KERNEL_API_KEY="your-api-key"
+agent-browser open https://example.com
+```
+
+The `-p` flag takes precedence over `AGENT_BROWSER_PROVIDER`.
+
+## Configuration
+
+<table>
+  <thead>
+    <tr><th>Variable</th><th>Description</th><th>Default</th></tr>
+  </thead>
+  <tbody>
+    <tr><td><code>KERNEL_API_KEY</code></td><td>API key (required)</td><td></td></tr>
+    <tr><td><code>KERNEL_HEADLESS</code></td><td>Run browser in headless mode</td><td><code>true</code></td></tr>
+    <tr><td><code>KERNEL_STEALTH</code></td><td>Enable stealth mode to avoid bot detection</td><td><code>false</code></td></tr>
+    <tr><td><code>KERNEL_TIMEOUT_SECONDS</code></td><td>Session timeout in seconds</td><td><code>300</code></td></tr>
+    <tr><td><code>KERNEL_PROFILE_NAME</code></td><td>Browser profile name for persistent cookies/logins</td><td>(none)</td></tr>
+  </tbody>
+</table>
+
+**Profile persistence:** When `KERNEL_PROFILE_NAME` is set, the profile will be created if it doesn't already exist. Cookies, logins, and session data are automatically saved back to the profile when the browser session ends, making them available for future sessions.
+
+When enabled, agent-browser connects to a Kernel cloud session instead of launching a local browser. All commands work identically.
+
+Get your API key from the [Kernel Dashboard](https://dashboard.onkernel.com).
@@ -41,6 +41,15 @@ export const navigation: NavSection[] = [
      { name: "Native Mode", href: "/native-mode" },
    ],
  },
+  {
+    title: "Providers",
+    items: [
+      { name: "Browser Use", href: "/providers/browser-use" },
+      { name: "Browserbase", href: "/providers/browserbase" },
+      { name: "Browserless", href: "/providers/browserless" },
+      { name: "Kernel", href: "/providers/kernel" },
+    ],
+  },
  {
    title: "Engines",
    items: [
@@ -18,6 +18,10 @@ export const PAGE_TITLES: Record<string, string> = {
  "engines/lightpanda": "Lightpanda",
  next: "Next.js + Vercel",
  "native-mode": "Native Mode",
+  "providers/browser-use": "Browser Use",
+  "providers/browserbase": "Browserbase",
+  "providers/browserless": "Browserless",
+  "providers/kernel": "Kernel",
  changelog: "Changelog",
 };