From f36ac53e9c72d69c296ca84e91a5bf2ffc877ba9 Mon Sep 17 00:00:00 2001 From: robertjamesprior <83608739+robertjamesprior@users.noreply.github.com> Date: Fri, 24 Jul 2026 14:50:50 +0000 Subject: [PATCH] Add Playwright connection guide under browsers/ MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Playwright had no keyword-focused page of its own — it was only covered as one tab in Control and via the separate Playwright Execution page, which are easy to land on by mistake. Add browsers/playwright.mdx covering install, the connectOverCDP URL swap, viewport, stealth, and why to run it on Kernel, with Control linking out to it and reciprocal pointers between the two Playwright pages to disambiguate them. Co-Authored-By: Claude Opus 4.8 --- browsers/playwright-execution.mdx | 4 + browsers/playwright.mdx | 121 ++++++++++++++++++++++++++++++ docs.json | 1 + introduction/control.mdx | 3 +- 4 files changed, 128 insertions(+), 1 deletion(-) create mode 100644 browsers/playwright.mdx diff --git a/browsers/playwright-execution.mdx b/browsers/playwright-execution.mdx index a2d72057..2c17e91c 100644 --- a/browsers/playwright-execution.mdx +++ b/browsers/playwright-execution.mdx @@ -7,6 +7,10 @@ Execute arbitrary Playwright/TypeScript code in a fresh execution context agains **For complex workloads, Kernel has a full [code execution platform](/apps)**. + +To connect a Playwright client you run yourself over CDP, see [Playwright](/browsers/playwright). This page covers running Playwright code inside the browser's VM. + + ## How it works When you execute Playwright code through this API: diff --git a/browsers/playwright.mdx b/browsers/playwright.mdx new file mode 100644 index 00000000..0ee85804 --- /dev/null +++ b/browsers/playwright.mdx @@ -0,0 +1,121 @@ +--- +title: "Playwright" +description: "Connect Playwright to a Kernel cloud browser over CDP" +--- + +[Playwright](https://playwright.dev) is a browser automation library from Microsoft. Kernel browsers speak the Chrome DevTools Protocol (CDP), so you can point an existing Playwright script at a cloud browser by swapping your launch call for a `connectOverCDP` to the session's `cdp_ws_url` — no other code changes. + + +If you don't need a local Playwright install and want your code to run co-located with the browser, use [Playwright Execution](/browsers/playwright-execution) instead. It runs the same Playwright API inside the browser's VM and returns values back to your agent. This page covers connecting a Playwright client you run yourself. + + +## Install + +```bash +npm install playwright @onkernel/sdk +``` + +```bash +pip install playwright kernel +``` + +## Create a browser and connect + +Create a Kernel browser, then connect Playwright to its `cdp_ws_url`. Kernel opens a context and page for you — grab them from the connected browser rather than calling `newContext`. + + +```typescript Typescript/Javascript +import { chromium } from 'playwright'; +import Kernel from '@onkernel/sdk'; + +const kernel = new Kernel(); + +const kernelBrowser = await kernel.browsers.create(); +console.log('Live view:', kernelBrowser.browser_live_view_url); + +const browser = await chromium.connectOverCDP(kernelBrowser.cdp_ws_url); +const context = browser.contexts()[0]; +const page = context.pages()[0]; + +await page.goto('https://onkernel.com'); +console.log(await page.title()); + +await browser.close(); +await kernel.browsers.deleteByID(kernelBrowser.session_id); +``` + +```python Python +import asyncio +from kernel import Kernel +from playwright.async_api import async_playwright + +kernel = Kernel() + +async def main(): + kernel_browser = kernel.browsers.create() + print("Live view:", kernel_browser.browser_live_view_url) + + async with async_playwright() as playwright: + browser = await playwright.chromium.connect_over_cdp(kernel_browser.cdp_ws_url) + context = browser.contexts[0] + page = context.pages[0] + + await page.goto("https://onkernel.com") + print(await page.title()) + + await browser.close() + + kernel.browsers.delete_by_id(kernel_browser.session_id) + +asyncio.run(main()) +``` + + +## Configure the viewport + +Set the viewport when you create the browser, not through Playwright. Playwright's `setViewportSize` is a no-op over a CDP connection — the window size is fixed at browser creation. See [Viewports](/browsers/viewport) for supported dimensions and refresh rates. + + +```typescript Typescript/Javascript +const kernelBrowser = await kernel.browsers.create({ + viewport: { width: 1280, height: 720 }, +}); +``` + +```python Python +kernel_browser = kernel.browsers.create( + viewport={"width": 1280, "height": 720}, +) +``` + + +## Stealth mode + +Create the browser with `stealth: true` to harden it against bot detection. The connection is unchanged — you still connect Playwright to `cdp_ws_url`. + + +```typescript Typescript/Javascript +const kernelBrowser = await kernel.browsers.create({ stealth: true }); +``` + +```python Python +kernel_browser = kernel.browsers.create(stealth=True) +``` + + +See [stealth mode](/browsers/bot-detection/stealth) for what it changes. For the strongest anti-detection posture, prefer [computer controls](/browsers/computer-controls) or [Playwright Execution](/browsers/playwright-execution) — a direct CDP connection carries a fingerprint that co-located control avoids. + +## Why run Playwright on Kernel + +- **No local browser management.** No Chromium download or version pinning on your machine — the browser runs in Kernel's cloud. +- **Persistent state.** Keep cookies and login state across runs with [Profiles](/auth/profiles). +- **Scale out.** Launch many sessions in parallel instead of contending for one local browser. +- **Debuggable.** Watch any session in real time with [live view](/browsers/live-view). +- **No code rewrite.** Existing Playwright scripts work as-is once you swap the launch for `connectOverCDP`. + +## Next steps + +- [Playwright Execution](/browsers/playwright-execution) — run Playwright inside the browser VM with no local install +- [Live view](/browsers/live-view) — watch and debug your sessions +- [Stealth mode](/browsers/bot-detection/stealth) — avoid bot detection +- [Terminating sessions](/browsers/termination) — clean up browsers when you're done diff --git a/docs.json b/docs.json index 9d268fb0..0df442da 100644 --- a/docs.json +++ b/docs.json @@ -124,6 +124,7 @@ "browsers/curl", "browsers/ssh", "browsers/computer-controls", + "browsers/playwright", "browsers/playwright-execution" ] }, diff --git a/introduction/control.mdx b/introduction/control.mdx index 9c4e6a79..c8222950 100644 --- a/introduction/control.mdx +++ b/introduction/control.mdx @@ -150,7 +150,7 @@ fmt.Println(response.Result) - Chrome DevTools Protocol — the wire format Playwright, Puppeteer, and most browser frameworks speak. Use `cdp_ws_url` from the created browser session for deterministic, scripted automation driven from your own infra. + Chrome DevTools Protocol — the wire format Playwright, Puppeteer, and most browser frameworks speak. Use `cdp_ws_url` from the created browser session for deterministic, scripted automation driven from your own infra. For a full Playwright walkthrough — install, viewport, and stealth — see [Playwright](/browsers/playwright). ```typescript Typescript/Javascript @@ -287,5 +287,6 @@ fmt.Println(response.Result) ## Going deeper - [Computer Controls reference](/browsers/computer-controls) — every mouse, keyboard, and screen primitive. +- [Playwright](/browsers/playwright) — connect a Playwright client over CDP: install, viewport, and stealth. - [Playwright Execution reference](/browsers/playwright-execution) — the full execution surface, return values, and timeouts. - [Computer use integrations](/integrations/computer-use/anthropic) — drop-in examples for Anthropic, Gemini, OpenAI, and more.