Run any Skill in Manus with one click

bun-webview

Stars38

Forks3

UpdatedJune 23, 2026 at 03:33

Use when you need to build, automate, or document desktop-style browser windows and browser automation flows with Bun's `Bun.WebView` API. Reach for this skill when creating a new `Bun.WebView`, configuring constructor parameters, calling instance methods, using page state properties, or wiring CDP and event-based integrations.

Installation

Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.

Run Skill in Manus

Source

jonaspm

jonaspm/bunwright

View GitHub Repository View Creator Repositories

Download

Run Skill in Manus

Related occupationsSOC

Based on SOC occupation classification

Software DevelopersComputer and Mathematical Occupations·SOC 15-1252

SKILL.md

readonly

Bun WebView Skill

When to Use This Skill

Use this skill when you are:

Creating a desktop window or browser automation target with Bun's Bun.WebView API
Loading HTML, navigating to URLs, or evaluating JavaScript in a page
Documenting or implementing Bun.WebView constructor options
Looking up instance methods such as navigate(), evaluate(), screenshot(), click(), type(), press(), scroll(), resize(), goBack(), goForward(), reload(), or cdp()
Using page state properties like view.url, view.title, and view.loading
Handling EventTarget events, especially Chrome backend CDP events dispatched as MessageEvent
Configuring backend selection, console capture, and persistent profiles

Product Summary

Bun.WebView is available starting in Bun v1.3.12.

Bun's Bun.WebView API provides a native webview/browser automation surface you can create directly from Bun. It supports multiple backends, including WebKit and Chrome, and is intended for lightweight desktop apps, internal tools, testing flows, and browser-driven automation without a full Electron-style stack.

At a high level, you:

Create a new Bun.WebView instance
Pass constructor options to configure the backend, initial page, logging, and persistence
Use instance methods to navigate, evaluate code, click, type, scroll, resize, capture screenshots, or send raw CDP commands
Read page state from properties like view.url, view.title, and view.loading
Listen for events because Bun.WebView extends EventTarget

One browser subprocess is shared per Bun process. Additional new Bun.WebView() calls open tabs in the same instance.

Quick Start

Create a new `Bun.WebView`

const view = new Bun.WebView({
  backend: "chrome",
  url: "https://bun.sh",
  console: globalThis.console,
});

view.navigate("https://bun.sh/docs");
await view.evaluate("document.title");

Load inline HTML with a data URL

const html = `<!doctype html>
<html>
  <body>
    <h1>Hello from Bun WebView</h1>
  </body>
</html>`;

const webview = new Bun.WebView({
  width: 800,
  height: 600,
  url: `data:text/html,${encodeURIComponent(html)}`,
});

await webview.evaluate("document.querySelector('h1')?.textContent");

Evaluate JavaScript in the page

const view = new Bun.WebView({
  backend: "webkit",
  url: "https://example.com",
});

await view.evaluate(`
  (() => {
    document.body.style.background = "black";
    document.body.style.color = "white";
    return document.title;
  })()
`);

Core Concepts

1. Creating a `Bun.WebView` instance

The main entry point is constructing a new Bun.WebView:

const view = new Bun.WebView({
  backend: "chrome",
  url: "https://example.com",
  console: globalThis.console,
});

You generally provide one object containing the initial configuration.

Common patterns:

Use url when loading a remote or local page
Choose backend: "webkit" for the WebKit backend
Choose backend: "chrome" for the Chrome backend
Use backend: { type: "chrome", path, argv } when you need a custom Chrome executable or launch arguments
Use console to capture page logs
Use dataStore for persistent profiles and browser state

2. Constructor parameters

The constructor accepts an options object. The key documented options for v1.3.12 are:

Parameter	Type	Purpose
`width`	`number`	Viewport width in CSS pixels (default 800)
`height`	`number`	Viewport height in CSS pixels (default 600)
`backend`	`"webkit" \| "chrome" \| { type: "chrome", path?: string, argv?: string[] }`	Select the backend or provide a custom Chrome executable and arguments
`url`	`string`	Initial URL to load
`headless`	`boolean`	Defaults to `true`; only `true` is implemented
`console`	`typeof console` or `(type, ...args) => void`	Capture page logs
`dataStore`	`"ephemeral" \| { directory: string }`	Persist browser profile data across runs (default `"ephemeral"`)

Parameter guidance

Use backend: "webkit" for the WebKit backend
Use backend: "chrome" for the built-in Chrome backend
Use backend: { type: "chrome", path, argv } when you need a specific Chrome/Chromium binary or launch flags
Prefer url for most real usage
Use console: globalThis.console to forward page logs directly to Bun's console
Use console: (type, ...args) => { ... } when you need custom console handling
Use dataStore when you need cookies, sessions, or persistent browser state across runs

3. Instance methods

After creating a Bun.WebView, you control it through instance methods. Most of the high-level automation methods work across both backends, while cdp() is Chrome-only.

Navigation and evaluation

navigate(url) — navigate to a URL
evaluate(expr) — evaluate a JavaScript expression in the page; wrap statement sequences in an IIFE
goBack() — navigate backward in history
goForward() — navigate forward in history
reload() — reload the current page

Screenshots and automation

screenshot({ format, quality, encoding }) — capture a PNG, JPEG, or WebP screenshot
click(x, y) — click at viewport coordinates
click(selector) — click an element matched by a CSS selector
type(text) — type text into the focused element
press(key, options?) — press a key with optional options
scroll(dx, dy) — scroll by delta
scrollTo(selector) — scroll to an element matched by a selector

Viewport and protocol control

resize(width, height) — resize the viewport
cdp(method, params?) — send a raw Chrome DevTools Protocol call
close() — destroy the page; rejects pending promises; idempotent

Page state properties

view.url — current page URL
view.title — current page title
view.loading — whether the page is currently loading
view.onNavigated — fires after each successful navigation, before navigate() resolves
view.onNavigationFailed — fires after each failed navigation, before navigate() rejects

Common Usage Patterns

Navigate to a page

const view = new Bun.WebView({
  backend: "chrome",
  url: "https://bun.sh",
});

await view.navigate("https://bun.sh/docs");

Evaluate JavaScript and read page state

const view = new Bun.WebView({
  backend: "webkit",
  url: "https://example.com",
});

await view.evaluate("document.title");
console.log(view.url);
console.log(view.title);
console.log(view.loading);

evaluate() only accepts expressions. For multi-statement logic, wrap the code in an IIFE:

await view.evaluate(`
  (() => {
    const title = document.title;
    return title.toUpperCase();
  })()
`);

Capture a screenshot

const view = new Bun.WebView({
  backend: "chrome",
  url: "https://example.com",
});

const image = await view.screenshot({
  format: "png",
  encoding: "base64",
});

Click and type

const view = new Bun.WebView({
  backend: "chrome",
  url: "https://example.com/login",
});

await view.click("input[name=email]");
await view.type("user@example.com");
await view.press("Tab");
await view.type("secret");

Scroll and resize

const view = new Bun.WebView({
  backend: "chrome",
  url: "https://example.com",
});

await view.scroll(0, 500);
await view.scrollTo("#footer");
await view.resize(1440, 900);

Use raw CDP on the Chrome backend

const view = new Bun.WebView({
  backend: "chrome",
  url: "https://example.com",
});

await view.cdp("Runtime.evaluate", {
  expression: "document.title",
});

Events and backend behavior

Bun.WebView extends EventTarget.

On the Chrome backend:

CDP events are dispatched as MessageEvent
event payload parameters are available on event.data

Typical pattern:

const view = new Bun.WebView({
  backend: "chrome",
  url: "https://example.com",
});

view.addEventListener("Page.loadEventFired", (event) => {
  console.log(event.data);
});

Guidance for events

Use event listeners when you need low-level Chrome backend observability
Prefer higher-level methods like navigate(), evaluate(), and click() for normal automation
Use cdp() plus event listeners when you need protocol-level control

Automation-oriented interaction model

The primary interaction model in v1.3.12 is automation-oriented rather than a custom page-to-native binding API.

Typical flow:

Create a Bun.WebView
Navigate to a page
Use methods like click(), type(), press(), scroll(), and evaluate()
Read state from view.url, view.title, and view.loading
Use cdp() and events for advanced Chrome backend control

Use this pattern for:

Login flows
Form filling
Screenshot capture
Browser-driven testing
Internal automation tools
Protocol-level inspection on Chrome

Decision Guide

Goal	Recommended approach
Load a website or local dev server	Use `url`
Choose the rendering/automation engine	Set `backend`
Use a custom Chrome binary	Use `backend: { type: "chrome", path, argv }`
Capture page logs	Use `console`
Persist cookies and sessions	Use `dataStore`
Run page-side code from Bun	Use `evaluate()`
Click elements or coordinates	Use `click()`
Fill forms	Use `type()` and `press()`
Capture screenshots	Use `screenshot()`
Use low-level Chrome protocol features	Use `cdp()` plus events

Workflow

1. Verify Bun version

Confirm you are using Bun v1.3.12 or newer.

2. Create the view

Start with the smallest working constructor:

const view = new Bun.WebView({
  backend: "chrome",
  url: "http://localhost:3000",
});

3. Choose the backend

Pick "webkit" or "chrome" based on your needs, or provide a custom Chrome executable object.

4. Add automation steps

Use navigate(), evaluate(), click(), type(), press(), scroll(), and resize().

5. Add persistence and logging

Configure dataStore and console if needed.

6. Add advanced Chrome integration

Use cdp() and event listeners only when higher-level methods are not enough.

Best Practices

Start with a minimal constructor and add options incrementally
Use Bun v1.3.12 or newer
Prefer url plus automation methods for most workflows
Choose the backend explicitly when behavior matters
Use console during development to capture page logs
Use console: globalThis.console or a callback, not true
Use dataStore when you need persistent browser state
Prefer high-level methods like click(), type(), and scrollTo() before dropping to cdp()
Treat evaluate() as a sharp tool; keep expressions focused and deterministic
Remember that evaluate() accepts expressions, so wrap statement blocks in an IIFE when needed
Remember that one browser subprocess is shared per Bun process, and additional views open tabs in the same instance

Common Gotchas

Version requirement: Bun.WebView starts in v1.3.12
Backend differences: Chrome-specific protocol behavior is available through cdp() and event dispatch, even though the documented high-level methods work across both backends
Shared browser process: additional new Bun.WebView() calls open tabs in the same browser instance for the current Bun process
Custom Chrome launch config: if you use backend: { type: "chrome", path, argv }, make sure the executable path and arguments are valid on the target machine
Overusing evaluate(): use it for focused DOM or JS tasks, not as your entire automation architecture
Expression-only evaluation: evaluate() wraps your code as await (${script}), so statement blocks must be wrapped in an IIFE
Selector fragility: click(selector) and scrollTo(selector) depend on stable DOM structure
CDP event handling: on Chrome, protocol events arrive as MessageEvent with payload in event.data

Verification Checklist

Before you ship or hand off WebView work:

Confirm Bun is v1.3.12 or newer
Verify the app can create a new Bun.WebView instance
Confirm constructor parameters like backend, console, and dataStore are documented and used intentionally
Test key instance methods like navigate(), evaluate(), screenshot(), click(), type(), press(), scroll(), resize(), goBack(), goForward(), and reload()
Verify page state properties like view.url, view.title, and view.loading
Test Chrome backend cdp() calls if you rely on them
Test event handling if you consume Chrome CDP events
Confirm shared-process/tab behavior is acceptable for your app design
Test on the actual target OS and backend combination

Reference Template for Agent Work

When documenting or implementing Bun WebView, structure your output around:

How to create a new Bun.WebView
Constructor parameters
Instance methods
Page state properties
Events and Chrome backend CDP behavior
Examples
Version/backend caveats

Resources

Bun docs index: https://bun.com/docs
Bun reference: https://bun.com/reference
Bun release notes/blog: https://bun.com/blog
Bun repository: https://github.com/oven-sh/bun

Note: Bun.WebView starts in Bun v1.3.12. The documented high-level methods listed in this skill work across both WebKit and Chrome backends, while Chrome also exposes raw CDP access and dispatches protocol events through EventTarget as MessageEvent objects with payload in event.data.

name	bun-webview
description	Use when you need to build, automate, or document desktop-style browser windows and browser automation flows with Bun's `Bun.WebView` API. Reach for this skill when creating a new `Bun.WebView`, configuring constructor parameters, calling instance methods, using page state properties, or wiring CDP and event-based integrations.
metadata	{"mintlify-proj":"bun","version":"1.0"}

Bun WebView Skill

When to Use This Skill

Use this skill when you are:

Creating a desktop window or browser automation target with Bun's Bun.WebView API
Loading HTML, navigating to URLs, or evaluating JavaScript in a page
Documenting or implementing Bun.WebView constructor options
Looking up instance methods such as navigate(), evaluate(), screenshot(), click(), type(), press(), scroll(), resize(), goBack(), goForward(), reload(), or cdp()
Using page state properties like view.url, view.title, and view.loading
Handling EventTarget events, especially Chrome backend CDP events dispatched as MessageEvent
Configuring backend selection, console capture, and persistent profiles

Product Summary

Bun.WebView is available starting in Bun v1.3.12.

At a high level, you:

Create a new Bun.WebView instance
Pass constructor options to configure the backend, initial page, logging, and persistence
Use instance methods to navigate, evaluate code, click, type, scroll, resize, capture screenshots, or send raw CDP commands
Read page state from properties like view.url, view.title, and view.loading
Listen for events because Bun.WebView extends EventTarget

One browser subprocess is shared per Bun process. Additional new Bun.WebView() calls open tabs in the same instance.

Quick Start

Create a new `Bun.WebView`

const view = new Bun.WebView({
  backend: "chrome",
  url: "https://bun.sh",
  console: globalThis.console,
});

view.navigate("https://bun.sh/docs");
await view.evaluate("document.title");

Load inline HTML with a data URL

const html = `<!doctype html>
<html>
  <body>
    <h1>Hello from Bun WebView</h1>
  </body>
</html>`;

const webview = new Bun.WebView({
  width: 800,
  height: 600,
  url: `data:text/html,${encodeURIComponent(html)}`,
});

await webview.evaluate("document.querySelector('h1')?.textContent");

Evaluate JavaScript in the page

const view = new Bun.WebView({
  backend: "webkit",
  url: "https://example.com",
});

await view.evaluate(`
  (() => {
    document.body.style.background = "black";
    document.body.style.color = "white";
    return document.title;
  })()
`);

Core Concepts

1. Creating a `Bun.WebView` instance

The main entry point is constructing a new Bun.WebView:

const view = new Bun.WebView({
  backend: "chrome",
  url: "https://example.com",
  console: globalThis.console,
});

You generally provide one object containing the initial configuration.

Common patterns:

Use url when loading a remote or local page
Choose backend: "webkit" for the WebKit backend
Choose backend: "chrome" for the Chrome backend
Use backend: { type: "chrome", path, argv } when you need a custom Chrome executable or launch arguments
Use console to capture page logs
Use dataStore for persistent profiles and browser state

2. Constructor parameters

The constructor accepts an options object. The key documented options for v1.3.12 are:

Parameter	Type	Purpose
`width`	`number`	Viewport width in CSS pixels (default 800)
`height`	`number`	Viewport height in CSS pixels (default 600)
`backend`	`"webkit" \| "chrome" \| { type: "chrome", path?: string, argv?: string[] }`	Select the backend or provide a custom Chrome executable and arguments
`url`	`string`	Initial URL to load
`headless`	`boolean`	Defaults to `true`; only `true` is implemented
`console`	`typeof console` or `(type, ...args) => void`	Capture page logs
`dataStore`	`"ephemeral" \| { directory: string }`	Persist browser profile data across runs (default `"ephemeral"`)

Parameter guidance

Use backend: "webkit" for the WebKit backend
Use backend: "chrome" for the built-in Chrome backend
Use backend: { type: "chrome", path, argv } when you need a specific Chrome/Chromium binary or launch flags
Prefer url for most real usage
Use console: globalThis.console to forward page logs directly to Bun's console
Use console: (type, ...args) => { ... } when you need custom console handling
Use dataStore when you need cookies, sessions, or persistent browser state across runs

3. Instance methods

After creating a Bun.WebView, you control it through instance methods. Most of the high-level automation methods work across both backends, while cdp() is Chrome-only.

Navigation and evaluation

navigate(url) — navigate to a URL
evaluate(expr) — evaluate a JavaScript expression in the page; wrap statement sequences in an IIFE
goBack() — navigate backward in history
goForward() — navigate forward in history
reload() — reload the current page

Screenshots and automation

screenshot({ format, quality, encoding }) — capture a PNG, JPEG, or WebP screenshot
click(x, y) — click at viewport coordinates
click(selector) — click an element matched by a CSS selector
type(text) — type text into the focused element
press(key, options?) — press a key with optional options
scroll(dx, dy) — scroll by delta
scrollTo(selector) — scroll to an element matched by a selector

Viewport and protocol control

resize(width, height) — resize the viewport
cdp(method, params?) — send a raw Chrome DevTools Protocol call
close() — destroy the page; rejects pending promises; idempotent

Page state properties

view.url — current page URL
view.title — current page title
view.loading — whether the page is currently loading
view.onNavigated — fires after each successful navigation, before navigate() resolves
view.onNavigationFailed — fires after each failed navigation, before navigate() rejects

Common Usage Patterns

Navigate to a page

const view = new Bun.WebView({
  backend: "chrome",
  url: "https://bun.sh",
});

await view.navigate("https://bun.sh/docs");

Evaluate JavaScript and read page state

const view = new Bun.WebView({
  backend: "webkit",
  url: "https://example.com",
});

await view.evaluate("document.title");
console.log(view.url);
console.log(view.title);
console.log(view.loading);

evaluate() only accepts expressions. For multi-statement logic, wrap the code in an IIFE:

await view.evaluate(`
  (() => {
    const title = document.title;
    return title.toUpperCase();
  })()
`);

Capture a screenshot

const view = new Bun.WebView({
  backend: "chrome",
  url: "https://example.com",
});

const image = await view.screenshot({
  format: "png",
  encoding: "base64",
});

Click and type

const view = new Bun.WebView({
  backend: "chrome",
  url: "https://example.com/login",
});

await view.click("input[name=email]");
await view.type("user@example.com");
await view.press("Tab");
await view.type("secret");

Scroll and resize

const view = new Bun.WebView({
  backend: "chrome",
  url: "https://example.com",
});

await view.scroll(0, 500);
await view.scrollTo("#footer");
await view.resize(1440, 900);

Use raw CDP on the Chrome backend

const view = new Bun.WebView({
  backend: "chrome",
  url: "https://example.com",
});

await view.cdp("Runtime.evaluate", {
  expression: "document.title",
});

Events and backend behavior

Bun.WebView extends EventTarget.

On the Chrome backend:

CDP events are dispatched as MessageEvent
event payload parameters are available on event.data

Typical pattern:

const view = new Bun.WebView({
  backend: "chrome",
  url: "https://example.com",
});

view.addEventListener("Page.loadEventFired", (event) => {
  console.log(event.data);
});

Guidance for events

Use event listeners when you need low-level Chrome backend observability
Prefer higher-level methods like navigate(), evaluate(), and click() for normal automation
Use cdp() plus event listeners when you need protocol-level control

Automation-oriented interaction model

The primary interaction model in v1.3.12 is automation-oriented rather than a custom page-to-native binding API.

Typical flow:

Create a Bun.WebView
Navigate to a page
Use methods like click(), type(), press(), scroll(), and evaluate()
Read state from view.url, view.title, and view.loading
Use cdp() and events for advanced Chrome backend control

Use this pattern for:

Login flows
Form filling
Screenshot capture
Browser-driven testing
Internal automation tools
Protocol-level inspection on Chrome

Decision Guide

Goal	Recommended approach
Load a website or local dev server	Use `url`
Choose the rendering/automation engine	Set `backend`
Use a custom Chrome binary	Use `backend: { type: "chrome", path, argv }`
Capture page logs	Use `console`
Persist cookies and sessions	Use `dataStore`
Run page-side code from Bun	Use `evaluate()`
Click elements or coordinates	Use `click()`
Fill forms	Use `type()` and `press()`
Capture screenshots	Use `screenshot()`
Use low-level Chrome protocol features	Use `cdp()` plus events

Workflow

1. Verify Bun version

Confirm you are using Bun v1.3.12 or newer.

2. Create the view

Start with the smallest working constructor:

const view = new Bun.WebView({
  backend: "chrome",
  url: "http://localhost:3000",
});

3. Choose the backend

Pick "webkit" or "chrome" based on your needs, or provide a custom Chrome executable object.

4. Add automation steps

Use navigate(), evaluate(), click(), type(), press(), scroll(), and resize().

5. Add persistence and logging

Configure dataStore and console if needed.

6. Add advanced Chrome integration

Use cdp() and event listeners only when higher-level methods are not enough.

Best Practices

Start with a minimal constructor and add options incrementally
Use Bun v1.3.12 or newer
Prefer url plus automation methods for most workflows
Choose the backend explicitly when behavior matters
Use console during development to capture page logs
Use console: globalThis.console or a callback, not true
Use dataStore when you need persistent browser state
Prefer high-level methods like click(), type(), and scrollTo() before dropping to cdp()
Treat evaluate() as a sharp tool; keep expressions focused and deterministic
Remember that evaluate() accepts expressions, so wrap statement blocks in an IIFE when needed
Remember that one browser subprocess is shared per Bun process, and additional views open tabs in the same instance

Common Gotchas

Version requirement: Bun.WebView starts in v1.3.12
Backend differences: Chrome-specific protocol behavior is available through cdp() and event dispatch, even though the documented high-level methods work across both backends
Shared browser process: additional new Bun.WebView() calls open tabs in the same browser instance for the current Bun process
Custom Chrome launch config: if you use backend: { type: "chrome", path, argv }, make sure the executable path and arguments are valid on the target machine
Overusing evaluate(): use it for focused DOM or JS tasks, not as your entire automation architecture
Expression-only evaluation: evaluate() wraps your code as await (${script}), so statement blocks must be wrapped in an IIFE
Selector fragility: click(selector) and scrollTo(selector) depend on stable DOM structure
CDP event handling: on Chrome, protocol events arrive as MessageEvent with payload in event.data

Verification Checklist

Before you ship or hand off WebView work:

Confirm Bun is v1.3.12 or newer
Verify the app can create a new Bun.WebView instance
Confirm constructor parameters like backend, console, and dataStore are documented and used intentionally
Test key instance methods like navigate(), evaluate(), screenshot(), click(), type(), press(), scroll(), resize(), goBack(), goForward(), and reload()
Verify page state properties like view.url, view.title, and view.loading
Test Chrome backend cdp() calls if you rely on them
Test event handling if you consume Chrome CDP events
Confirm shared-process/tab behavior is acceptable for your app design
Test on the actual target OS and backend combination

Reference Template for Agent Work

When documenting or implementing Bun WebView, structure your output around:

How to create a new Bun.WebView
Constructor parameters
Instance methods
Page state properties
Events and Chrome backend CDP behavior
Examples
Version/backend caveats

Resources

Bun docs index: https://bun.com/docs
Bun reference: https://bun.com/reference
Bun release notes/blog: https://bun.com/blog
Bun repository: https://github.com/oven-sh/bun

Note: Bun.WebView starts in Bun v1.3.12. The documented high-level methods listed in this skill work across both WebKit and Chrome backends, while Chrome also exposes raw CDP access and dispatches protocol events through EventTarget as MessageEvent objects with payload in event.data.

bun-webview

More from this repository

Bun WebView Skill

When to Use This Skill

Product Summary

Quick Start

Create a new Bun.WebView

Load inline HTML with a data URL

Evaluate JavaScript in the page

Core Concepts

1. Creating a Bun.WebView instance

2. Constructor parameters

Parameter guidance

3. Instance methods

Navigation and evaluation

Screenshots and automation

Viewport and protocol control

Page state properties

Common Usage Patterns

Navigate to a page

Evaluate JavaScript and read page state

Capture a screenshot

Click and type

Scroll and resize

Use raw CDP on the Chrome backend

Events and backend behavior

Guidance for events

Automation-oriented interaction model

Decision Guide

Workflow

1. Verify Bun version

2. Create the view

3. Choose the backend

4. Add automation steps

5. Add persistence and logging

6. Add advanced Chrome integration

Best Practices

Common Gotchas

Verification Checklist

Reference Template for Agent Work

Resources

Bun WebView Skill

When to Use This Skill

Product Summary

Quick Start

Create a new Bun.WebView

Load inline HTML with a data URL

Evaluate JavaScript in the page

Core Concepts

1. Creating a Bun.WebView instance

2. Constructor parameters

Parameter guidance

3. Instance methods

Navigation and evaluation

Screenshots and automation

Viewport and protocol control

Page state properties

Common Usage Patterns

Navigate to a page

Evaluate JavaScript and read page state

Capture a screenshot

Click and type

Scroll and resize

Use raw CDP on the Chrome backend

Events and backend behavior

Guidance for events

Automation-oriented interaction model

Decision Guide

Workflow

1. Verify Bun version

2. Create the view

3. Choose the backend

4. Add automation steps

5. Add persistence and logging

6. Add advanced Chrome integration

Best Practices

Common Gotchas

Verification Checklist

Reference Template for Agent Work

Resources

Create a new `Bun.WebView`

1. Creating a `Bun.WebView` instance

Create a new `Bun.WebView`

1. Creating a `Bun.WebView` instance