|
| 1 | +--- |
| 2 | +title: "Stagehand" |
| 3 | +--- |
| 4 | + |
| 5 | +[Stagehand](https://github.com/browserbase/stagehand) is an open source AI browser automation framework. It lets developers choose what to write in code vs. natural language. By integrating with Kernel, you can run Stagehand automations with cloud-hosted browsers. |
| 6 | + |
| 7 | +## Adding Kernel to existing Stagehand implementations |
| 8 | + |
| 9 | +If you already have a Stagehand implementation, you can easily switch to using Kernel's cloud browsers by updating your browser configuration. |
| 10 | + |
| 11 | +### 1. Install the Kernel SDK |
| 12 | + |
| 13 | +```bash |
| 14 | +npm install @onkernel/sdk |
| 15 | +``` |
| 16 | + |
| 17 | +### 2. Initialize Kernel and create a browser |
| 18 | + |
| 19 | +Import the libraries and create a cloud browser session: |
| 20 | + |
| 21 | +```typescript |
| 22 | +import { Stagehand } from "@browserbasehq/stagehand"; |
| 23 | +import Kernel from '@onkernel/sdk'; |
| 24 | +import { z } from "zod"; |
| 25 | + |
| 26 | +const client = new Kernel({ |
| 27 | + apiKey: process.env.KERNEL_API_KEY |
| 28 | +}); |
| 29 | + |
| 30 | +const kernelBrowser = await client.browsers.create({ stealth: true }); |
| 31 | + |
| 32 | +console.log("Live view url: ", kernelBrowser.browser_live_view_url); |
| 33 | +``` |
| 34 | + |
| 35 | +### 3. Update your browser configuration |
| 36 | + |
| 37 | +Replace your existing browser setup to use Kernel's CDP URL: |
| 38 | + |
| 39 | +```typescript |
| 40 | +const stagehand = new Stagehand({ |
| 41 | + env: 'LOCAL', |
| 42 | + verbose: 1, |
| 43 | + domSettleTimeoutMs: 30_000, |
| 44 | + modelName: 'openai/gpt-4.1', |
| 45 | + modelClientOptions: { |
| 46 | + apiKey: process.env.OPENAI_API_KEY |
| 47 | + }, |
| 48 | + localBrowserLaunchOptions: { |
| 49 | + cdpUrl: kernelBrowser.cdp_ws_url |
| 50 | + } |
| 51 | +}); |
| 52 | + |
| 53 | +await stagehand.init(); |
| 54 | +``` |
| 55 | + |
| 56 | +### 4. Use your Stagehand automation |
| 57 | + |
| 58 | +Use Stagehand's page methods with the Kernel-powered browser: |
| 59 | + |
| 60 | +```typescript |
| 61 | +const page = stagehand.page; |
| 62 | +await page.goto("https://onkernel.com"); |
| 63 | +await page.act("Click on Blog in the navbar"); |
| 64 | +await page.act("Click on the newest blog post"); |
| 65 | +const output = await page.extract({ |
| 66 | + instruction: "Extract a summary of the blog post", |
| 67 | + schema: z.object({ summary: z.string() }) |
| 68 | +}); |
| 69 | + |
| 70 | +console.log("Newest blog post summary: ", output.summary); |
| 71 | + |
| 72 | +await stagehand.close(); |
| 73 | + |
| 74 | +// Clean up the Kernel Browser Session |
| 75 | +await client.browsers.deleteByID(kernelBrowser.session_id); |
| 76 | +``` |
| 77 | + |
| 78 | +## Quick setup with our Stagehand example app |
| 79 | + |
| 80 | +Alternatively, you can use our Kernel app template that includes a pre-configured Stagehand integration: |
| 81 | + |
| 82 | +```bash |
| 83 | +npx @onkernel/create-kernel-app my-stagehand-app |
| 84 | +``` |
| 85 | + |
| 86 | +Choose `TypeScript` as the programming language and then select `Stagehand` as the template. |
| 87 | + |
| 88 | +Then follow the [Quickstart guide](/quickstart/) to deploy and run your Stagehand automation on Kernel's infrastructure. |
| 89 | + |
| 90 | +## Benefits of using Kernel with Stagehand |
| 91 | + |
| 92 | +- **No local browser management**: Run automations without installing or maintaining browsers locally |
| 93 | +- **Scalability**: Launch multiple browser sessions in parallel |
| 94 | +- **Stealth mode**: Built-in anti-detection features for web scraping |
| 95 | +- **Session persistence**: Maintain browser state across automation runs |
| 96 | +- **Live view**: Debug your automations with real-time browser viewing |
| 97 | + |
| 98 | +## Next steps |
| 99 | + |
| 100 | +- Check out [live view](/browsers/live-view) for debugging your automations |
| 101 | +- Learn about [stealth mode](/browsers/stealth) for avoiding detection |
| 102 | +- Learn how to properly [terminate browser sessions](/browsers/termination) |
| 103 | +- Learn how to [deploy](/apps/deploy) your Stagehand app to Kernel |
0 commit comments