buninu-browser 0.2.1 → 0.2.3

package/lib/renderer/interfaces.js

@@ -0,0 +1,215 @@
+/**
+ * Web IDL interface objects for the engine's singleton platform objects
+ * (navigator, screen, performance...).
+ *
+ * In a browser these objects have no own properties: attributes are
+ * accessors and operations are methods on the interface prototype
+ * (Navigator.prototype.userAgent is a getter), each throwing
+ * "Illegal invocation" for a receiver that is not a platform object of that
+ * interface, and Object.prototype.toString reads the interface name from
+ * Symbol.toStringTag. The interface object itself throws when called or
+ * constructed. Pages and integrity checks inspect exactly this shape.
+ */
+
+/**
+ * @param {string} name interface name
+ * @param {object} template members as an object literal: accessors stay
+ *   accessors, functions become operations, other values read-only attributes
+ * @param {{ parent?: object | null, base?: (prototype: object) => object }} [options]
+ *   `parent` is the prototype's prototype; `base` makes an instance with the
+ *   given prototype (an event target's constructor, for one)
+ * Accessors and operations run with `this` set to the instance's slots
+ * object (the template itself unless `create` was given one), so a template
+ * may read its other members, or per-instance data, through `this`.
+ *
+ * @returns {{ Interface: Function, prototype: object, instance: object, create: (slots?: object) => object }}
+ */
+export function platformObject(name, template, { parent = Object.prototype, base = (prototype) => Object.create(prototype) } = {}) {
+  const instances = new WeakMap();
+  const check = (self) => {
+    const slots = instances.get(self);
+    if (!slots) throw new TypeError("Illegal invocation");
+    return slots;
+  };
+  // An object literal method has no prototype and is not a constructor,
+  // as built-in operations and accessors are.
+  // Interface objects are constructors that refuse to construct.
+  const Interface = { [name]: function () { throw new TypeError("Illegal constructor"); } }[name];
+  const prototype = Object.create(parent);
+  for (const key of Reflect.ownKeys(template)) {
+    const descriptor = Object.getOwnPropertyDescriptor(template, key);
+    if (!descriptor) continue;
+    if (descriptor.get || descriptor.set) {
+      const { get, set } = descriptor;
+      const member = {};
+      Object.defineProperty(member, key, {
+        get: get ? accessor({ get [key]() { return get.call(check(this)); } }, key).get : undefined,
+        set: set ? accessor({ set [key](value) { set.call(check(this), value); } }, key).set : undefined,
+      });
+      Object.defineProperty(prototype, key, { ...Object.getOwnPropertyDescriptor(member, key), enumerable: true, configurable: true });
+    } else if (typeof descriptor.value === "function") {
+      const operation = descriptor.value;
+      const method = { [key](...args) { return Reflect.apply(operation, check(this), args); } }[key];
+      Object.defineProperty(method, "length", { value: operation.length });
+      Object.defineProperty(prototype, key, { value: method, writable: true, enumerable: true, configurable: true });
+    } else {
+      const { value } = descriptor;
+      Object.defineProperty(prototype, key, {
+        get: accessor({ get [key]() { check(this); return value; } }, key).get,
+        enumerable: true,
+        configurable: true,
+      });
+    }
+  }
+  Object.defineProperty(prototype, "constructor", { value: Interface, writable: true, configurable: true });
+  Object.defineProperty(prototype, Symbol.toStringTag, { value: name, configurable: true });
+  Object.defineProperty(Interface, "prototype", { value: prototype, writable: false, enumerable: false, configurable: false });
+  const create = (slots = template) => {
+    const object = base(prototype);
+    instances.set(object, slots);
+    return object;
+  };
+  return { Interface, prototype, instance: create(), create };
+}
+
+const accessor = (object, key) => Object.getOwnPropertyDescriptor(object, key);
+
+/**
+ * window.localStorage and sessionStorage (HTML §12.2.1): the methods on
+ * Storage.prototype, and the stored items as each storage's own properties
+ * (`localStorage.theme` reads an item; assigning one stores a string).
+ *
+ * @param {object} parent Object.prototype of the page
+ * @returns {{ Storage: Function, prototype: object, create: (map: Map<string, string>) => object }}
+ */
+export function storageInterface(parent = Object.prototype) {
+  const maps = new WeakMap();
+  const mapOf = (self) => {
+    const map = maps.get(self);
+    if (!map) throw new TypeError("Illegal invocation");
+    return map;
+  };
+  const Storage = { Storage: function () { throw new TypeError("Illegal constructor"); } }.Storage;
+  const members = {
+    get length() { return mapOf(this).size; },
+    key(index) { return [...mapOf(this).keys()][Number(index)] ?? null; },
+    getItem(key) { const map = mapOf(this); return map.has(String(key)) ? map.get(String(key)) : null; },
+    setItem(key, value) { mapOf(this).set(String(key), String(value)); },
+    removeItem(key) { mapOf(this).delete(String(key)); },
+    clear() { mapOf(this).clear(); },
+  };
+  const prototype = Object.create(parent);
+  for (const key of Reflect.ownKeys(members)) {
+    const descriptor = Object.getOwnPropertyDescriptor(members, key);
+    if (!descriptor) continue;
+    Object.defineProperty(prototype, key, { ...descriptor, enumerable: true, configurable: true });
+  }
+  Object.defineProperty(prototype, "constructor", { value: Storage, writable: true, configurable: true });
+  Object.defineProperty(prototype, Symbol.toStringTag, { value: "Storage", configurable: true });
+  Object.defineProperty(Storage, "prototype", { value: prototype });
+  const create = (map) => {
+    const target = Object.create(prototype);
+    const named = (key) => typeof key === "string" && !(key in prototype);
+    const proxy = new Proxy(target, {
+      get(object, key) {
+        if (named(key) && map.has(key)) return map.get(key);
+        return Reflect.get(object, key, proxy);
+      },
+      set(object, key, value) {
+        if (!named(key)) return Reflect.set(object, key, value, proxy);
+        map.set(key, String(value));
+        return true;
+      },
+      has(object, key) {
+        return (named(key) && map.has(key)) || Reflect.has(object, key);
+      },
+      deleteProperty(object, key) {
+        if (named(key)) map.delete(key);
+        return Reflect.deleteProperty(object, key);
+      },
+      ownKeys(object) {
+        return [...map.keys(), ...Reflect.ownKeys(object)];
+      },
+      getOwnPropertyDescriptor(object, key) {
+        if (named(key) && map.has(key)) return { value: map.get(key), writable: true, enumerable: true, configurable: true };
+        return Reflect.getOwnPropertyDescriptor(object, key);
+      },
+      defineProperty(object, key, descriptor) {
+        if (!named(key) || !("value" in descriptor)) return Reflect.defineProperty(object, key, descriptor);
+        map.set(key, String(descriptor.value));
+        return true;
+      },
+    });
+    maps.set(proxy, map);
+    return proxy;
+  };
+  return { Storage, prototype, create };
+}
+
+/** ECMAScript's own global properties: not enumerable on a browser's window. */
+const LANGUAGE_GLOBALS = new Set(["globalThis", "Infinity", "NaN", "undefined", "eval", "isFinite", "isNaN",
+  "parseFloat", "parseInt", "decodeURI", "decodeURIComponent", "encodeURI", "encodeURIComponent", "escape", "unescape"]);
+
+/** Namespace objects (Web IDL §3.13) that are lowercase, so not caught by the capitalized rule. */
+const NAMESPACE_GLOBALS = new Set(["console"]);
+
+/** An interface constant such as Node.ELEMENT_NODE. */
+const CONSTANT_NAME = /^[A-Z][A-Z0-9_]*$/;
+
+/**
+ * The Web IDL shape of a page's global object, applied before page script:
+ *
+ * - every interface prototype names its interface for Object.prototype.toString
+ *   (`[object Window]`, `[object HTMLDivElement]`),
+ * - language globals and interface objects (constructors and namespaces,
+ *   which are capitalized) are not enumerable, while the window's own
+ *   attributes and operations (document, setTimeout, onload...) are,
+ * - an interface prototype's constructor is not enumerable (§3.7.3), and
+ * - constants are read-only and non-configurable on both the interface
+ *   object and its prototype (§3.7.6).
+ *
+ * @param {object} global the page global
+ * @param {object[]} intrinsicPrototypes prototypes that belong to the
+ *   language (Object.prototype...), left without a tag
+ */
+function applyInterfaceShape(Interface, prototype) {
+  const constructor = Object.getOwnPropertyDescriptor(prototype, "constructor");
+  if (constructor?.enumerable && constructor.configurable) {
+    Object.defineProperty(prototype, "constructor", { ...constructor, enumerable: false });
+  }
+  for (const object of [Interface, prototype]) {
+    for (const key of Object.getOwnPropertyNames(object)) {
+      if (!CONSTANT_NAME.test(key)) continue;
+      const descriptor = Object.getOwnPropertyDescriptor(object, key);
+      if (!descriptor.configurable || typeof descriptor.value !== "number") continue;
+      Object.defineProperty(object, key, { value: descriptor.value, enumerable: true, writable: false, configurable: false });
+    }
+  }
+}
+
+export function applyGlobalShape(global, intrinsicPrototypes = []) {
+  const skip = new Set(intrinsicPrototypes);
+  for (const key of Reflect.ownKeys(global)) {
+    if (typeof key !== "string") continue;
+    const descriptor = Object.getOwnPropertyDescriptor(global, key);
+    if (!descriptor) continue;
+    const value = descriptor.value;
+    const isInterface = /^[A-Z]/.test(key) && (typeof value === "function" || (value && typeof value === "object"));
+    if (typeof value === "function" && /^[A-Z]/.test(key) && value.prototype && typeof value.prototype === "object"
+      && !skip.has(value.prototype) && !Object.hasOwn(value.prototype, Symbol.toStringTag)
+      && Object.isExtensible(value.prototype)) {
+      Object.defineProperty(value.prototype, Symbol.toStringTag, { value: key, configurable: true });
+    }
+    if ((isInterface || LANGUAGE_GLOBALS.has(key) || NAMESPACE_GLOBALS.has(key)) && descriptor.enumerable && descriptor.configurable) {
+      Object.defineProperty(global, key, { ...descriptor, enumerable: false });
+    }
+    if (typeof value === "function" && /^[A-Z]/.test(key) && value.prototype && typeof value.prototype === "object"
+      && !skip.has(value.prototype)) {
+      applyInterfaceShape(value, value.prototype);
+    }
+  }
+  const windowPrototype = Object.getPrototypeOf(global);
+  if (windowPrototype && !Object.hasOwn(windowPrototype, Symbol.toStringTag) && Object.isExtensible(windowPrototype)) {
+    Object.defineProperty(windowPrototype, Symbol.toStringTag, { value: "Window", configurable: true });
+  }
+}

package/lib/renderer/keyboard-input.js

@@ -0,0 +1,12 @@
+// Preserve CDP's virtual key codes; infer them for the direct press API too.
+const codes = { Backspace:8, Tab:9, Enter:13, Shift:16, Control:17, Alt:18,
+  Escape:27, ' ':32, Space:32, PageUp:33, PageDown:34, End:35, Home:36,
+  ArrowLeft:37, ArrowUp:38, ArrowRight:39, ArrowDown:40, Insert:45, Delete:46 };
+export function keyboardInput(key, options = {}) {
+  key = String(key);
+  const code = String(options.code ?? '');
+  const inferred = codes[key] ?? codes[code]
+    ?? (/^[a-z0-9]$/i.test(key) ? key.toUpperCase().charCodeAt(0) : 0);
+  const keyCode = Number(options.windowsVirtualKeyCode ?? options.keyCode ?? inferred) || 0;
+  return { key, code, keyCode, which:keyCode, charCode:0, composed:true };
+}

package/lib/renderer/main.js

@@ -8,6 +8,8 @@
  * Protocol (structured-clone messages):
  *   controller -> renderer  { type: "call", id, method, params }
  *                           { type: "fetch-result", id, result | error }
+ *                           { type: "fetch-chunk", id, data }   (video/audio stream)
+ *                           { type: "fetch-end", id } / { type: "fetch-error", id, error }
  *   renderer -> controller  { type: "ready", sandbox: { seccomp, ses } } (each { installed, reason })
  *                           { type: "result", id, result | error }
  *                           { type: "fetch", id, url, kind }
@@ -21,7 +23,9 @@
  *   controller -> renderer  { type: "ws-event", id, event, ... }  (open, message, error, close)
  *   renderer -> controller  { type: "audio-open", id, rate, channels, name } / { type: "audio-data", id, data }
  *                           / { type: "audio-finish", id } / { type: "audio-close", id }  (audio output)
- *   controller -> renderer  { type: "audio-event", id, event, ... }  (request with bytes, ended, error)
+ *                           / { type: "audio-resync", id }  (paced from now on, after the writer paused)
+ *   controller -> renderer  { type: "audio-event", id, event, ... }  (ready, request with bytes, ended, error,
+ *                           closed with sentBytes: the PCM that reached the output before audio-close)
  *
  * With --compositor, a compositor Worker (compositor.js) answers screenshots
  * and scrolling on fd 3 while this thread is busy; frames go to it with
@@ -40,13 +44,15 @@ import { COMPOSITOR_FLAG, FULL_STYLE_FLAG, MOBILE_FLAG, VERIFY_STYLE_FLAG } from
 import { installSeccomp } from "./seccomp.js";
 import { RENDERER_LOG_FLAG } from "../log.js";
 import wasmpeg from "../../vendor/wasmpeg/src/js/index.js";
+import { createBytePipe } from "../media/byte-pipe.js";
+import { notifyRejectionHandled, notifyUnhandledRejection } from "./rejections.js";
 
 const DANGEROUSLY_ALLOW_HOST_JS = "--dangerously-allow-host-js";
 
 /** Methods the controller may invoke; anything else is ignored. */
 const METHODS = new Set([
-  "loadDocument", "showFragment", "runJavaScriptURL", "url", "scrollTo", "resize", "screenshot", "title",
-  "scroll", "press", "type", "scrollOffset", "click", "evaluate", "setUserAgent", "consoleMessages", "whenLoaded",
+  "loadDocument", "showFragment", "wheel", "runJavaScriptURL", "url", "scrollTo", "resize", "screenshot", "title",
+  "scroll", "press", "type", "scrollOffset", "click", "move", "evaluate", "setUserAgent", "setInitScripts", "consoleMessages", "whenLoaded",
   "applyCompositorScroll",
 ]);
 
@@ -57,29 +63,48 @@ const logging = process.argv.includes(RENDERER_LOG_FLAG);
 const stderr = process.stderr;
 const report = (text) => stderr.write(`${text}\n`);
 
-// As in browsers, a page's unhandled rejection is logged, not fatal.
-process.on("unhandledRejection", (reason) => {
+// As in browsers, a page's unhandled rejection is logged, not fatal, unless
+// its unhandledrejection event is canceled.
+process.on("unhandledRejection", (reason, promise) => {
+  if (notifyUnhandledRejection(reason, promise)) return;
   const text = reason?.stack || (reason?.name ? `${reason.name}: ${reason.message}` : String(reason));
   report(`buninu-browser: page error: unhandled rejection: ${logging ? text : text.split("\n")[0]}`);
 });
 
+process.on("rejectionHandled", (promise) => notifyRejectionHandled(promise));
+
 const pendingFetches = new Map();
 let nextFetchId = 1;
 
 function fetchResource(url, kind) {
   return new Promise((resolve, reject) => {
     const id = nextFetchId++;
-    pendingFetches.set(id, { resolve, reject });
+    // The pipe exists before the request is sent, so a chunk that arrives
+    // before the head is still part of the body the caller receives.
+    const pipe = kind === "video" || kind === "audio" ? createBytePipe() : null;
+    pendingFetches.set(id, { resolve, reject, pipe, head: false });
     process.send({ type: "fetch", id, url, kind });
   });
 }
 
 function pageFetch(request) {
-  return new Promise((resolve, reject) => {
+  let fetchId;
+  let streamController;
+  const body = new ReadableStream({
+    start(controller) { streamController = controller; },
+    cancel() { promise.abort(); },
+  });
+  const promise = new Promise((resolve, reject) => {
     const id = nextFetchId++;
-    pendingFetches.set(id, { resolve, reject });
+    fetchId = id;
+    pendingFetches.set(id, { resolve, reject, page: true, body, streamController, head: false });
     process.send({ type: "page-fetch", id, request });
   });
+  promise.abort = () => {
+    if (!pendingFetches.delete(fetchId)) return;
+    process.send({ type: "page-fetch-abort", id: fetchId });
+  };
+  return promise;
 }
 
 // Page WebSockets live in the controller (Bun's WebSocket); events come back as ws-event.
@@ -98,6 +123,8 @@ const webSockets = {
 
 // Audio output: PCM goes to the controller, which plays it through PulseAudio.
 const audioListeners = new Map();
+// audio.close() promises, settled by the controller's "closed" event.
+const audioClosing = new Map();
 let nextAudioId = 1;
 const audio = {
   open({ rate, channels, name }, onEvent) {
@@ -108,14 +135,19 @@ const audio = {
   },
   write: (id, data) => process.send({ type: "audio-data", id, data }),
   finish: (id) => process.send({ type: "audio-finish", id }),
+  resync: (id) => process.send({ type: "audio-resync", id }),
+  /** Closes a stream; resolves to the bytes of PCM that reached the output first. */
   close(id) {
     audioListeners.delete(id);
     process.send({ type: "audio-close", id });
+    return new Promise((resolve) => audioClosing.set(id, resolve));
   },
 };
 
 // Workers load their module from disk, so this happens before seccomp.
 const compositor = process.argv.includes(COMPOSITOR_FLAG) ? await startCompositor() : null;
+// Started before the sandbox closes: the worker loads its module from disk.
+const rewriteScript = await startScriptRewriter();
 
 // Frames sent to the compositor and the latest one it confirmed.
 let framesSent = 0;
@@ -137,6 +169,7 @@ async function startCompositor() {
   });
   worker.addEventListener("message", ({ data }) => {
     if (data?.type === "scroll") renderer.applyCompositorScroll(data.x, data.y);
+    else if (data?.type === "video-report") renderer.videoReport(data);
     else if (data?.type === "frame-ack" && Number.isInteger(data.serial)) {
       framesAcknowledged = Math.max(framesAcknowledged, data.serial);
       frameWaiters = frameWaiters.filter((waiter) => {
@@ -149,9 +182,48 @@ async function startCompositor() {
   return worker;
 }
 
+/**
+ * A worker thread that rewrites classic scripts for the page realm (see
+ * rewrite-worker.js); null when it cannot start, and scripts are then
+ * rewritten on the main thread as before.
+ */
+async function startScriptRewriter() {
+  let worker;
+  try {
+    worker = new Worker(new URL("./rewrite-worker.js", import.meta.url).href);
+    await new Promise((resolve, reject) => {
+      worker.addEventListener("message", resolve, { once: true });
+      worker.addEventListener("error", reject, { once: true });
+    });
+  } catch {
+    worker?.terminate();
+    return null;
+  }
+  const pending = new Map();
+  let nextId = 0;
+  worker.addEventListener("message", ({ data }) => {
+    const request = pending.get(data?.id);
+    if (!request) return;
+    pending.delete(data.id);
+    if (data.error !== undefined) request.reject(new Error(data.error));
+    else request.resolve(data.result);
+  });
+  worker.addEventListener("error", (event) => {
+    for (const request of pending.values()) request.reject(new Error(String(event?.message ?? "script rewriter failed")));
+    pending.clear();
+  });
+  worker.unref?.();
+  return (source) => new Promise((resolve, reject) => {
+    const id = ++nextId;
+    pending.set(id, { resolve, reject });
+    worker.postMessage({ id, source });
+  });
+}
+
 const renderer = await createPageRenderer({
   fetchResource,
-  requestNavigation: (url, download = null, fragmentFrom = null) => process.send({ type: "navigate", url, download, fragmentFrom }),
+  rewriteScript,
+  requestNavigation: (url, download = null, fragmentFrom = null, post = null) => process.send({ type: "navigate", url, download, fragmentFrom, post }),
   requestDownload: ({ url, name, data }) => process.send({ type: "download-data", url, name, data }),
   pageFetch,
   webSockets,
@@ -161,7 +233,12 @@ const renderer = await createPageRenderer({
   consoleMessage: logging ? (level, text) => report(`page console.${level}: ${text}`) : null,
   trace: logging ? (text) => report(`timing: ${text}`) : null,
   onFrame: compositor ? (frame) => compositor.postMessage({ type: "frame", serial: ++framesSent, ...frame }) : null,
-  onLifecycle: (name, generation) => process.send({ type: "lifecycle", name, generation }),
+  onVideo: compositor ? (message) => compositor.postMessage(message) : null,
+  // Whoever waits for load (a screenshot, say) sees the frame painted at load.
+  onLifecycle: (name, generation) => {
+    if (name !== "load") process.send({ type: "lifecycle", name, generation });
+    else compositorCaughtUp().then(() => process.send({ type: "lifecycle", name, generation }));
+  },
   mobile: process.argv.includes(MOBILE_FLAG),
   verifyStyle: process.argv.includes(VERIFY_STYLE_FLAG),
   fullStyle: process.argv.includes(FULL_STYLE_FLAG),
@@ -224,15 +301,88 @@ async function warmUp() {
 }
 
 process.on("message", async (message) => {
+  if (message?.type === "page-fetch-head") {
+    const pending = pendingFetches.get(message.id);
+    if (!pending?.page || pending.head) return;
+    pending.head = true;
+    pending.resolve({ ...(message.result ?? {}), body: pending.body });
+    return;
+  }
+  if (message?.type === "page-fetch-chunk") {
+    pendingFetches.get(message.id)?.streamController?.enqueue(message.data);
+    return;
+  }
+  if (message?.type === "page-fetch-end") {
+    const pending = pendingFetches.get(message.id);
+    if (!pending?.page) return;
+    pendingFetches.delete(message.id);
+    pending.streamController.close();
+    return;
+  }
+  if (message?.type === "page-fetch-error") {
+    const pending = pendingFetches.get(message.id);
+    if (!pending?.page) return;
+    pendingFetches.delete(message.id);
+    const error = new Error(message.error || "fetch failed");
+    if (pending.head) pending.streamController.error(error);
+    else pending.reject(error);
+    return;
+  }
+  if (message?.type === "fetch-chunk") {
+    const pending = pendingFetches.get(message.id);
+    if (message.data) pending?.pipe?.append(message.data);
+    return;
+  }
+  if (message?.type === "fetch-end") {
+    const pending = pendingFetches.get(message.id);
+    if (!pending) return;
+    pendingFetches.delete(message.id);
+    pending.pipe?.finish();
+    return;
+  }
+  if (message?.type === "fetch-error") {
+    const pending = pendingFetches.get(message.id);
+    if (!pending) return;
+    pendingFetches.delete(message.id);
+    const error = new Error(message.error || "media fetch failed");
+    pending.pipe?.fail(error);
+    if (!pending.head) pending.reject(error);
+    return;
+  }
   if (message?.type === "fetch-result") {
     const pending = pendingFetches.get(message.id);
     if (!pending) return;
+    if (message.error) {
+      pendingFetches.delete(message.id);
+      const error = new Error(message.error);
+      pending.pipe?.fail(error);
+      if (!pending.head) pending.reject(error);
+      return;
+    }
+    const result = message.result ?? {};
+    if (result.streaming && pending.pipe) {
+      pending.head = true;
+      pending.resolve({ ...result, body: pending.pipe });
+      return;
+    }
     pendingFetches.delete(message.id);
-    if (message.error) pending.reject(new Error(message.error));
-    else pending.resolve(message.result);
+    if (pending.pipe) {
+      if (result.body) pending.pipe.append(result.body);
+      pending.pipe.finish();
+      pending.head = true;
+      pending.resolve({ ...result, body: pending.pipe });
+      return;
+    }
+    pending.resolve(result);
     return;
   }
   if (message?.type === "audio-event") {
+    if (message.event === "closed") {
+      const resolve = audioClosing.get(message.id);
+      audioClosing.delete(message.id);
+      resolve?.(Number.isFinite(message.sentBytes) ? message.sentBytes : 0);
+      return;
+    }
     const listener = audioListeners.get(message.id);
     if (message.event === "ended" || message.event === "error") audioListeners.delete(message.id);
     listener?.(message);

package/lib/renderer/media-playback-events.js

@@ -0,0 +1,13 @@
+// `play` means unpaused; `playing` means playback can actually advance.
+// Keep the distinction across pauses and network starvation.
+const phases = new WeakMap();
+export function playbackEvent(state, phase, dispatch) {
+  const previous = phases.get(state);
+  if (previous === phase) return;
+  phases.set(state, phase);
+  if (phase === 'playing' && previous === 'waiting') {
+    dispatch(state, 'canplay');
+    if (phases.get(state) !== phase || !state.playing) return;
+  }
+  dispatch(state, phase);
+}