buninu-browser 0.2.1 → 0.2.2

package/lib/renderer/canvas-2d.js

@@ -0,0 +1,92 @@
+/**
+ * Page `<canvas>` 2d contexts, drawn by this process's CanvasKit.
+ *
+ * `loadGraphics` calls `setCanvasKit` with the instance the page is rasterized
+ * with. A second CanvasKit cannot share images with that one, so a page canvas
+ * is `CanvasKit.MakeCanvas`, not a separate software bitmap.
+ *
+ * MakeCanvas has no width or height. Setting either on the element disposes
+ * that surface and opens another (HTML resets the bitmap and the drawing
+ * state). The object the page holds stays the same and forwards to whichever
+ * context is current.
+ *
+ * `getImageData` builds its array on `readPixels().buffer`, which can be the
+ * whole WASM heap. The copy handed back is only the requested rectangle.
+ */
+
+let CanvasKit = null;
+
+/** The CanvasKit `loadGraphics` instantiated. Page canvases share it. */
+export function setCanvasKit(kit) {
+  CanvasKit = kit;
+}
+
+const surfaces = new WeakMap();
+
+/** The element's 2d context, or null for any other context id or before CanvasKit loads. */
+export function canvasContext(node, type) {
+  if (type !== "2d" || !CanvasKit) return null;
+  let entry = surfaces.get(node);
+  if (!entry) {
+    entry = open(node);
+    if (!entry) return null;
+    surfaces.set(node, entry);
+  }
+  return entry.proxy;
+}
+
+/** Setting width or height clears the bitmap and the drawing state. */
+export function resetCanvas(node) {
+  surfaces.get(node)?.reopen();
+}
+
+// A zero bitmap makes MakeSurface fail and getImageData reject the rectangle.
+// The element can still report 0; drawing uses one pixel until it grows.
+function bitmapSize(node) {
+  return [Math.max(1, node.width >>> 0), Math.max(1, node.height >>> 0)];
+}
+
+function open(node) {
+  let surface = makeSurface(node);
+  if (!surface) return null;
+  let context = surface.getContext("2d");
+  const proxy = new Proxy(Object.create(null), {
+    get(_target, property) {
+      if (property === "getImageData") return (sx, sy, sw, sh) => copyImageData(context.getImageData(sx, sy, sw, sh));
+      const value = context[property];
+      return typeof value === "function" ? value.bind(context) : value;
+    },
+    set(_target, property, value) {
+      context[property] = value;
+      return true;
+    },
+    has(_target, property) {
+      return property in context;
+    },
+  });
+  return {
+    proxy,
+    reopen() {
+      const next = makeSurface(node);
+      if (!next) return;
+      const previous = surface;
+      surface = next;
+      context = surface.getContext("2d");
+      previous.dispose?.();
+    },
+  };
+}
+
+function makeSurface(node) {
+  const [width, height] = bitmapSize(node);
+  return CanvasKit.MakeCanvas(width, height);
+}
+
+function copyImageData(image) {
+  if (!image?.data) throw new DOMException("The source rectangle is empty.", "IndexSizeError");
+  const count = image.width * image.height * 4;
+  const data = new Uint8ClampedArray(count);
+  const source = new Uint8ClampedArray(image.data.buffer, image.data.byteOffset, Math.min(count, image.data.length));
+  data.set(source);
+  return { width: image.width, height: image.height, data, colorSpace: "srgb" };
+}

package/lib/renderer/host.js

@@ -14,7 +14,7 @@
  */
 import { closeSync } from "node:fs";
 import { PulseClient } from "../audio/pulse-client.js";
-import { logEnabled, pipeToLog, RENDERER_LOG_FLAG } from "../log.js";
+import { logEnabled, pipeToLog, RENDERER_LOG_FLAG, writeLog } from "../log.js";
 import { NetworkService } from "../network/network-service.js";
 import { COMPOSITOR_FLAG, FULL_STYLE_FLAG, VERIFY_STYLE_FLAG } from "./flags.js";
 
@@ -23,8 +23,10 @@ const FETCH_MODES = new Set(["cors", "no-cors", "same-origin"]);
 const CREDENTIALS_MODES = new Set(["omit", "same-origin", "include"]);
 const REDIRECT_MODES = new Set(["follow", "error", "manual"]);
 const MAX_REQUEST_HEADERS = 100;
-const RESOURCE_KINDS = new Set(["stylesheet", "image", "script", "metadata", "video", "audio"]);
+const RESOURCE_KINDS = new Set(["stylesheet", "image", "script", "metadata", "video", "audio", "iframe"]);
 const NAVIGATION_SCHEMES = new Set(["http:", "https:", "about:", "data:"]);
+// The largest form body a page may POST in a navigation.
+const MAX_POST_BYTES = 16 * 1024 * 1024;
 const MAX_RESOURCE_BYTES = 32 * 1024 * 1024;
 // Audio output: one PulseAudio native-protocol connection (jspulse or a
 // PulseAudio daemon on 127.0.0.1:4713) shared by every renderer, opened on
@@ -69,6 +71,8 @@ export class RendererHost {
   #sockets = new Map();
   // Audio streams: id -> { child, stream } (PulseAudio playback streams)
   #audio = new Map();
+  // In-flight page fetches, so AbortController reaches the actual HTTP request.
+  #pageFetches = new Map();
   #nextId = 1;
   #queue = Promise.resolve();
   #restarting = false;
@@ -86,7 +90,8 @@ export class RendererHost {
    *   args?: string[],
    *   timeout?: number,
    *   onRestart?: (call: (method: string, ...params: unknown[]) => Promise<unknown>) => Promise<void>,
-   *   onNavigate?: (url: string, downloadName: string | null, fragmentFrom: { x: number, y: number } | null) => void,
+   *   onNavigate?: (url: string, downloadName: string | null, fragmentFrom: { x: number, y: number } | null,
+   *     post: { method: "POST", body: Uint8Array, contentType: string, referrer: string } | null) => void,
    *   onDownload?: (payload: { url: string, name: string, data: Uint8Array }) => void,
    *   onFrame?: () => void,
    *   onLifecycle?: (name: "DOMContentLoaded" | "load", generation: number) => void,
@@ -149,6 +154,7 @@ export class RendererHost {
         this.#closeChannel(channel);
         this.#closeSockets(child);
         this.#closeAudio(child);
+        this.#closePageFetches(child);
         if (this.#child !== child) return;
         console.error(`buninu-browser: renderer ${child.pid} exited unexpectedly (${signalCode ?? `code ${exitCode}`})`);
         this.#child = null;
@@ -301,6 +307,7 @@ export class RendererHost {
     const child = this.#child;
     this.#closeSockets(child);
     this.#closeAudio(child);
+    this.#closePageFetches(child);
     this.#child = null;
     this.#ready = null;
     child?.kill();
@@ -360,6 +367,9 @@ export class RendererHost {
       this.#fetchForRenderer(child, message);
     } else if (message.type === "page-fetch" && Number.isInteger(message.id)) {
       this.#pageFetch(child, message);
+    } else if (message.type === "page-fetch-abort" && Number.isInteger(message.id)) {
+      const entry = this.#pageFetches.get(message.id);
+      if (entry?.child === child) entry.controller.abort();
     } else if (message.type === "ws-open" && Number.isInteger(message.id)) {
       this.#openSocket(child, message);
     } else if (message.type === "ws-send" && Number.isInteger(message.id)) {
@@ -391,11 +401,22 @@ export class RendererHost {
         this.#audio.delete(message.id);
         send({ event: "ended" });
       }, () => this.#audio.delete(message.id));
+    } else if (message.type === "audio-resync" && Number.isInteger(message.id)) {
+      const entry = this.#audio.get(message.id);
+      if (entry?.child === child) (entry.opened ?? Promise.resolve()).then(() => entry.stream?.resync()).catch(() => {});
     } else if (message.type === "audio-close" && Number.isInteger(message.id)) {
       const entry = this.#audio.get(message.id);
       if (entry?.child !== child) return;
       this.#audio.delete(message.id);
-      (entry.opened ?? Promise.resolve()).then(() => entry.stream?.close()).catch(() => {});
+      // Tell the renderer how much PCM reached the server: a server may
+      // still play what it holds, so the renderer resumes after it.
+      (entry.opened ?? Promise.resolve()).then(() => {
+        const sentBytes = entry.stream?.sentBytes ?? 0;
+        if (this.#child === child) child.send({ type: "audio-event", id: message.id, event: "closed", sentBytes });
+        return entry.stream?.close();
+      }).catch(() => {
+        if (this.#child === child) child.send({ type: "audio-event", id: message.id, event: "closed", sentBytes: 0 });
+      });
     } else if (message.type === "lifecycle" && LIFECYCLE_NAMES.has(message.name) && Number.isInteger(message.generation)) {
       this.#onLifecycle?.(message.name, message.generation);
     } else if (message.type === "cookie" && typeof message.value === "string" && message.value.length <= 4096) {
@@ -412,7 +433,16 @@ export class RendererHost {
         const download = typeof message.download === "string" ? message.download.slice(0, 200) : null;
         const from = message.fragmentFrom;
         const fragmentFrom = from && Number.isFinite(from.x) && Number.isFinite(from.y) ? { x: from.x, y: from.y } : null;
-        this.#onNavigate?.(target.href, download, fragmentFrom);
+        // A form POST: its body and type from the page; Origin and Referer
+        // from the document the renderer shows, which the page cannot choose.
+        const post = message.post;
+        const request = post && post.method === "POST" && post.body instanceof Uint8Array
+          && post.body.byteLength <= MAX_POST_BYTES && typeof post.contentType === "string" && post.contentType.length <= 200
+          && !/[\r\n]/.test(post.contentType) && ["http:", "https:"].includes(target.protocol)
+          ? { method: "POST", body: post.body, contentType: post.contentType, referrer: this.#documentUrl }
+          : null;
+        if (post && !request) return;
+        this.#onNavigate?.(target.href, download, fragmentFrom, request);
       }
     } else if (message.type === "download-data" && typeof message.url === "string"
       && message.data instanceof Uint8Array && message.data.byteLength <= 64 * 1024 * 1024) {
@@ -473,11 +503,14 @@ export class RendererHost {
         rate, channels, name: String(name ?? "audio").slice(0, 200),
         leadSeconds: name === "piano" ? 0.12 : undefined,
         onRequest: (bytes) => send({ event: "request", bytes }),
+        onTiming: name === "piano" ? null : (timing) => send({ event: "timing", ...timing }),
+        onTimingError: (error) => send({ event: "timing-error", message: String(error?.message ?? error) }),
       }))
       .then((stream) => {
         if (this.#audio.get(id) !== entry) return stream.close();
         entry.stream = stream;
         for (const data of entry.early.splice(0)) stream.write(data);
+        send({ event: "ready" });
       }, (error) => {
         this.#audio.delete(id);
         send({ event: "error", message: String(error?.message ?? error) });
@@ -493,6 +526,14 @@ export class RendererHost {
     }
   }
 
+  #closePageFetches(child) {
+    for (const [id, entry] of this.#pageFetches) {
+      if (entry.child !== child) continue;
+      this.#pageFetches.delete(id);
+      entry.controller.abort();
+    }
+  }
+
   #closeSockets(child) {
     for (const [id, entry] of this.#sockets) {
       if (entry.child !== child) continue;
@@ -516,15 +557,59 @@ export class RendererHost {
     if (!ALLOWED_SCHEMES.has(target.protocol) || !RESOURCE_KINDS.has(kind)) {
       return reply({ error: `blocked ${kind} request for ${target.protocol}` });
     }
+    // A renderer only ever holds documents of its own origin (site isolation
+    // is by origin): an iframe's document is given to it only when it is
+    // same-origin with the page, before and after redirects, and allows
+    // being framed.
+    const frame = kind === "iframe";
+    if (frame && !sameOrigin(target.href, this.#documentUrl)) return reply({ error: "cross-origin frame" });
+    // Video and audio over http(s) stream. data: stays one response: it is
+    // already in hand, and the renderer wraps it in a finished pipe.
+    if ((kind === "video" || kind === "audio") && target.protocol !== "data:") {
+      const send = (payload) => {
+        if (this.#child === child) child.send(payload);
+      };
+      try {
+        await this.#network.streamSubresource(target.href, this.#documentUrl, kind, (event) => {
+          if (event.type === "head") {
+            send({
+              type: "fetch-result", id,
+              result: {
+                streaming: true,
+                ok: event.ok,
+                status: event.status,
+                statusText: event.statusText ?? "",
+                url: event.url || target.href,
+                contentType: event.contentType ?? "",
+                contentLength: event.contentLength ?? null,
+                documentCookie: this.#network.documentCookie(this.#documentUrl),
+              },
+            });
+          } else if (event.type === "chunk" && event.data instanceof Uint8Array) {
+            send({ type: "fetch-chunk", id, data: event.data });
+          } else if (event.type === "end") {
+            send({ type: "fetch-end", id });
+          } else if (event.type === "error") {
+            send({ type: "fetch-error", id, error: String(event.error ?? "media fetch failed") });
+          }
+        });
+      } catch (error) {
+        send({ type: "fetch-error", id, error: String(error?.message ?? error) });
+      }
+      return;
+    }
     try {
       const response = target.protocol === "data:"
         ? await dataResponse(target)
         : await this.#network.subresource(target.href, this.#documentUrl, kind);
       if (response.body.byteLength > MAX_RESOURCE_BYTES) return reply({ error: "resource too large" });
+      if (frame && !sameOrigin(response.url || target.href, this.#documentUrl)) return reply({ error: "cross-origin frame" });
+      if (frame && framingDenied(response.rawHeaders ?? [])) return reply({ error: "framing denied" });
       reply({
         result: {
           ok: response.ok,
           status: response.status,
+          statusText: response.statusText ?? "",
           url: response.url || target.href,
           contentType: response.contentType,
           body: response.body,
@@ -541,17 +626,54 @@ export class RendererHost {
     const reply = (payload) => {
       if (this.#child === child) child.send({ type: "fetch-result", id, ...payload });
     };
+    const started = performance.now();
+    const controller = new AbortController();
+    const entry = { child, controller };
+    this.#pageFetches.set(id, entry);
+    let streamHead = false;
+    let sanitized = null;
     try {
-      const sanitized = sanitizePageRequest(request);
-      const response = await this.#network.pageFetch(sanitized, this.#documentUrl);
+      sanitized = sanitizePageRequest(request);
+      const response = await this.#network.pageFetch(sanitized, this.#documentUrl, {
+        signal: controller.signal,
+        onChunk: (event) => {
+          if (this.#child !== child) return;
+          if (event.type === "head") {
+            streamHead = true;
+            child.send({ type: "page-fetch-head", id, result: {
+              ...event.result, documentCookie: this.#network.documentCookie(this.#documentUrl),
+            } });
+          }
+          else if (event.type === "chunk") child.send({ type: "page-fetch-chunk", id, data: event.data });
+          else if (event.type === "end") child.send({ type: "page-fetch-end", id });
+        },
+      });
+      if (response.streaming) {
+        logFetch(sanitized, `${response.status} streaming`, started);
+        return;
+      }
       const { rawHeaders, ...result } = response;
+      logFetch(sanitized, `${response.status} ${response.body?.byteLength ?? 0}B`, started);
       reply({ result: { ...result, documentCookie: this.#network.documentCookie(this.#documentUrl) } });
     } catch (error) {
-      reply({ error: String(error?.message ?? error) });
+      logFetch(sanitized ?? request, `failed: ${error?.message ?? error}`, started);
+      if (streamHead && this.#child === child) {
+        child.send({ type: "page-fetch-error", id, error: String(error?.message ?? error) });
+      } else reply({ error: String(error?.message ?? error) });
+    } finally {
+      if (this.#pageFetches.get(id) === entry) this.#pageFetches.delete(id);
     }
   }
 }
 
+/** With BUNINU_LOG, one line per page fetch()/XMLHttpRequest: method, URL (shortened), outcome, time. */
+function logFetch(request, outcome, started) {
+  if (!logEnabled()) return;
+  const url = String(request?.url ?? "");
+  const shown = url.length > 160 ? `${url.slice(0, 160)}…` : url;
+  writeLog("fetch", `${request?.method ?? "GET"} ${shown} -> ${outcome} in ${Math.round(performance.now() - started)}ms`);
+}
+
 /** Keeps only the expected shape of a renderer's (untrusted) sandbox report. */
 function sanitizeSandboxReport(report) {
   const layer = (value) => ({
@@ -602,3 +724,31 @@ function sanitizeCompositorResult(method, result) {
   const y = Number(result?.y);
   return { x: Number.isFinite(x) ? x : 0, y: Number.isFinite(y) ? y : 0 };
 }
+
+function sameOrigin(left, right) {
+  try {
+    const a = new URL(left);
+    const b = new URL(right);
+    return ["http:", "https:"].includes(a.protocol) && a.origin === b.origin;
+  } catch {
+    return false;
+  }
+}
+
+/**
+ * Whether a response refuses to be framed (by its own origin, the only case
+ * here): X-Frame-Options: DENY, or Content-Security-Policy frame-ancestors 'none'.
+ */
+function framingDenied(rawHeaders) {
+  for (const [name, value] of rawHeaders) {
+    const header = String(name).toLowerCase();
+    if (header === "x-frame-options" && String(value).trim().toLowerCase() === "deny") return true;
+    if (header === "content-security-policy") {
+      for (const directive of String(value).split(";")) {
+        const [directiveName, ...sources] = directive.trim().toLowerCase().split(/\s+/);
+        if (directiveName === "frame-ancestors" && sources.length === 1 && sources[0] === "'none'") return true;
+      }
+    }
+  }
+  return false;
+}

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 });
+  }
+}