@miaskiewicz/turbo-dom 0.1.2

package/src/runtime/stubs.mjs

@@ -0,0 +1,148 @@
+// Layer 4 — aggressively but HONESTLY stub the unobservable. Headless runners
+// have no layout, so we don't pretend. Honest absence over a plausible lie.
+
+// FileReader — resolves async with a result, enough for upload-handling tests.
+export class FileReader {
+  constructor() { this.result = null; this.error = null; this.readyState = 0; this.onload = null; this.onloadend = null; this.onerror = null; this.__listeners = new Map(); }
+  addEventListener(t, cb) { (this.__listeners.get(t) || this.__listeners.set(t, []).get(t)).push(cb); }
+  removeEventListener(t, cb) { const l = this.__listeners.get(t); if (l) this.__listeners.set(t, l.filter((x) => x !== cb)); }
+  __fire(type) {
+    const ev = { type, target: this };
+    if (typeof this['on' + type] === 'function') this['on' + type](ev);
+    for (const cb of this.__listeners.get(type) || []) cb(ev);
+  }
+  __read(blob, makeResult) {
+    this.readyState = 1;
+    Promise.resolve().then(async () => {
+      try { this.result = await makeResult(blob); } catch (e) { this.error = e; this.readyState = 2; this.__fire('error'); this.__fire('loadend'); return; }
+      this.readyState = 2; this.__fire('load'); this.__fire('loadend');
+    });
+  }
+  readAsText(blob) { this.__read(blob, (b) => (b && b.text ? b.text() : String(b))); }
+  readAsDataURL(blob) { this.__read(blob, async (b) => { const buf = Buffer.from(b && b.arrayBuffer ? await b.arrayBuffer() : []); return `data:${(b && b.type) || ''};base64,${buf.toString('base64')}`; }); }
+  readAsArrayBuffer(blob) { this.__read(blob, (b) => (b && b.arrayBuffer ? b.arrayBuffer() : new ArrayBuffer(0))); }
+  abort() { this.readyState = 2; this.__fire('abort'); }
+}
+
+// Canvas 2D context — no raster backend; methods are no-ops, measureText returns 0.
+export function makeCanvasStub() {
+  const noop = () => {};
+  return new Proxy({}, {
+    get(_t, k) {
+      if (k === 'measureText') return (s) => ({ width: String(s).length * 6 });
+      if (k === 'getImageData') return () => ({ data: new Uint8ClampedArray(0), width: 0, height: 0 });
+      if (k === 'createLinearGradient' || k === 'createRadialGradient' || k === 'createPattern') return () => ({ addColorStop: noop });
+      if (k === 'canvas') return null;
+      return noop;
+    },
+  });
+}
+
+// CustomElementRegistry — define/get/whenDefined. No upgrade of generic elements,
+// but enough that defining and awaiting elements doesn't throw.
+export function makeCustomElements() {
+  const defs = new Map();
+  const waiters = new Map();
+  return {
+    define(name, ctor) {
+      if (defs.has(name)) throw new Error(`'${name}' already defined`);
+      defs.set(name, ctor);
+      const w = waiters.get(name); if (w) { w.forEach((r) => r(ctor)); waiters.delete(name); }
+    },
+    get(name) { return defs.get(name); },
+    getName(ctor) { for (const [n, c] of defs) if (c === ctor) return n; return null; },
+    whenDefined(name) { if (defs.has(name)) return Promise.resolve(defs.get(name)); return new Promise((res) => { const a = waiters.get(name) || []; a.push(res); waiters.set(name, a); }); },
+    upgrade() {},
+  };
+}
+
+export class Storage {
+  constructor() { this.__map = new Map(); }
+  get length() { return this.__map.size; }
+  key(i) { return [...this.__map.keys()][i] ?? null; }
+  getItem(k) { return this.__map.has(String(k)) ? this.__map.get(String(k)) : null; }
+  setItem(k, v) { this.__map.set(String(k), String(v)); }
+  removeItem(k) { this.__map.delete(String(k)); }
+  clear() { this.__map.clear(); }
+}
+
+export function makeMatchMedia() {
+  return (query) => ({
+    matches: false,                 // honest: no real media context in a headless runner
+    media: query,
+    onchange: null,
+    addEventListener() {},
+    removeEventListener() {},
+    addListener() {},               // deprecated, kept for compatibility
+    removeListener() {},
+    dispatchEvent() { return false; },
+  });
+}
+
+// getComputedStyle: honest — reflects ONLY inline + explicitly-set values, never
+// invents cascade/layout numbers. A property that wasn't set reads as ''.
+export function makeGetComputedStyle() {
+  return (el) => {
+    const style = el && el.style ? el.style : null;
+    return new Proxy({}, {
+      get(_t, key) {
+        if (key === 'getPropertyValue') return (p) => (style ? style.getPropertyValue(p) : '');
+        if (key === '__honest') return 'computed style is inline-only; no layout/cascade available';
+        if (typeof key !== 'string') return undefined;
+        return style ? style[key] : '';
+      },
+    });
+  };
+}
+
+class ObserverStub {
+  constructor(cb) { this.__cb = cb; }
+  observe() {}
+  unobserve() {}
+  disconnect() {}
+  takeRecords() { return []; }
+}
+export class IntersectionObserver extends ObserverStub {
+  constructor(cb) { super(cb); this.root = null; this.rootMargin = '0px'; this.thresholds = [0]; }
+}
+export class ResizeObserver extends ObserverStub {}
+
+// MutationObserver: real enough to be useful — fires on observed mutations would
+// require hooking every mutation; v1 is an honest queue-based stub that records
+// nothing automatically. Documented as opt-in faithful later.
+export class MutationObserver {
+  constructor(cb) { this.__cb = cb; this.__records = []; }
+  observe() {}
+  disconnect() {}
+  takeRecords() { const r = this.__records; this.__records = []; return r; }
+}
+
+export function makeLocation(href = 'http://localhost/') {
+  const u = new URL(href);
+  return {
+    get href() { return u.href; }, set href(v) { /* navigation is a no-op in headless */ },
+    get protocol() { return u.protocol; },
+    get host() { return u.host; },
+    get hostname() { return u.hostname; },
+    get port() { return u.port; },
+    get pathname() { return u.pathname; },
+    get search() { return u.search; },
+    get hash() { return u.hash; },
+    get origin() { return u.origin; },
+    assign() {}, replace() {}, reload() {}, toString() { return u.href; },
+  };
+}
+
+export function makeHistory(location) {
+  const stack = [{ state: null, url: location.href }];
+  let idx = 0;
+  return {
+    get length() { return stack.length; },
+    get state() { return stack[idx].state; },
+    pushState(state, _title, url) { stack.splice(idx + 1); stack.push({ state, url }); idx++; },
+    replaceState(state, _title, url) { stack[idx] = { state, url: url ?? stack[idx].url }; },
+    back() { if (idx > 0) idx--; },
+    forward() { if (idx < stack.length - 1) idx++; },
+    go(n) { idx = Math.max(0, Math.min(stack.length - 1, idx + (n || 0))); },
+  };
+}

package/src/runtime/window.mjs

@@ -0,0 +1,168 @@
+// Layer 3 — lazy `window`. A Proxy whose globals are factories that materialize
+// on first `get` and self-replace with the concrete value (one-time Proxy cost
+// per property). A test using only `document.querySelector` never constructs
+// localStorage, IntersectionObserver, matchMedia, etc. The Proxy doubles as a
+// tracer: it records which globals each test actually touches.
+
+import {
+  Storage, makeMatchMedia, makeGetComputedStyle,
+  IntersectionObserver, ResizeObserver,
+  FileReader, makeCanvasStub, makeCustomElements,
+  makeLocation, makeHistory,
+} from './stubs.mjs';
+import {
+  Node, Element, Text, Comment, Document, DocumentFragment, DocumentType, Event, CustomEvent,
+  MutationObserver,
+} from './dom.mjs';
+import {
+  EventTarget,
+  UIEvent, MouseEvent, PointerEvent, KeyboardEvent, InputEvent, FocusEvent,
+  CompositionEvent, WheelEvent, TouchEvent, DragEvent, ProgressEvent,
+} from './events.mjs';
+
+// Minimal DataTransfer / clipboard primitives some libraries (user-event) need.
+class DataTransfer {
+  constructor() { this.__data = new Map(); this.dropEffect = 'none'; this.effectAllowed = 'all'; this.items = []; this.files = []; this.types = []; }
+  setData(fmt, data) { this.__data.set(fmt, String(data)); if (!this.types.includes(fmt)) this.types.push(fmt); }
+  getData(fmt) { return this.__data.get(fmt) ?? ''; }
+  clearData(fmt) { if (fmt) this.__data.delete(fmt); else this.__data.clear(); }
+}
+class ClipboardEvent extends Event {
+  constructor(type, init = {}) { super(type, init); this.clipboardData = init.clipboardData ?? new DataTransfer(); }
+}
+
+// Capture host functions at module load — BEFORE any installGlobals() can shadow
+// the bare names on globalThis (which would make these delegates call themselves).
+const hostSetTimeout = globalThis.setTimeout;
+const hostClearTimeout = globalThis.clearTimeout;
+const hostSetInterval = globalThis.setInterval;
+const hostClearInterval = globalThis.clearInterval;
+const hostQueueMicrotask = globalThis.queueMicrotask;
+const hostStructuredClone = globalThis.structuredClone;
+
+export function createWindow(document, { url = 'http://localhost/' } = {}) {
+  const touched = new Set();
+  let windowProxy;
+
+  // Universal globals (touched by ~every test) — eager, no point lazifying.
+  const base = {
+    document,
+    name: '',
+    closed: false,
+    origin: new URL(url).origin,
+    // constructors are cheap class refs — expose eagerly
+    Node, Element, Text, Comment, Document, DocumentFragment, DocumentType,
+    EventTarget,
+    Event, CustomEvent,
+    UIEvent, MouseEvent, PointerEvent, KeyboardEvent, InputEvent, FocusEvent,
+    CompositionEvent, WheelEvent, TouchEvent, DragEvent, ProgressEvent, ClipboardEvent,
+    DataTransfer,
+    // generic elements are plain Element → `el instanceof HTMLElement` is true.
+    // HTMLIFrameElement MUST be a distinct class so React's iframe-descent loop
+    // (`while (el instanceof HTMLIFrameElement)`) terminates on normal elements.
+    HTMLElement: Element, SVGElement: Element,
+    HTMLIFrameElement: class HTMLIFrameElement extends Element {},
+    HTMLInputElement: Element, HTMLTextAreaElement: Element, HTMLSelectElement: Element,
+    HTMLOptionElement: Element, HTMLButtonElement: Element, HTMLAnchorElement: Element,
+    HTMLFormElement: Element, HTMLImageElement: Element, HTMLCanvasElement: Element,
+    HTMLTemplateElement: Element, HTMLLabelElement: Element, HTMLDivElement: Element,
+    HTMLSpanElement: Element, HTMLParagraphElement: Element, HTMLUListElement: Element,
+    HTMLLIElement: Element, HTMLHeadingElement: Element, HTMLBodyElement: Element,
+    HTMLDocument: Document, DocumentFragment, ShadowRoot: DocumentFragment,
+    MutationObserver,
+    URL: makeURL(), URLSearchParams,
+    Blob: globalThis.Blob, File: makeFile(), FileReader,
+    customElements: makeCustomElements(),
+    AbortController: globalThis.AbortController, AbortSignal: globalThis.AbortSignal,
+    TextEncoder: globalThis.TextEncoder, TextDecoder: globalThis.TextDecoder,
+    // timers delegate to the captured host fns (NOT the bare names — once these
+    // are installed on globalThis the bare names resolve back here → recursion)
+    setTimeout: (...a) => hostSetTimeout(...a),
+    clearTimeout: (...a) => hostClearTimeout(...a),
+    setInterval: (...a) => hostSetInterval(...a),
+    clearInterval: (...a) => hostClearInterval(...a),
+    queueMicrotask: (...a) => hostQueueMicrotask(...a),
+    structuredClone: (...a) => hostStructuredClone(...a),
+    getSelection: () => document.getSelection(),
+    scrollTo() {}, scroll() {}, scrollBy() {},
+    alert() {}, confirm: () => false, prompt: () => null,
+    dispatchEvent: (e) => document.dispatchEvent(e),
+    addEventListener: (...a) => document.addEventListener(...a),
+    removeEventListener: (...a) => document.removeEventListener(...a),
+  };
+
+  // Lazy globals — none constructed until touched.
+  const lazy = {
+    localStorage: () => new Storage(),
+    sessionStorage: () => new Storage(),
+    matchMedia: () => makeMatchMedia(),
+    getComputedStyle: () => makeGetComputedStyle(),
+    IntersectionObserver: () => IntersectionObserver,
+    ResizeObserver: () => ResizeObserver,
+    requestAnimationFrame: () => (cb) => hostSetTimeout(() => cb(performanceNow()), 0),
+    cancelAnimationFrame: () => (id) => hostClearTimeout(id),
+    // subsystem grouping: history co-materializes with (and shares) location
+    location: () => makeLocation(url),
+    history: () => makeHistory(windowProxy.location),
+    navigator: () => ({ userAgent: 'turbo-dom/0.0.1', platform: 'turbo-dom', language: 'en-US', languages: ['en-US'], onLine: true }),
+    performance: () => ({ now: performanceNow, timeOrigin: 0, mark() {}, measure() {} }),
+    Storage: () => Storage,
+    devicePixelRatio: () => 1,
+    innerWidth: () => 1024,
+    innerHeight: () => 768,
+  };
+
+  windowProxy = new Proxy(base, {
+    get(t, k) {
+      if (k === 'window' || k === 'self' || k === 'globalThis' || k === 'parent' || k === 'top') return windowProxy;
+      if (k in t) return t[k];
+      const factory = lazy[k];
+      if (factory) {
+        touched.add(k);
+        const v = factory();
+        t[k] = v;                 // self-replace: subsequent reads skip the factory
+        return v;
+      }
+      return undefined;
+    },
+    set(t, k, v) { t[k] = v; return true; },
+    has(t, k) {
+      return k in t || k in lazy ||
+        k === 'window' || k === 'self' || k === 'globalThis' || k === 'parent' || k === 'top';
+    },
+  });
+
+  document.defaultView = windowProxy;
+
+  return {
+    window: windowProxy,
+    // which lazy globals this test materialized (the "DOM surface used" report)
+    touched: () => [...touched],
+    // every global name this window can provide (for environment adapters)
+    globalKeys: [...Object.keys(base), ...Object.keys(lazy)],
+    // Layer 5: drop materialized global slots, keep the class machinery warm.
+    resetGlobals() {
+      for (const k of touched) delete base[k];
+      touched.clear();
+    },
+  };
+}
+
+function performanceNow() {
+  const [s, ns] = process.hrtime();
+  return s * 1000 + ns / 1e6;
+}
+
+let __objUrlSeq = 0;
+function makeURL() {
+  class TurboURL extends URL {}
+  TurboURL.createObjectURL = () => `blob:turbo-dom/${++__objUrlSeq}`;
+  TurboURL.revokeObjectURL = () => {};
+  return TurboURL;
+}
+function makeFile() {
+  const B = globalThis.Blob;
+  return class File extends B {
+    constructor(bits = [], name = 'file', opts = {}) { super(bits, opts); this.name = String(name); this.lastModified = opts.lastModified || 0; }
+  };
+}