WebView

await using view = new Bun.WebView();

await view.navigate("https://example.com");
await view.click("a[href]"); // 等待链接可点击
const title = await view.evaluate("document.title");

await Bun.write("page.png", await view.screenshot());

const view = new Bun.WebView({
  width: 1280, // 视口宽度，CSS 像素（1-16384，默认 800）
  height: 720, // 视口高度，CSS 像素（1-16384，默认 600）
  url: "https://bun.com", // 可选：立即开始导航
});

{
  await using view = new Bun.WebView();
  await view.navigate("https://example.com");
  // ...
} // 此处自动调用 view.close()

const view = new Bun.WebView({
  dataStore: { directory: "./browser-profile" },
});

// 在 macOS 上强制使用 Chrome
const view = new Bun.WebView({ backend: "chrome" });

// 始终生成新的无头 Chrome；永不自动连接
new Bun.WebView({
  backend: { type: "chrome", url: false },
});

// 连接到特定的 DevTools WebSocket URL
new Bun.WebView({
  backend: {
    type: "chrome",
    url: "ws://127.0.0.1:9222/devtools/browser/abc123...",
  },
});

--user-data-dir=<temp> --remote-debugging-pipe --headless --no-first-run
--no-default-browser-check --disable-gpu --disable-extensions
--disable-background-networking --disable-background-timer-throttling
--disable-backgrounding-occluded-windows --disable-renderer-backgrounding
--disable-ipc-flooding-protection --no-startup-window

new Bun.WebView({
  backend: {
    type: "chrome",
    argv: ["--headless=new", "--lang=ja-JP", "--window-size=1920,1080"],
  },
});

new Bun.WebView({
  backend: { type: "chrome", stderr: "inherit", stdout: "inherit" },
});

await view.navigate("https://example.com");
await view.navigate("data:text/html,<h1>hello</h1>");
await view.navigate("file:///path/to/index.html");

await view.goBack(); // 类似于浏览器的后退按钮
await view.goForward(); // 类似于浏览器的前进按钮
await view.reload(); // 重新加载当前页面

view.onNavigated = (url, title) => {
  console.log("Loaded", url);
};

view.onNavigationFailed = error => {
  console.error("Navigation failed:", error.message);
};

const title = await view.evaluate("document.title");
const items = await view.evaluate("[...document.querySelectorAll('li')].map(li => li.textContent)");
const user = await view.evaluate("({ name: 'bun', ok: true })");

await view.evaluate("42"); // 42
await view.evaluate("[1, 2, 3]"); // [1, 2, 3]
await view.evaluate("undefined"); // undefined
await view.evaluate("() => 1"); // undefined（函数不可序列化）
await view.evaluate("fetch('/api').then(r => r.json())"); // 已等待

const png = await view.screenshot();
await Bun.write("page.png", png);

await view.screenshot({ format: "png" }); // 无损（默认）
await view.screenshot({ format: "jpeg", quality: 90 }); // 有损，质量 0-100（默认 80）
await view.screenshot({ format: "webp", quality: 75 }); // 仅限 Chrome 后端

const buf = await view.screenshot({ encoding: "buffer" });
console.log(buf[0] === 0x89); // PNG 魔术字节

const b64 = await view.screenshot({ encoding: "base64" });
console.log(`<img src="data:image/png;base64,${b64}">`);

const { name, size } = await view.screenshot({ encoding: "shmem" });
process.stdout.write(`\x1b_Gf=100,t=s,a=T,S=${size};${btoa(name)}\x1b\\`);
// Kitty 从共享内存读取 PNG 并解除链接该段

await view.click(150, 200);
await view.click(150, 200, { button: "right" });
await view.click(150, 200, { clickCount: 2 }); // 双击
await view.click(150, 200, { modifiers: ["Shift", "Meta"] });

await view.click("#submit");
await view.click("button.primary", { timeout: 5000 });

await view.click("input#email"); // 首先聚焦
await view.type("hello@example.com");

await view.press("Enter");
await view.press("Escape");
await view.press("ArrowDown");
await view.press("a", { modifiers: ["Meta"] }); // Cmd+A / Ctrl+A

await view.scroll(0, 500); // 向下滚动 500px
await view.scroll(-100, 0); // 向左滚动 100px

await view.scrollTo("#footer"); // 居中（默认）
await view.scrollTo("#hero", { block: "start" }); // 将其顶部对齐到视口顶部
await view.scrollTo(".card", { block: "nearest" }); // 最小滚动

await view.resize(1920, 1080);

const view = new Bun.WebView({
  console: globalThis.console,
});

const view = new Bun.WebView({
  console: (type, ...args) => {
    // type 为 "log" | "warn" | "error" | "info" | "debug" | ...
    if (type === "error") reportError(args);
  },
});

const view = new Bun.WebView({ backend: "chrome" });
await view.navigate("https://example.com"); // 必需：建立 CDP 会话

await view.cdp("Emulation.setUserAgentOverride", {
  userAgent: "MyBot/1.0",
});

const { root } = await view.cdp("DOM.getDocument");
const { nodeId } = await view.cdp("DOM.querySelector", {
  nodeId: root.nodeId,
  selector: "input[name=q]",
});
await view.cdp("DOM.focus", { nodeId });

await view.navigate("about:blank");
await view.cdp("Network.enable"); // Chrome 仅为已启用的域发出事件

view.addEventListener("Network.responseReceived", event => {
  console.log(event.data.response.status, event.data.response.url);
});

await view.navigate("https://example.com");

view.close();

Bun.WebView.closeAll();