@pyreon/runtime-dom 0.11.2 → 0.11.4

package/lib/types/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index2.d.ts","names":[],"sources":["../../../src/delegate.ts","../../../src/devtools.ts","../../../src/hydrate.ts","../../../src/hydration-debug.ts","../../../src/keep-alive.ts","../../../src/mount.ts","../../../src/props.ts","../../../src/template.ts","../../../src/transition.ts","../../../src/transition-group.ts","../../../src/index.ts"],"mappings":"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"}
+{"version":3,"file":"index2.d.ts","names":[],"sources":["../../../src/delegate.ts","../../../src/devtools.ts","../../../src/hydrate.ts","../../../src/hydration-debug.ts","../../../src/keep-alive.ts","../../../src/mount.ts","../../../src/props.ts","../../../src/template.ts","../../../src/transition.ts","../../../src/transition-group.ts","../../../src/index.ts"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pyreon/runtime-dom",
-  "version": "0.11.2",
+  "version": "0.11.4",
   "description": "DOM renderer for Pyreon",
   "license": "MIT",
   "repository": {
@@ -39,8 +39,8 @@
     "prepublishOnly": "bun run build"
   },
   "dependencies": {
-    "@pyreon/core": "^0.11.2",
-    "@pyreon/reactivity": "^0.11.2"
+    "@pyreon/core": "^0.11.4",
+    "@pyreon/reactivity": "^0.11.4"
   },
   "devDependencies": {
     "@happy-dom/global-registrator": "^20.8.3",

package/src/delegate.ts

@@ -68,8 +68,8 @@ export function setupDelegation(container: Element): void {
     container.addEventListener(eventName, (e: Event) => {
       let el = e.target as (HTMLElement & Record<string, unknown>) | null
       while (el && el !== container) {
-        const handler = el[prop] as EventListener | undefined
-        if (handler) {
+        const handler = el[prop]
+        if (typeof handler === "function") {
           batch(() => handler(e))
           // Don't break — allow ancestor handlers too (consistent with addEventListener)
           // But if stopPropagation was called, stop walking

package/src/hydrate.ts

@@ -150,7 +150,7 @@ function hydrateVNode(
   path: string,
 ): [Cleanup, ChildNode | null] {
   if (vnode.type === Fragment) {
-    return hydrateChildren(vnode.children, domNode, parent, anchor, path)
+    return hydrateChildren(vnode.children ?? [], domNode, parent, anchor, path)
   }
 
   if (vnode.type === ForSymbol) {
@@ -241,7 +241,7 @@ function hydrateElement(
 
     // Hydrate children
     const firstChild = firstReal(el.firstChild as ChildNode | null)
-    const [childCleanup] = hydrateChildren(vnode.children, firstChild, el, null, elPath)
+    const [childCleanup] = hydrateChildren(vnode.children ?? [], firstChild, el, null, elPath)
     cleanups.push(childCleanup)
 
     // Set ref
@@ -320,10 +320,14 @@ function hydrateComponent(
   // Function.name is always a string per spec; || handles empty string, avoids uncoverable ?? branch
   const componentName = ((vnode.type as ComponentFn).name || "Anonymous") as string
   const mergedProps =
-    vnode.children.length > 0 && (vnode.props as Record<string, unknown>).children === undefined
+    (vnode.children ?? []).length > 0 &&
+    (vnode.props as Record<string, unknown>).children === undefined
       ? {
           ...vnode.props,
-          children: vnode.children.length === 1 ? vnode.children[0] : vnode.children,
+          children:
+            (vnode.children ?? []).length === 1
+              ? (vnode.children ?? [])[0]
+              : (vnode.children ?? []),
         }
       : vnode.props
 

package/src/keep-alive.ts

@@ -44,7 +44,8 @@ export function KeepAlive(props: KeepAliveProps): VNodeChild {
   let childMounted = false
 
   onMount(() => {
-    const container = containerRef.current as HTMLElement
+    const container = containerRef.current
+    if (!container) return
 
     const e = effect(() => {
       const isActive = props.active?.() ?? true

package/src/mount.ts

@@ -118,7 +118,7 @@ export function mountChild(
   // VNode — element, component, fragment, For, Portal
   const vnode = child as VNode
 
-  if (vnode.type === Fragment) return mountChildren(vnode.children, parent, anchor)
+  if (vnode.type === Fragment) return mountChildren(vnode.children ?? [], parent, anchor)
 
   if (vnode.type === (ForSymbol as unknown as string)) {
     const { each, by, children } = vnode.props as unknown as ForProps<unknown>
@@ -183,7 +183,7 @@ const VOID_ELEMENTS = new Set([
 function mountElement(vnode: VNode, parent: Node, anchor: Node | null): Cleanup {
   const el = document.createElement(vnode.type as string)
 
-  if (__DEV__ && vnode.children.length > 0 && VOID_ELEMENTS.has(vnode.type as string)) {
+  if (__DEV__ && (vnode.children?.length ?? 0) > 0 && VOID_ELEMENTS.has(vnode.type as string)) {
     console.warn(
       `[Pyreon] <${vnode.type as string}> is a void element and cannot have children. ` +
         "Children passed to void elements will be ignored by the browser.",
@@ -196,7 +196,7 @@ function mountElement(vnode: VNode, parent: Node, anchor: Node | null): Cleanup
 
   // Mount children inside element context — nested elements can skip DOM removal closures
   _elementDepth++
-  const childCleanup = mountChildren(vnode.children, el, null)
+  const childCleanup = mountChildren(vnode.children ?? [], el, null)
   _elementDepth--
 
   parent.insertBefore(el, anchor)
@@ -259,11 +259,12 @@ function mountComponent(
   _mountingStack.push(compId)
 
   // Merge vnode.children into props.children if not already set
+  const children = vnode.children ?? []
   const mergedProps =
-    vnode.children.length > 0 && (vnode.props as Record<string, unknown>).children === undefined
+    children.length > 0 && (vnode.props as Record<string, unknown>).children === undefined
       ? {
           ...vnode.props,
-          children: vnode.children.length === 1 ? vnode.children[0] : vnode.children,
+          children: children.length === 1 ? children[0] : children,
         }
       : vnode.props
 

package/src/props.ts

@@ -203,11 +203,13 @@ export function applyProps(el: Element, props: Props): Cleanup | null {
  * Bind an event handler (onClick → "click") with batching + delegation support.
  */
 function applyEventProp(el: Element, key: string, value: unknown): Cleanup | null {
-  if (__DEV__ && typeof value !== "function") {
-    console.warn(
-      `[Pyreon] Event handler "${key}" received a non-function value (${typeof value}). ` +
-        `Expected a function. Did you mean ${key}={() => ...}?`,
-    )
+  if (typeof value !== "function") {
+    if (__DEV__) {
+      console.warn(
+        `[Pyreon] Event handler "${key}" received a non-function value (${typeof value}). ` +
+          `Expected a function. Did you mean ${key}={() => ...}?`,
+      )
+    }
     return null
   }
   const eventName = key[2]?.toLowerCase() + key.slice(3)

package/src/tests/props.test.ts

@@ -0,0 +1,463 @@
+import { signal } from "@pyreon/reactivity"
+import { DELEGATED_EVENTS, delegatedPropName, setupDelegation } from "../delegate"
+import { applyProp, applyProps, sanitizeHtml, setSanitizer } from "../props"
+
+// ─── applyProps ──────────────────────────────────────────────────────────────
+
+describe("applyProps", () => {
+  test("skips key, ref, and children props", () => {
+    const el = document.createElement("div")
+    const cleanup = applyProps(el, {
+      key: "k1",
+      ref: { current: null },
+      children: "text",
+      id: "test",
+    })
+    expect(el.getAttribute("id")).toBe("test")
+    // key, ref, children should not appear as attributes
+    expect(el.hasAttribute("key")).toBe(false)
+    expect(el.hasAttribute("ref")).toBe(false)
+    expect(el.hasAttribute("children")).toBe(false)
+    cleanup?.()
+  })
+
+  test("returns null when no props produce cleanup", () => {
+    const el = document.createElement("div")
+    const cleanup = applyProps(el, { id: "static", title: "hello" })
+    expect(cleanup).toBeNull()
+  })
+
+  test("returns single cleanup when one prop needs it", () => {
+    const el = document.createElement("div")
+    const cleanup = applyProps(el, { onClick: () => {} })
+    expect(cleanup).not.toBeNull()
+    expect(typeof cleanup).toBe("function")
+    cleanup?.()
+  })
+
+  test("returns chained cleanup when multiple props need cleanup", () => {
+    const el = document.createElement("div")
+    const s1 = signal("a")
+    const s2 = signal("b")
+    const cleanup = applyProps(el, {
+      onClick: () => {},
+      class: s1,
+      title: s2,
+    })
+    expect(cleanup).not.toBeNull()
+    cleanup?.()
+  })
+
+  test("chains 3+ cleanups into array-based cleanup", () => {
+    const el = document.createElement("div")
+    const cleanup = applyProps(el, {
+      onClick: () => {},
+      onInput: () => {},
+      class: signal("x"),
+    })
+    expect(typeof cleanup).toBe("function")
+    cleanup?.()
+  })
+})
+
+// ─── applyProp — style ────────────────────────────────────────────────────────
+
+describe("applyProp — style", () => {
+  test("applies style as string via cssText", () => {
+    const el = document.createElement("div")
+    applyProp(el, "style", "color: red; font-size: 14px")
+    expect(el.style.cssText).toContain("color")
+  })
+
+  test("applies style as object with camelCase properties", () => {
+    const el = document.createElement("div")
+    applyProp(el, "style", { fontSize: "14px", color: "blue" })
+    // Check that setProperty was called (kebab-case conversion)
+    expect(el.style.getPropertyValue("font-size") || el.style.fontSize).toBeTruthy()
+  })
+
+  test("applies style with CSS custom properties (--var)", () => {
+    const el = document.createElement("div")
+    applyProp(el, "style", { "--main-color": "red" })
+    expect(el.style.getPropertyValue("--main-color")).toBe("red")
+  })
+
+  test("ignores null/undefined style", () => {
+    const el = document.createElement("div")
+    // null style removes the attribute
+    applyProp(el, "style", null)
+    expect(el.hasAttribute("style")).toBe(false)
+  })
+})
+
+// ─── applyProp — class ───────────────────────────────────────────────────────
+
+describe("applyProp — class", () => {
+  test("applies class as string", () => {
+    const el = document.createElement("div")
+    applyProp(el, "class", "foo bar")
+    expect(el.getAttribute("class")).toBe("foo bar")
+  })
+
+  test("applies class as array", () => {
+    const el = document.createElement("div")
+    applyProp(el, "class", ["foo", "bar"])
+    expect(el.getAttribute("class")).toBe("foo bar")
+  })
+
+  test("applies class as object (conditionals)", () => {
+    const el = document.createElement("div")
+    applyProp(el, "class", { active: true, disabled: false, highlight: true })
+    const cls = el.getAttribute("class") ?? ""
+    expect(cls).toContain("active")
+    expect(cls).toContain("highlight")
+    expect(cls).not.toContain("disabled")
+  })
+
+  test("applies className as alias for class", () => {
+    const el = document.createElement("div")
+    applyProp(el, "className", "my-class")
+    expect(el.getAttribute("class")).toBe("my-class")
+  })
+
+  test("sets empty class attribute when value resolves to empty", () => {
+    const el = document.createElement("div")
+    applyProp(el, "class", "")
+    expect(el.getAttribute("class")).toBe("")
+  })
+})
+
+// ─── applyProp — events ──────────────────────────────────────────────────────
+
+describe("applyProp — events", () => {
+  test("adds non-delegated event listener and returns cleanup", () => {
+    const el = document.createElement("div")
+    const handler = vi.fn()
+    // onScroll is non-delegated (scroll doesn't bubble)
+    const cleanup = applyProp(el, "onScroll", handler)
+    expect(cleanup).not.toBeNull()
+    // Dispatch scroll event — non-delegated events use addEventListener directly
+    el.dispatchEvent(new Event("scroll"))
+    expect(handler).toHaveBeenCalled()
+    cleanup?.()
+  })
+
+  test("adds delegated event via expando property", () => {
+    const el = document.createElement("div")
+    const handler = vi.fn()
+    const cleanup = applyProp(el, "onClick", handler)
+    expect(cleanup).not.toBeNull()
+    // Check that the delegated expando property is set
+    const prop = delegatedPropName("click")
+    expect(typeof (el as unknown as Record<string, unknown>)[prop]).toBe("function")
+    cleanup?.()
+    // After cleanup, expando should be undefined
+    expect((el as unknown as Record<string, unknown>)[prop]).toBeUndefined()
+  })
+
+  test("warns on non-function event handler in dev mode", () => {
+    const el = document.createElement("div")
+    const warnSpy = vi.spyOn(console, "warn").mockImplementation(() => {})
+    const cleanup = applyProp(el, "onClick", "not-a-function")
+    expect(warnSpy).toHaveBeenCalledWith(expect.stringContaining("non-function"))
+    expect(cleanup).toBeNull()
+    warnSpy.mockRestore()
+  })
+
+  test("cleanup removes non-delegated event listener", () => {
+    const el = document.createElement("div")
+    const handler = vi.fn()
+    const cleanup = applyProp(el, "onScroll", handler)
+    cleanup?.()
+    el.dispatchEvent(new Event("scroll"))
+    expect(handler).not.toHaveBeenCalled()
+  })
+})
+
+// ─── applyProp — reactive (function) values ──────────────────────────────────
+
+describe("applyProp — reactive values", () => {
+  test("wraps function value in renderEffect", () => {
+    const el = document.createElement("div")
+    const s = signal("hello")
+    const cleanup = applyProp(el, "title", () => s())
+    expect(el.getAttribute("title")).toBe("hello")
+    s.set("world")
+    expect(el.getAttribute("title")).toBe("world")
+    cleanup?.()
+  })
+
+  test("stops tracking after disposal", () => {
+    const el = document.createElement("div")
+    const s = signal("a")
+    const cleanup = applyProp(el, "title", () => s())
+    cleanup?.()
+    s.set("b")
+    expect(el.getAttribute("title")).toBe("a")
+  })
+})
+
+// ─── applyProp — static values ───────────────────────────────────────────────
+
+describe("applyProp — static values", () => {
+  test("sets string attribute", () => {
+    const el = document.createElement("div")
+    applyProp(el, "data-testid", "hello")
+    expect(el.getAttribute("data-testid")).toBe("hello")
+  })
+
+  test("removes attribute when value is null", () => {
+    const el = document.createElement("div")
+    el.setAttribute("data-x", "val")
+    applyProp(el, "data-x", null)
+    expect(el.hasAttribute("data-x")).toBe(false)
+  })
+
+  test("removes attribute when value is undefined", () => {
+    const el = document.createElement("div")
+    el.setAttribute("data-x", "val")
+    applyProp(el, "data-x", undefined)
+    expect(el.hasAttribute("data-x")).toBe(false)
+  })
+
+  test("sets boolean true as empty attribute", () => {
+    const el = document.createElement("input") as HTMLInputElement
+    applyProp(el, "disabled", true)
+    expect(el.hasAttribute("disabled")).toBe(true)
+    expect(el.getAttribute("disabled")).toBe("")
+  })
+
+  test("removes attribute for boolean false", () => {
+    const el = document.createElement("input") as HTMLInputElement
+    el.setAttribute("disabled", "")
+    applyProp(el, "disabled", false)
+    expect(el.hasAttribute("disabled")).toBe(false)
+  })
+
+  test("sets DOM property directly when key exists on element", () => {
+    const el = document.createElement("input") as HTMLInputElement
+    applyProp(el, "value", "hello")
+    expect(el.value).toBe("hello")
+  })
+
+  test("falls back to setAttribute for unknown attributes", () => {
+    const el = document.createElement("div")
+    applyProp(el, "data-custom", 42)
+    expect(el.getAttribute("data-custom")).toBe("42")
+  })
+})
+
+// ─── applyProp — innerHTML / dangerouslySetInnerHTML ─────────────────────────
+
+describe("applyProp — innerHTML", () => {
+  test("innerHTML is sanitized", () => {
+    const el = document.createElement("div")
+    applyProp(el, "innerHTML", '<b>bold</b><script>alert("xss")</script>')
+    // Script tag should be stripped by sanitizer
+    expect(el.innerHTML).toContain("<b>bold</b>")
+    expect(el.innerHTML).not.toContain("<script>")
+  })
+
+  test("dangerouslySetInnerHTML bypasses sanitization", () => {
+    const el = document.createElement("div")
+    const warnSpy = vi.spyOn(console, "warn").mockImplementation(() => {})
+    applyProp(el, "dangerouslySetInnerHTML", { __html: "<em>raw</em>" })
+    expect(el.innerHTML).toBe("<em>raw</em>")
+    expect(warnSpy).toHaveBeenCalledWith(
+      expect.stringContaining("dangerouslySetInnerHTML bypasses sanitization"),
+    )
+    warnSpy.mockRestore()
+  })
+})
+
+// ─── applyProp — URL safety ──────────────────────────────────────────────────
+
+describe("applyProp — URL safety", () => {
+  test("blocks javascript: in href", () => {
+    const el = document.createElement("a")
+    const warnSpy = vi.spyOn(console, "warn").mockImplementation(() => {})
+    applyProp(el, "href", "javascript:alert(1)")
+    expect(el.hasAttribute("href")).toBe(false)
+    warnSpy.mockRestore()
+  })
+
+  test("blocks data: in src", () => {
+    const el = document.createElement("img")
+    const warnSpy = vi.spyOn(console, "warn").mockImplementation(() => {})
+    applyProp(el, "src", "data:text/html,<script>alert(1)</script>")
+    expect(el.hasAttribute("src")).toBe(false)
+    warnSpy.mockRestore()
+  })
+
+  test("allows safe URLs", () => {
+    const el = document.createElement("a")
+    applyProp(el, "href", "https://example.com")
+    expect(el.getAttribute("href")).toBe("https://example.com")
+  })
+})
+
+// ─── sanitizeHtml ────────────────────────────────────────────────────────────
+
+describe("sanitizeHtml", () => {
+  test("strips script tags", () => {
+    const result = sanitizeHtml('<div>hello</div><script>alert("xss")</script>')
+    expect(result).not.toContain("<script>")
+    expect(result).toContain("hello")
+  })
+
+  test("strips event handler attributes", () => {
+    const result = sanitizeHtml('<div onclick="alert(1)">text</div>')
+    expect(result).not.toContain("onclick")
+    expect(result).toContain("text")
+  })
+
+  test("strips javascript: URLs from href", () => {
+    const result = sanitizeHtml('<a href="javascript:alert(1)">click</a>')
+    expect(result).not.toContain("javascript:")
+  })
+
+  test("allows safe HTML tags", () => {
+    const result = sanitizeHtml("<b>bold</b> <em>italic</em> <p>paragraph</p>")
+    expect(result).toContain("<b>bold</b>")
+    expect(result).toContain("<em>italic</em>")
+    expect(result).toContain("<p>paragraph</p>")
+  })
+
+  test("uses custom sanitizer when set", () => {
+    const custom = vi.fn((html: string) => html.replace(/<[^>]+>/g, ""))
+    setSanitizer(custom)
+    const result = sanitizeHtml("<div>test</div>")
+    expect(custom).toHaveBeenCalledWith("<div>test</div>")
+    expect(result).toBe("test")
+    setSanitizer(null)
+  })
+})
+
+// ─── delegate.ts ─────────────────────────────────────────────────────────────
+
+describe("delegate", () => {
+  test("DELEGATED_EVENTS contains common bubbling events", () => {
+    expect(DELEGATED_EVENTS.has("click")).toBe(true)
+    expect(DELEGATED_EVENTS.has("input")).toBe(true)
+    expect(DELEGATED_EVENTS.has("keydown")).toBe(true)
+    expect(DELEGATED_EVENTS.has("submit")).toBe(true)
+  })
+
+  test("DELEGATED_EVENTS does not contain non-bubbling events", () => {
+    expect(DELEGATED_EVENTS.has("focus")).toBe(false)
+    expect(DELEGATED_EVENTS.has("blur")).toBe(false)
+    expect(DELEGATED_EVENTS.has("mouseenter")).toBe(false)
+    expect(DELEGATED_EVENTS.has("mouseleave")).toBe(false)
+    expect(DELEGATED_EVENTS.has("load")).toBe(false)
+    expect(DELEGATED_EVENTS.has("scroll")).toBe(false)
+  })
+
+  test("delegatedPropName returns __ev_{eventName}", () => {
+    expect(delegatedPropName("click")).toBe("__ev_click")
+    expect(delegatedPropName("input")).toBe("__ev_input")
+  })
+
+  test("setupDelegation installs listeners and dispatches to expandos", () => {
+    const container = document.createElement("div")
+    document.body.appendChild(container)
+    setupDelegation(container)
+
+    const child = document.createElement("button")
+    container.appendChild(child)
+
+    const handler = vi.fn()
+    const prop = delegatedPropName("click")
+    ;(child as unknown as Record<string, unknown>)[prop] = handler
+
+    child.click()
+    expect(handler).toHaveBeenCalled()
+
+    container.remove()
+  })
+
+  test("setupDelegation is idempotent (safe to call twice)", () => {
+    const container = document.createElement("div")
+    document.body.appendChild(container)
+    // Should not throw when called twice
+    setupDelegation(container)
+    setupDelegation(container)
+
+    const child = document.createElement("span")
+    container.appendChild(child)
+
+    let callCount = 0
+    const prop = delegatedPropName("click")
+    ;(child as unknown as Record<string, unknown>)[prop] = () => {
+      callCount++
+    }
+
+    child.click()
+    // Should only fire once (not duplicated by double setup)
+    expect(callCount).toBe(1)
+
+    container.remove()
+  })
+
+  test("delegation walks up the DOM tree (ancestor handlers fire)", () => {
+    const container = document.createElement("div")
+    document.body.appendChild(container)
+    setupDelegation(container)
+
+    const parent = document.createElement("div")
+    const child = document.createElement("span")
+    parent.appendChild(child)
+    container.appendChild(parent)
+
+    const parentHandler = vi.fn()
+    const childHandler = vi.fn()
+    const prop = delegatedPropName("click")
+    ;(parent as unknown as Record<string, unknown>)[prop] = parentHandler
+    ;(child as unknown as Record<string, unknown>)[prop] = childHandler
+
+    child.click()
+    expect(childHandler).toHaveBeenCalled()
+    expect(parentHandler).toHaveBeenCalled()
+
+    container.remove()
+  })
+
+  test("delegation respects stopPropagation", () => {
+    const container = document.createElement("div")
+    document.body.appendChild(container)
+    setupDelegation(container)
+
+    const parent = document.createElement("div")
+    const child = document.createElement("span")
+    parent.appendChild(child)
+    container.appendChild(parent)
+
+    const parentHandler = vi.fn()
+    const childHandler = vi.fn((e: Event) => e.stopPropagation())
+    const prop = delegatedPropName("click")
+    ;(parent as unknown as Record<string, unknown>)[prop] = parentHandler
+    ;(child as unknown as Record<string, unknown>)[prop] = childHandler
+
+    child.click()
+    expect(childHandler).toHaveBeenCalled()
+    expect(parentHandler).not.toHaveBeenCalled()
+
+    container.remove()
+  })
+
+  test("delegation skips non-function expando values", () => {
+    const container = document.createElement("div")
+    document.body.appendChild(container)
+    setupDelegation(container)
+
+    const child = document.createElement("span")
+    container.appendChild(child)
+
+    const prop = delegatedPropName("click")
+    ;(child as unknown as Record<string, unknown>)[prop] = "not-a-function"
+
+    // Should not throw
+    expect(() => child.click()).not.toThrow()
+
+    container.remove()
+  })
+})