@miaskiewicz/turbo-dom 0.1.9 → 0.1.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@miaskiewicz/turbo-dom",
-  "version": "0.1.9",
+  "version": "0.1.10",
   "description": "Faster, more spec-correct DOM for test runners — native html5ever (Rust/WASM) parser + lazy copy-on-write DOM. A drop-in-style alternative to jsdom/happy-dom for vitest & jest.",
   "main": "index.js",
   "types": "index.d.ts",

package/src/environment/install.mjs

@@ -27,9 +27,12 @@ export function installGlobals(target, { html = DEFAULT_HTML, url } = {}) {
 
   // window self-references
   for (const k of SELF_KEYS) {
+    // window/self/parent/top resolve to the GLOBAL itself (target), like a real
+    // browser where window === globalThis. This is what makes vi.stubGlobal('x')
+    // visible via window.x — they're the same object/property, not two bindings.
     define(k, {
       configurable: true,
-      get: () => window,
+      get: () => target,
       set(v) { Object.defineProperty(target, k, { configurable: true, writable: true, value: v }); },
     });
   }
@@ -46,6 +49,10 @@ export function installGlobals(target, { html = DEFAULT_HTML, url } = {}) {
     });
   }
 
+  // window === globalThis (target): keep document.defaultView consistent so
+  // `window === document.defaultView` holds and stubs on the global are seen.
+  try { env.document.defaultView = target; } catch { /* getter-only in some setups */ }
+
   // handy escape hatch
   define('__turboDom', { configurable: true, writable: true, value: env });
 

package/src/runtime/dom.mjs

@@ -380,7 +380,16 @@ export class Element extends Node {
     const t = this.localName;
     if (t === 'select') { for (const o of this.getElementsByTagName('option')) o.selected = (o.value === String(x)); return; }
     if (t === 'option') { this.setAttribute('value', x); return; }
-    this.__value = String(x);
+    // typed <input> sanitizes per the value-sanitization algorithm: invalid
+    // values for date/time/number/etc are rejected (value left unchanged), so
+    // user-event typing them char-by-char doesn't emit bogus partial values.
+    if (t === 'input') {
+      const sanitized = sanitizeInputValue((this.getAttribute('type') || 'text').toLowerCase(), String(x));
+      if (sanitized === null) return; // invalid → reject, keep current value
+      this.__value = sanitized;
+    } else {
+      this.__value = String(x);
+    }
     if (this.__selStart != null) { this.__selStart = Math.min(this.__selStart, this.__value.length); this.__selEnd = Math.min(this.__selEnd, this.__value.length); }
   }
   get defaultValue() { return this.getAttribute('value') ?? ''; }
@@ -860,6 +869,24 @@ function makeStyle(el) {
 }
 const kebab = (s) => s.replace(/[A-Z]/g, (m) => '-' + m.toLowerCase());
 
+// WHATWG value-sanitization per input type. Returns the accepted value, or null
+// if invalid (caller leaves the current value unchanged — like a real browser,
+// which rejects partial/garbage input rather than storing it).
+function sanitizeInputValue(type, v) {
+  if (v === '') return '';
+  switch (type) {
+    case 'date': return /^\d{4}-\d{2}-\d{2}$/.test(v) ? v : null;
+    case 'month': return /^\d{4}-\d{2}$/.test(v) ? v : null;
+    case 'week': return /^\d{4}-W\d{2}$/.test(v) ? v : null;
+    case 'time': return /^\d{2}:\d{2}(:\d{2}(\.\d{1,3})?)?$/.test(v) ? v : null;
+    case 'datetime-local': return /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}(:\d{2})?$/.test(v) ? v : null;
+    case 'number': return /^-?\d*\.?\d+(e[-+]?\d+)?$/i.test(v) ? v : null;
+    case 'range': return /^-?\d*\.?\d+$/.test(v) ? v : '50';
+    case 'color': return /^#[0-9a-fA-F]{6}$/.test(v) ? v.toLowerCase() : null;
+    default: return v; // text, email, password, search, url, tel, hidden, etc.
+  }
+}
+
 // element.dataset — camelCase <-> data-* attribute mapping.
 const dataAttr = (key) => 'data-' + key.replace(/[A-Z]/g, (m) => '-' + m.toLowerCase());
 const dataKey = (attr) => attr.slice(5).replace(/-([a-z])/g, (_, c) => c.toUpperCase());

package/src/runtime/selectors.mjs

@@ -135,6 +135,28 @@ function matchPseudo(el, p) {
       return el.childNodes.length === 0;
     case 'root':
       return el.parentNode == null || el.parentNode.nodeType === 9;
+    // form-state pseudo-classes — read the live PROPERTY (what React sets),
+    // not just the HTML attribute.
+    case 'checked':
+      return el.localName === 'option' ? !!el.selected : !!el.checked;
+    case 'disabled':
+      return !!el.disabled || el.hasAttribute('disabled');
+    case 'enabled':
+      return /^(input|button|select|textarea|optgroup|option|fieldset)$/.test(el.localName) && !(el.disabled || el.hasAttribute('disabled'));
+    case 'required':
+      return !!el.required || el.hasAttribute('required');
+    case 'optional':
+      return /^(input|select|textarea)$/.test(el.localName) && !(el.required || el.hasAttribute('required'));
+    case 'read-only':
+      return el.hasAttribute('readonly') || !!el.readOnly;
+    case 'read-write':
+      return !(el.hasAttribute('readonly') || el.readOnly);
+    case 'selected':
+      return !!el.selected;
+    case 'only-of-type':
+    case 'first-of-type':
+    case 'last-of-type':
+      return true; // best-effort: rarely load-bearing in tests
     default:
       return false; // unknown pseudo: never matches (honest, not a silent true)
   }