Sprint 9: API Completeness — Webpack Chunks, allowedGlobals Sync, HTML Error Handling #60

New issue

Closed

opened 2026-06-18 13:11:37 +00:00 by Artur · 0 comments

Artur commented

2026-06-18 13:11:37 +00:00

Owner

Sprint 9: API Completeness

Issue: #59
Epic: Phase 2 Production Engine
Aufwand: ~6h

Problem

Webpack-Sites (x.com, Discord, YouTube) bootstrappen nicht weil Chunks im tolerantProxy landen. HTML als JS verursacht 450+ SyntaxErrors. fetch("/relative") scheitert bei Qwik. Mehrere Browser-APIs fehlen noch.

Tasks

1. Webpack Chunk Capture — Der tolerantProxy frisst window.webpackChunk_twitter_responsive_web.push(...):

Production-Proxy erkennt webpackChunk_* Patterns
Proxy fängt [name].push(chunk) ab, speichert in realem Array
DynamicScriptHandler übernimmt und executed via UEL
__webpack_require__ Shim für Modul-Lookup

2. HTML-as-JS Error Handling — 450+ SyntaxErrors durch Error-Seiten:

fetchContent() prüft Content-Type Header (wenn vorhanden)
Sonst: ersten Byte checken: < → onerror (kein new Function())
Spec-konform: <script src="404.html"> feuert onerror

3. Relative URL Resolution in fetch — fetch("/assets/data.json"):

_resolveUrl(url, document.baseURI) auf instrumentierte fetch anwenden
Basis-URL aus window.location.href oder <base> Tag

4. Fehlende Browser-APIs:

window.caches — noop CacheStorage (open/match/delete/keys)
Element.prototype.animate() — Fake Animation (sofort finished)
HTMLDialogElement, HTMLDetailsElement, HTMLTemplateElement, ShadowRoot aus Happy DOM

5. allowedGlobals systematischer Sync:

function syncFromHappyDOM(happyWindow: Window): void {
  for (const key of Object.getOwnPropertyNames(Object.getPrototypeOf(happyWindow))) {
    const val = happyWindow[key];
    if (typeof val === "function" && !(key in allowedGlobals)) {
      if (key.startsWith("HTML") || key.startsWith("SVG") || 
          key.includes("Observer") || key === "ShadowRoot") {
        allowedGlobals[key] = val;
      }
    }
  }
}

Betroffene Dateien

Datei	Änderung
`src/js/dynamic-scripts.ts`	Webpack Chunk Capture
`src/runtime-isolation.ts`	allowedGlobals Sync
`src/js/script-loader.ts`	HTML-as-JS Erkennung
`src/network/fetch.ts`	Relative URL Resolution
`src/fakes/maps-apis.ts`	caches API, Web Animations

Akzeptanzkriterien

webpackChunk_* wird in realem Array gespeichert, Chunks executed
__webpack_require__ existiert und lädt Module
HTML als JS → onerror (kein SyntaxError mehr)
window.caches.open() → Promise
element.animate() → Animation (sofort finished)
fetch("/relative") → resolved gegen location.href
Keine Unexpected token '<' Errors mehr im Log
Bestehende Tests: 0 Regressionen

## Sprint 9: API Completeness **Issue:** #59 **Epic:** Phase 2 Production Engine **Aufwand:** ~6h ### Problem Webpack-Sites (x.com, Discord, YouTube) bootstrappen nicht weil Chunks im tolerantProxy landen. HTML als JS verursacht 450+ SyntaxErrors. `fetch("/relative")` scheitert bei Qwik. Mehrere Browser-APIs fehlen noch. ### Tasks **1. Webpack Chunk Capture** — Der tolerantProxy frisst `window.webpackChunk_twitter_responsive_web.push(...)`: - Production-Proxy erkennt `webpackChunk_*` Patterns - Proxy fängt `[name].push(chunk)` ab, speichert in realem Array - DynamicScriptHandler übernimmt und executed via UEL - `__webpack_require__` Shim für Modul-Lookup **2. HTML-as-JS Error Handling** — 450+ SyntaxErrors durch Error-Seiten: - `fetchContent()` prüft Content-Type Header (wenn vorhanden) - Sonst: ersten Byte checken: `<` → onerror (kein `new Function()`) - Spec-konform: `<script src="404.html">` feuert `onerror` **3. Relative URL Resolution in fetch** — `fetch("/assets/data.json")`: - `_resolveUrl(url, document.baseURI)` auf instrumentierte fetch anwenden - Basis-URL aus `window.location.href` oder `<base>` Tag **4. Fehlende Browser-APIs:** - `window.caches` — noop CacheStorage (open/match/delete/keys) - `Element.prototype.animate()` — Fake Animation (sofort finished) - `HTMLDialogElement`, `HTMLDetailsElement`, `HTMLTemplateElement`, `ShadowRoot` aus Happy DOM **5. allowedGlobals systematischer Sync:** ```typescript function syncFromHappyDOM(happyWindow: Window): void { for (const key of Object.getOwnPropertyNames(Object.getPrototypeOf(happyWindow))) { const val = happyWindow[key]; if (typeof val === "function" && !(key in allowedGlobals)) { if (key.startsWith("HTML") || key.startsWith("SVG") || key.includes("Observer") || key === "ShadowRoot") { allowedGlobals[key] = val; } } } } ``` ### Betroffene Dateien | Datei | Änderung | |-------|----------| | `src/js/dynamic-scripts.ts` | Webpack Chunk Capture | | `src/runtime-isolation.ts` | allowedGlobals Sync | | `src/js/script-loader.ts` | HTML-as-JS Erkennung | | `src/network/fetch.ts` | Relative URL Resolution | | `src/fakes/maps-apis.ts` | caches API, Web Animations | ### Akzeptanzkriterien - [ ] `webpackChunk_*` wird in realem Array gespeichert, Chunks executed - [ ] `__webpack_require__` existiert und lädt Module - [ ] HTML als JS → onerror (kein SyntaxError mehr) - [ ] `window.caches.open()` → Promise<undefined> - [ ] `element.animate()` → Animation (sofort finished) - [ ] `fetch("/relative")` → resolved gegen `location.href` - [ ] Keine `Unexpected token '<'` Errors mehr im Log - [ ] Bestehende Tests: 0 Regressionen

Artur added the

feature

label

2026-06-18 13:11:37 +00:00