buninu-browser 0.5.1 → 0.7.0

package/README.md

@@ -96,9 +96,10 @@ the rest is passed on:
   argument goes to casty)
 - `--headless`: the engine alone, as
   a CDP endpoint
-- `--win32`, `--gtk`, `--appkit`,
-  `--qt`: native windowed frontends
-  (reserved, not implemented yet)
+- `--win32`: casty with a native Windows
+  window (Windows only)
+- `--gtk`, `--appkit`, `--qt`: native
+  windowed frontends (reserved, not implemented yet)
 - `--help`/`-h`, `--version`/`-V`,
   `--readme`: this launcher's help,
   version and backend details, and
@@ -291,9 +292,9 @@ borrows a contiguous raster view instead of rescaling; encoded output uses
 the same crop. `Page.getLayoutMetrics` provides the viewport position so
 Casty can follow document scrolling.
 
-Casty also sends a private `clip` on `Page.startScreencast`. It takes precedence over fallback max limits and crops at native pixel density, without resizing. Width/height are CSS units; output pixels still follow device scale. This extension is not standard CDP.
+Casty also sends a private `clip` on `Page.startScreencast`. It takes precedence over fallback max limits and crops at native pixel density, without resizing. Width/height are CSS units; output pixels still follow device scale. This extension is not standard CDP. A clip with both width and height equal to zero requests update notifications only: the server sends a fixed 1×1 PNG placeholder without rendering or encoding a preview. Ordinary captureScreenshot still rejects zero-sized clips.
 
-Casty 也會在 `Page.startScreencast` 傳入私有 `clip`；優先於相容用的 max 限制，以原像素密度裁切、不縮放。寬高是 CSS 單位，實體像素仍隨 device scale 換算。此擴充不是標準 CDP。
+Casty 也會在 `Page.startScreencast` 傳入私有 `clip`；優先於相容用的 max 限制，以原像素密度裁切、不縮放。寬高是 CSS 單位，實體像素仍隨 device scale 換算。此擴充不是標準 CDP。寬高都為零時只發送更新通知：server 回傳固定 1×1 PNG 佔位資料，不渲染或編碼預覽；一般 captureScreenshot 仍拒絕零尺寸。
 
 標準 CDP `clip` 也適用於 raw 截圖；小數 CSS 尺寸保留到最後才換算成實體像素，
 避免字體大小改變後差一列而觸發 bunterm 縮放。`clip.scale: 1` 的全寬裁切
@@ -469,7 +470,13 @@ it to `buninu-browser.log` in the working directory, or set
 
 - page errors and page `console` output;
 - per-phase load timings;
-- renderer crashes and watchdog kills.
+- renderer crashes and explicitly enabled watchdog kills.
+
+Renderer and video-worker startup have no deadline. Document navigation also
+waits until completion, failure, or explicit close. The browser does not enable
+the renderer method watchdog by default: slow initialization or page work must
+not kill the renderer. Internal callers can opt into a method watchdog through
+`rendererTimeout`; this does not impose a startup or navigation deadline.
 
 Renderers cannot open files under seccomp, so the controller collects their
 output and writes the log.

package/index.js

@@ -9,8 +9,9 @@
  *   --casty      the terminal frontend (default): runs casty with
  *                CASTY_BROWSER set to this package's buninu-browser.js
  *   --headless   the engine alone (buninu-browser.js, a CDP endpoint)
- *   --win32, --gtk, --appkit, --qt
- *                reserved for the native windowed frontends (not implemented)
+ *   --win32      casty's native Windows frontend
+ *   --gtk, --appkit, --qt
+ *                reserved for native windowed frontends (not implemented)
  *
  *   --help, -h / --version, -V / --readme, --docs
  *                this launcher's help, version and README
@@ -33,7 +34,7 @@ export * from "./buninu-browser.js";
 
 const CASTY_PACKAGE = "@drxiaozhi/casty";
 const ENGINE = join(import.meta.dir, "buninu-browser.js");
-const RESERVED_FRONTENDS = new Set(["--win32", "--gtk", "--appkit", "--qt"]);
+const RESERVED_FRONTENDS = new Set(["--gtk", "--appkit", "--qt"]);
 const INFORMATION = new Map([
   ["--help", "help"], ["-h", "help"], ["-help", "help"],
   ["--version", "version"], ["-V", "version"], ["-version", "version"],
@@ -52,6 +53,7 @@ export function chooseFrontend(argv) {
     return { frontend: first.slice(2), args: rest };
 
   if (first === "--casty") return { frontend: "casty", args: rest };
+  if (first === "--win32") return { frontend: "win32", args: rest };
   if (first === "--headless") return { frontend: "headless", args: rest };
   if (RESERVED_FRONTENDS.has(first)) return { frontend: first.slice(2), args: rest, reserved: true };
   if (INFORMATION.has(first)) return { frontend: INFORMATION.get(first), args: rest, information: true };
@@ -96,7 +98,9 @@ ${typeof waylandHelp === "undefined" ? "" : waylandHelp}  --casty
   --quickshell-wayland, --quickshell-headless, --quickshell-casty
       Experimental Quickshell CLI (-p FILE_OR_DIRECTORY / -c CONFIG)
       Use -- before backend arguments; each entry supports --help
-  --win32, --gtk, --appkit, --qt
+  --win32
+      Native Windows window driven by casty (Windows only)
+  --gtk, --appkit, --qt
       Native windowed frontends (reserved, not implemented yet)
 
 Browser identity:
@@ -129,7 +133,7 @@ function printVersion() {
   console.log("Platform:", `${process.platform}-${process.arch}`);
   console.log("Engine:", ENGINE);
   console.log("casty launcher:", castyCommand([]).join(" "));
-  console.log("Frontends: casty (default), headless; reserved: win32, gtk, appkit, qt");
+  console.log("Frontends: casty (default), headless, win32; reserved: gtk, appkit, qt");
 }
 
 async function printReadme() {
@@ -176,6 +180,6 @@ if (import.meta.main) {
 
   const code = frontend === "headless"
     ? await run([process.execPath, ENGINE, ...args])
-    : await run(castyCommand(args), { ...process.env, CASTY_BROWSER: ENGINE });
+    : await run(castyCommand(frontend === "win32" ? ["--win32", ...args] : args), { ...process.env, CASTY_BROWSER: ENGINE });
   process.exit(code ?? 1);
 }

package/lib/audio/pcm.js

@@ -1,6 +1,17 @@
+// Typed-array stores use host byte order; the wire format is always s16le.
+const LITTLE_ENDIAN = new Uint8Array(new Uint16Array([1]).buffer)[0] === 1;
+
 /** Interleaved Float32 samples in [-1, 1] (as audio decoders produce) as s16le bytes. */
 export function floatToS16(samples) {
   const out = new Uint8Array(samples.length * 2);
+  if (LITTLE_ENDIAN) {
+    const view = new Int16Array(out.buffer);
+    for (let index = 0; index < samples.length; index++) {
+      const value = Math.max(-1, Math.min(1, samples[index]));
+      view[index] = Math.round(value < 0 ? value * 32768 : value * 32767);
+    }
+    return out;
+  }
   const view = new DataView(out.buffer);
   for (let index = 0; index < samples.length; index++) {
     const value = Math.max(-1, Math.min(1, samples[index]));

package/lib/audio/pulse-client.js

@@ -339,6 +339,9 @@ export class PulseClient {
  */
 const LEAD_SECONDS = 0.5;
 const PACE_MS = 50;
+// Video follows this measured clock. Sharing the 50 ms PCM timer would cap
+// presentation at 20 FPS even when decoding and output can keep up.
+const TIMING_MS = 16;
 const MIN_REQUEST_SECONDS = 0.02;
 const MIN_PACKET_SECONDS = 0.04;
 const MAX_PACKET_SECONDS = 0.1;
@@ -355,6 +358,7 @@ class PlaybackStream {
   #outstanding = 0;
   #started = null;
   #timer = null;
+  #timingTimer = null;
   #leadSeconds;
   #onTiming;
   #onTimingError;
@@ -376,7 +380,8 @@ class PlaybackStream {
     this.#producerBuffer = new PlaybackBuffer(this.#bytesPerSecond, this.#frameBytes, leadSeconds);
     this.#onTiming = onTiming;
     this.#onTimingError = onTimingError;
-    this.#timer = setInterval(() => { this.#pace(); void this.updateTiming(); }, PACE_MS);
+    this.#timer = setInterval(() => this.#pace(), PACE_MS);
+    if (onTiming) this.#timingTimer = setInterval(() => { void this.updateTiming(); }, TIMING_MS);
   }
 
   async updateTiming() {
@@ -393,7 +398,6 @@ class PlaybackStream {
       this.#onTiming({ seconds: this.#playedBytes / this.#bytesPerSecond,
         sentSeconds: this.#offset / this.#bytesPerSecond, sinkSeconds: timing.sinkSeconds, playing: timing.playing,
         bufferedSeconds: this.#queuedBytes / this.#bytesPerSecond });
-      this.#pace();
     } catch (error) {
       if (!this.killed) this.#onTimingError?.(error);
     } finally {
@@ -527,5 +531,6 @@ class PlaybackStream {
     this.#queue = [];
     this.#queuedBytes = 0;
     clearInterval(this.#timer);
+    clearInterval(this.#timingTimer);
   }
 }

package/lib/cdp-server.js

@@ -40,11 +40,15 @@ export class CdpServer {
     // Pages change on their own (loading stages, scripts, compositor
     // scrolling): push a screencast frame whenever the context reports one,
     // and send lifecycle events when the document really reaches them.
-    context.onFrame?.(() => {
-      for (const target of state.targets.values()) {
-        if (target.screencast && target.screencastEmit) pushScreencastFrame(context, state, target);
+    context.onFrame?.((frame) => {
+      const offset = frame?.scrollOffset;
+      const scrollOffset = Number.isFinite(offset?.x) && Number.isFinite(offset?.y)
+        ? { x: offset.x, y: offset.y } : null;
+      for (const target of [...state.targets.values(), state.implicitTarget]) {
+        if (!target) continue;
+        for (const stream of screencasts(target)) stream.scrollOffset = scrollOffset;
+        void pushScreencastFrame(context, state, target);
       }
-      if (state.implicitTarget?.screencast) pushScreencastFrame(context, state, state.implicitTarget);
     });
     context.onLifecycle?.((name) => {
       for (const target of state.targets.values()) emitLifecycle(target, name);
@@ -164,6 +168,8 @@ export class CdpServer {
             const msg = JSON.parse(text);
             id = msg.id;
             sessionId = msg.sessionId;
+            if (sessionId && state.sessionOwners.get(sessionId) !== ws)
+              throw Error("No session owned by this connection");
             let dispatchSessionId = sessionId;
             if (!dispatchSessionId && ws.data?.targetId) {
               dispatchSessionId = `page-${ws.data.targetId}`;
@@ -210,12 +216,17 @@ export class CdpServer {
         },
         close(ws) {
           for (const target of state.targets.values()) {
-            if (target.screencastEmit?.owner === ws) stopScreencast(target);
+            stopScreencast(target, ws);
             if (target.lifecycleEmit?.owner === ws) target.lifecycleEmit = null;
           }
           const implicit = state.implicitTarget;
-          if (implicit?.screencastEmit?.owner === ws) stopScreencast(implicit);
+          if (implicit) stopScreencast(implicit, ws);
           if (implicit?.lifecycleEmit?.owner === ws) implicit.lifecycleEmit = null;
+          for (const [id, owner] of state.sessionOwners) {
+            if (owner !== ws) continue;
+            state.sessionOwners.delete(id);
+            state.sessions.delete(id);
+          }
           serverLog("[CdpServer] client disconnected");
         },
       },
@@ -279,6 +290,7 @@ function createCdpState() {
     nextScreencastFrameId: 1,
     targets: new Map(),
     sessions: new Map(),
+    sessionOwners: new Map(),
     objects: new Map(),
     initialNavigations: new Map(),
     implicitTarget: null,
@@ -320,6 +332,7 @@ async function dispatch(ctx, state, method, params, sessionId, emit) {
         const target = state.targets.get(targetId);
         target.attached = true;
         state.sessions.set(attachedSessionId, targetId);
+        state.sessionOwners.set(attachedSessionId, emit.owner);
         emit("Target.attachedToTarget", {
           sessionId: attachedSessionId,
           targetInfo: createTargetInfo(target),
@@ -336,6 +349,7 @@ async function dispatch(ctx, state, method, params, sessionId, emit) {
       const sessionId = `session-${state.nextSessionId++}`;
       target.attached = true;
       state.sessions.set(sessionId, params.targetId);
+      state.sessionOwners.set(sessionId, emit.owner);
       return { sessionId };
     }
     case "Target.getTargets":
@@ -369,6 +383,7 @@ async function dispatch(ctx, state, method, params, sessionId, emit) {
       for (const [attachedSessionId, targetId] of state.sessions) {
         if (targetId !== params.targetId) continue;
         state.sessions.delete(attachedSessionId);
+        state.sessionOwners.delete(attachedSessionId);
         emit("Target.detachedFromTarget", {
           sessionId: attachedSessionId,
           targetId,
@@ -378,9 +393,14 @@ async function dispatch(ctx, state, method, params, sessionId, emit) {
       emit("Target.targetDestroyed", { targetId: params.targetId });
       return { success: true };
     }
-    case "Target.detachFromTarget":
+    case "Target.detachFromTarget": {
+      const target = state.targets.get(state.sessions.get(params.sessionId));
+      if (state.sessionOwners.get(params.sessionId) !== emit.owner) throw Error("No session owned by this connection");
+      if (target) stopScreencast(target, emit.owner, params.sessionId);
       state.sessions.delete(params.sessionId);
+      state.sessionOwners.delete(params.sessionId);
       return {};
+    }
     case "Page.enable":
       return {};
     case "Page.getResourceContent": {
@@ -461,7 +481,7 @@ async function dispatch(ctx, state, method, params, sessionId, emit) {
       // A javascript: URL runs in the current document: no new loader or history entry.
       if (/^\s*javascript:/i.test(String(params.url))) {
         await ctx.navigate?.(String(params.url).trim());
-        if (target.screencast) await pushScreencastFrame(ctx, state, target);
+        if (target.screencasts.size) await pushScreencastFrame(ctx, state, target);
         return { frameId: target.frameId, loaderId: target.loaderId };
       }
       // Events of the next document belong to its new loader.
@@ -470,7 +490,7 @@ async function dispatch(ctx, state, method, params, sessionId, emit) {
       navigateTarget(state, target, params.url, emit, { addHistory: true });
       target.title = await getContextTitle(ctx, target);
       target.history[target.historyIndex].title = target.title;
-      if (target.screencast) {
+      if (target.screencasts.size) {
         await pushScreencastFrame(ctx, state, target);
       }
       state.initialNavigations.get(target.targetId)?.navigated.resolve();
@@ -523,22 +543,26 @@ async function dispatch(ctx, state, method, params, sessionId, emit) {
     }
     case "Page.startScreencast": {
       const target = getSessionTarget(state, sessionId);
-      stopScreencast(target);
-      target.screencast = { ...params };
-      target.screencastEmit = emit;
-      // As in Chrome, the reply does not wait for the first frame (nor the
-      // renderer, which may still be starting); frames follow as events.
-      void pushScreencastFrame(ctx, state, target);
+      stopScreencast(target, emit.owner, sessionId ?? null);
+      let sessions = target.screencasts.get(emit.owner);
+      if (!sessions) target.screencasts.set(emit.owner, sessions = new Map());
+      const stream = { params: { ...params }, emit, active: true, busy: false,
+        pending: false, scrollOffset: null, frames: new Set() };
+      sessions.set(sessionId ?? null, stream);
+      // Do not wait for a capture; each viewer owns its own backpressure.
+      void pushScreencastFrame(ctx, state, target, stream);
       return {};
     }
     case "Page.screencastFrameAck": {
       const target = getSessionTarget(state, sessionId);
-      if (target.screencastFrames.delete(params.sessionId) && target.screencastPending) void pushScreencastFrame(ctx, state, target);
+      const stream = target.screencasts.get(emit.owner)?.get(sessionId ?? null);
+      if (stream?.frames.delete(params.sessionId) && stream.pending)
+        void pushScreencastFrame(ctx, state, target, stream);
       return {};
     }
     case "Page.stopScreencast": {
       const target = getSessionTarget(state, sessionId);
-      stopScreencast(target);
+      stopScreencast(target, emit.owner, sessionId ?? null);
       return {};
     }
     case "Page.reload": {
@@ -718,7 +742,7 @@ async function dispatch(ctx, state, method, params, sessionId, emit) {
           navigateTarget(state,target,navigation.url,emit,{addHistory:true});
           target.title=navigation.title ?? await getContextTitle(ctx,target);
           target.history[target.historyIndex].title=target.title;
-          if(target.screencast)await pushScreencastFrame(ctx,state,target);
+          if(target.screencasts.size)await pushScreencastFrame(ctx,state,target);
         }
         return {};
       }
@@ -734,7 +758,7 @@ async function dispatch(ctx, state, method, params, sessionId, emit) {
           navigateTarget(state, target, navigation.url, emit, { addHistory: true });
           target.title = navigation.title ?? await getContextTitle(ctx, target);
           target.history[target.historyIndex].title = target.title;
-          if (target.screencast) await pushScreencastFrame(ctx, state, target);
+          if (target.screencasts.size) await pushScreencastFrame(ctx, state, target);
         }
       }
       return {};
@@ -843,8 +867,7 @@ function createTarget(state, url = "about:blank", options = {}) {
       height: options.height ?? 600,
       deviceScaleFactor: 1,
     },
-    screencast: null,
-    screencastFrames: new Set(),
+    screencasts: new Map(),
   };
   state.targets.set(targetId, target);
   state.initialNavigations.set(targetId, {
@@ -888,42 +911,67 @@ function emitLifecycle(target, name) {
 // Bound the amount of image data queued to a slow CDP client. Two outstanding
 // frames keep the pipe moving while acknowledging one; later updates coalesce.
 const MAX_SCREENCAST_FRAMES = 2;
-function stopScreencast(target) {
-  target.screencast = null;
-  target.screencastEmit = null;
-  target.screencastPending = false;
-  target.screencastFrames.clear();
+function* screencasts(target) {
+  for (const sessions of target.screencasts.values()) yield* sessions.values();
+}
+
+// No owner means target destruction. An owner without a session means disconnect.
+function stopScreencast(target, owner, sessionId) {
+  const owners = owner === undefined ? target.screencasts : new Map([[owner, target.screencasts.get(owner)]]);
+  for (const [key, sessions] of owners) {
+    if (!sessions) continue;
+    for (const [id, stream] of sessions) {
+      if (sessionId !== undefined && id !== sessionId) continue;
+      stream.active = false;
+      stream.pending = false;
+      stream.scrollOffset = null;
+      stream.frames.clear();
+      sessions.delete(id);
+    }
+    if (!sessions.size) target.screencasts.delete(key);
+  }
 }
 
-/** One capture at a time, with bounded unacknowledged frames. */
-async function pushScreencastFrame(ctx, state, target) {
-  if (!target.screencast || !target.screencastEmit) return;
-  if (target.screencastBusy || target.screencastFrames.size >= MAX_SCREENCAST_FRAMES) {
-    target.screencastPending = true;
+/** One capture at a time per viewer, with bounded unacknowledged frames. */
+async function pushScreencastFrame(ctx, state, target, stream) {
+  if (!stream) {
+    await Promise.all([...screencasts(target)].map(s => pushScreencastFrame(ctx, state, target, s)));
+    return;
+  }
+  if (!stream.active) return;
+  if (stream.busy || stream.frames.size >= MAX_SCREENCAST_FRAMES) {
+    stream.pending = true;
     return;
   }
-  target.screencastBusy = true;
+  stream.busy = true;
   try {
     do {
-      target.screencastPending = false;
-      await emitScreencastFrame(ctx, state, target);
-    } while (target.screencastPending && target.screencast && target.screencastEmit
-      && target.screencastFrames.size < MAX_SCREENCAST_FRAMES);
+      stream.pending = false;
+      await emitScreencastFrame(ctx, state, target, stream);
+    } while (stream.pending && stream.active && stream.frames.size < MAX_SCREENCAST_FRAMES);
   } catch (error) {
     serverError(`[CdpServer] screencast frame failed: ${error?.message ?? error}`);
   } finally {
-    target.screencastBusy = false;
+    stream.busy = false;
   }
 }
 
-async function emitScreencastFrame(ctx, state, target) {
-  const stream = target.screencast, emit = target.screencastEmit;
-  const data = await screenshotData(ctx, target, stream);
-  if (!data || stream !== target.screencast || emit !== target.screencastEmit) return;
-  const scrollOffset = await ctx.scrollOffset?.() ?? { x: 0, y: 0 };
-  if (stream !== target.screencast || emit !== target.screencastEmit) return;
+async function emitScreencastFrame(ctx, state, target, stream) {
+  const options = stream.params, emit = stream.emit;
+  const loaderId = target.loaderId;
+  // Pending updates replace this snapshot with the latest position.
+  const notifiedOffset = stream.scrollOffset;
+  stream.scrollOffset = null;
+  const zeroArea = options.clip?.width === 0 && options.clip?.height === 0;
+  const data = zeroArea
+    ? "iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mP8/x8AAusB9Wl6SAAAAABJRU5ErkJggg=="
+    : await screenshotData(ctx, target, options);
+  if (!data || !stream.active || loaderId !== target.loaderId) return;
+  const scrollOffset = zeroArea && notifiedOffset ? notifiedOffset
+    : await ctx.scrollOffset?.() ?? { x: 0, y: 0 };
+  if (!stream.active || loaderId !== target.loaderId) return;
   const sessionId = state.nextScreencastFrameId++;
-  target.screencastFrames.add(sessionId);
+  stream.frames.add(sessionId);
   emit("Page.screencastFrame", {
     data,
     metadata: {
@@ -950,6 +998,7 @@ function getPendingInitialNavigationTarget(state) {
 
 function navigateTarget(state, target, url, emit, options = {}) {
   const deferLifecycle = typeof state.context?.onLifecycle === "function";
+  for (const stream of screencasts(target)) stream.scrollOffset = null;
   target.lifecycleEmit = null;
   target.url = url;
   loadDocument(target, url);
@@ -1044,8 +1093,7 @@ function getImplicitTarget(state) {
 
   state.implicitTarget = {
     targetId: "implicit-target",
-    screencast: null,
-    screencastFrames: new Set(),
+    screencasts: new Map(),
     frameId: "implicit-target",
     loaderId: "implicit-loader",
     type: "page",

package/lib/happy-dom/document-base.js

@@ -1,12 +1,40 @@
 import Node from "../../vendor/happy-dom/packages/happy-dom/src/nodes/node/Node.ts";
 import Document from "../../vendor/happy-dom/packages/happy-dom/src/nodes/document/Document.ts";
+import HTMLBaseElement from "../../vendor/happy-dom/packages/happy-dom/src/nodes/html-base-element/HTMLBaseElement.ts";
 import HTMLHyperlinkElementUtility from "../../vendor/happy-dom/packages/happy-dom/src/nodes/html-hyperlink-element/HTMLHyperlinkElementUtility.ts";
+import * as PropertySymbol from "../../vendor/happy-dom/packages/happy-dom/src/PropertySymbol.ts";
+
+// Happy DOM reads baseURI on every attribute set, so the parser looked up
+// `base[href]` once per attribute: a whole-document scan each time when there
+// is no base. The first base[href] of each document is cached until one of
+// that document's <base> elements is connected, disconnected or has an
+// attribute changed. An adopted <base> disconnects from its old document
+// first, so both documents are invalidated.
+const baseCache = new WeakMap();
+{
+  const prototype = HTMLBaseElement.prototype;
+  const inherited = Object.getPrototypeOf(prototype);
+  for (const symbol of [PropertySymbol.connectedToDocument, PropertySymbol.disconnectedFromDocument,
+    PropertySymbol.onSetAttribute, PropertySymbol.onRemoveAttribute]) {
+    prototype[symbol] = function(...args) {
+      baseCache.delete(this[PropertySymbol.ownerDocument]);
+      return inherited[symbol].apply(this, args);
+    };
+  }
+}
+
+function firstBase(document) {
+  if (baseCache.has(document)) return baseCache.get(document);
+  const base = document.querySelector?.("base[href]") ?? null;
+  baseCache.set(document, base);
+  return base;
+}
 
 /** HTML document base URL, shared by the inert DOM and its page bindings. */
 export function documentBaseURL(node) {
   const document = node?.nodeType === 9 ? node : node?.ownerDocument;
   const fallback = document?.URL ?? "about:blank";
-  const base = document?.querySelector?.("base[href]");
+  const base = document ? firstBase(document) : null;
   if (!base) return fallback;
   try {
     const url = new URL(base.getAttribute("href"), fallback);

package/lib/happy-dom/mutation-observer.js

@@ -0,0 +1,157 @@
+import * as PropertySymbol from '../../vendor/happy-dom/packages/happy-dom/src/PropertySymbol.ts';
+
+// One notification microtask for this renderer agent, with one ordered record
+// queue per observer. Target registrations must not schedule their own delivery.
+const enqueueMicrotask = globalThis.queueMicrotask;
+const pending = new Set();
+let queued = false;
+let creationIndex = 0;
+
+function activate(observer) {
+  pending.add(observer);
+  if (queued) return;
+  queued = true;
+  enqueueMicrotask(() => {
+    queued = false;
+    const observers = [...pending].sort((left, right) => left.order - right.order);
+    pending.clear();
+    for (const observer of observers) observer.deliver();
+  });
+}
+
+function optionsOf(window, input = {}) {
+  const attributes = input.attributes === undefined
+    ? input.attributeOldValue !== undefined || input.attributeFilter !== undefined
+    : Boolean(input.attributes);
+  const characterData = input.characterData === undefined
+    ? input.characterDataOldValue !== undefined : Boolean(input.characterData);
+  const options = {
+    childList: Boolean(input.childList), attributes, characterData,
+    subtree: Boolean(input.subtree),
+    attributeOldValue: Boolean(input.attributeOldValue),
+    characterDataOldValue: Boolean(input.characterDataOldValue),
+    attributeFilter: input.attributeFilter === undefined ? null : Array.from(input.attributeFilter, String),
+  };
+  if ((!options.childList && !attributes && !characterData) ||
+      (!attributes && (options.attributeOldValue || options.attributeFilter !== null)) ||
+      (!characterData && options.characterDataOldValue)) {
+    throw new window.TypeError('Invalid MutationObserver options');
+  }
+  return options;
+}
+
+export function installMutationObservers(window) {
+  window.MutationObserver = class MutationObserver {
+    #callback;
+    #registrations = new Map();
+    #records = [];
+    #seen = new WeakMap();
+    #destroyed = false;
+    #delivery;
+
+    constructor(callback) {
+      if (typeof callback !== 'function') throw new window.TypeError('MutationObserver callback must be a function');
+      this.#callback = callback;
+      this.#delivery = { order: creationIndex++, deliver: () => this.#deliver() };
+    }
+
+    observe(target, input) {
+      if (this.#destroyed || window.closed) return;
+      if (!target || typeof target[PropertySymbol.observeMutations] !== 'function') {
+        throw new window.TypeError('MutationObserver.observe requires a Node');
+      }
+      const options = optionsOf(window, input);
+      const previous = this.#registrations.get(target);
+      if (previous) this.#remove(previous);
+      const registration = { target, options, transientRoots: new Set(), callback: null, listener: null };
+      registration.callback = (record) => this.#report(registration, record);
+      registration.listener = {
+        // Removals establish temporary registrations even if childList records
+        // were not requested. These survive until this observer is notified.
+        options: { ...options, childList: options.childList || options.subtree },
+        callback: new WeakRef(registration.callback),
+      };
+      this.#registrations.set(target, registration);
+      target[PropertySymbol.observeMutations](registration.listener);
+      if (!window[PropertySymbol.mutationObservers].includes(this)) {
+        window[PropertySymbol.mutationObservers].push(this);
+      }
+    }
+
+    #clearTransient(registration) {
+      for (const root of registration.transientRoots) {
+        root[PropertySymbol.unobserveMutations](registration.listener);
+      }
+      registration.transientRoots.clear();
+    }
+
+    #remove(registration) {
+      this.#clearTransient(registration);
+      registration.target[PropertySymbol.unobserveMutations](registration.listener);
+    }
+
+    #report(registration, record) {
+      const { options } = registration;
+      if (options.subtree && record.type === 'childList') {
+        for (const root of record.removedNodes) {
+          if (!registration.transientRoots.has(root)) {
+            registration.transientRoots.add(root);
+            root[PropertySymbol.observeMutations](registration.listener);
+          }
+        }
+        if (record.removedNodes.length) activate(this.#delivery);
+      }
+      if (record.type === 'childList' && !options.childList) return;
+      const wantsOld = record.type === 'attributes' ? options.attributeOldValue
+        : record.type === 'characterData' && options.characterDataOldValue;
+      const existing = this.#seen.get(record);
+      if (existing) {
+        if (wantsOld) existing.oldValue = record.oldValue;
+        return;
+      }
+      const copy = Object.assign(Object.create(Object.getPrototypeOf(record)), record, {
+        oldValue: wantsOld ? record.oldValue : null,
+      });
+      this.#seen.set(record, copy);
+      this.#records.push(copy);
+      activate(this.#delivery);
+    }
+
+    #deliver() {
+      const records = this.takeRecords();
+      for (const registration of this.#registrations.values()) this.#clearTransient(registration);
+      if (!records.length || this.#destroyed || window.closed) return;
+      try {
+        this.#callback.call(this, records, this);
+      } catch (error) {
+        window[PropertySymbol.dispatchError](error);
+      }
+    }
+
+    takeRecords() {
+      const records = this.#records;
+      this.#records = [];
+      this.#seen = new WeakMap();
+      return records;
+    }
+
+    disconnect() {
+      for (const registration of this.#registrations.values()) this.#remove(registration);
+      this.#registrations.clear();
+      this.takeRecords();
+      // Window destruction iterates this array. Do not splice it during that
+      // iteration, otherwise the next observer would survive teardown.
+      if (!window.closed) {
+        const observers = window[PropertySymbol.mutationObservers];
+        const index = observers.indexOf(this);
+        if (index >= 0) observers.splice(index, 1);
+      }
+    }
+
+    [PropertySymbol.destroy]() {
+      this.#destroyed = true;
+      this.disconnect();
+      pending.delete(this.#delivery);
+    }
+  };
+}

package/lib/happy-dom/parser.js

@@ -1,4 +1,5 @@
 import { makeLinksInert } from './inert-link.js';
+import { installMutationObservers } from './mutation-observer.js';
 import HTMLParser from "../../vendor/happy-dom/packages/happy-dom/src/html-parser/HTMLParser.ts";
 import Window from "../../vendor/happy-dom/packages/happy-dom/src/window/Window.ts";
 import * as PropertySymbol from "../../vendor/happy-dom/packages/happy-dom/src/PropertySymbol.ts";
@@ -41,6 +42,7 @@ export function createInertWindow(url = "about:blank") {
       navigation: { disableFallbackToSetURL: true },
     },
   });
+  installMutationObservers(window);
   makeLinksInert(window);
   return window;
 }