@pyreon/head 0.24.4 → 0.24.6

package/src/tests/integration.test.tsx

@@ -1,83 +0,0 @@
-import { h } from '@pyreon/core'
-import { signal } from '@pyreon/reactivity'
-import { mount } from '@pyreon/runtime-dom'
-import type { HeadContextValue } from '../index'
-import { createHeadContext, HeadProvider, useHead } from '../index'
-
-// ─── Integration tests ───────────────────────────────────────────────────────
-
-describe('Head integration — CSR', () => {
-  let container: HTMLElement
-  let ctx: HeadContextValue
-
-  beforeEach(() => {
-    container = document.createElement('div')
-    document.body.appendChild(container)
-    ctx = createHeadContext()
-    for (const el of document.head.querySelectorAll('[data-pyreon-head]')) el.remove()
-    document.title = ''
-  })
-
-  afterEach(() => {
-    container.remove()
-  })
-
-  it('useHead({ title }) updates document.title', () => {
-    function Page() {
-      useHead({ title: 'Page' })
-      return h('div', null, 'content')
-    }
-    mount(h(HeadProvider, { context: ctx, children: h(Page, null) }), container)
-    expect(document.title).toBe('Page')
-  })
-
-  it('useHead({ meta }) injects meta tag into head', () => {
-    function Page() {
-      useHead({ meta: [{ name: 'description', content: 'Integration test' }] })
-      return h('div', null)
-    }
-    mount(h(HeadProvider, { context: ctx, children: h(Page, null) }), container)
-    const meta = document.head.querySelector('meta[name="description"]')
-    expect(meta).not.toBeNull()
-    expect(meta?.getAttribute('content')).toBe('Integration test')
-  })
-
-  it('reactive useHead updates title when signal changes', () => {
-    const title = signal('Initial')
-    function Page() {
-      useHead(() => ({ title: title() }))
-      return h('div', null)
-    }
-    mount(h(HeadProvider, { context: ctx, children: h(Page, null) }), container)
-    expect(document.title).toBe('Initial')
-    title.set('Updated via signal')
-    expect(document.title).toBe('Updated via signal')
-  })
-
-  it('nested components: inner useHead overrides outer title', () => {
-    function Inner() {
-      useHead({ title: 'Inner Title' })
-      return h('span', null)
-    }
-    function Outer() {
-      useHead({ title: 'Outer Title' })
-      return h('div', null, h(Inner, null))
-    }
-    mount(h(HeadProvider, { context: ctx, children: h(Outer, null) }), container)
-    expect(document.title).toBe('Inner Title')
-  })
-
-  it('unmount removes head tags', () => {
-    function Page() {
-      useHead({ meta: [{ name: 'keywords', content: 'pyreon,test' }] })
-      return h('div', null)
-    }
-    const cleanup = mount(
-      h(HeadProvider, { context: ctx, children: h(Page, null) }),
-      container,
-    )
-    expect(document.head.querySelector('meta[name="keywords"]')).not.toBeNull()
-    cleanup()
-    expect(document.head.querySelector('meta[name="keywords"]')).toBeNull()
-  })
-})

package/src/tests/manifest-snapshot.test.ts

@@ -1,34 +0,0 @@
-import {
-  renderApiReferenceEntries,
-  renderLlmsFullSection,
-  renderLlmsTxtLine,
-} from '@pyreon/manifest'
-import manifest from '../manifest'
-
-// Structural snapshot — locks in the manifest's contract with the
-// gen-docs pipeline without inline-snapshotting the full prose
-// (which rots on every wording change). Pairs with the en-masse
-// `gen-docs --check` CI gate and the api-reference region marker.
-
-describe('gen-docs — head snapshot', () => {
-  it('renders a llms.txt bullet starting with the package prefix', () => {
-    const line = renderLlmsTxtLine(manifest)
-    expect(line.startsWith('- @pyreon/head —')).toBe(true)
-  })
-
-  it('renders a llms-full.txt section with the right header', () => {
-    const section = renderLlmsFullSection(manifest)
-    expect(section.startsWith('## @pyreon/head —')).toBe(true)
-    expect(section).toContain('```typescript')
-  })
-
-  it('renders MCP api-reference entries for every api[] item', () => {
-    const record = renderApiReferenceEntries(manifest)
-    expect(Object.keys(record).sort()).toEqual([
-      'head/HeadProvider',
-      'head/createHeadContext',
-      'head/renderWithHead',
-      'head/useHead',
-    ])
-  })
-})

package/src/tests/native-marker.test.ts

@@ -1,9 +0,0 @@
-import { isNativeCompat } from '@pyreon/core'
-import { describe, expect, it } from 'vitest'
-import { HeadProvider } from '../provider'
-
-describe('native-compat marker — @pyreon/head', () => {
-  it('HeadProvider is marked native', () => {
-    expect(isNativeCompat(HeadProvider)).toBe(true)
-  })
-})

package/src/tests/provider-inherits-context.test.tsx

@@ -1,131 +0,0 @@
-import type { ComponentFn } from '@pyreon/core'
-import { h } from '@pyreon/core'
-import { mount } from '@pyreon/runtime-dom'
-import { afterEach, beforeEach, describe, expect, it } from 'vitest'
-import { createHeadContext, HeadProvider, useHead } from '../index'
-import { renderWithHead } from '../ssr'
-
-/**
- * `HeadProvider` resolves its HeadContext as `props.context ?? outer ?? fresh`.
- * That inheritance step is load-bearing for the documented composition
- * `renderWithHead(h(HeadProvider, null, h(App)))` AND for the
- * `@pyreon/zero` SSR/SSG pipeline (whose `createApp` mounts
- * `h(HeadProvider, null, …)` unconditionally with no `context` prop).
- *
- * Pre-fix `HeadProvider` ALWAYS auto-created a fresh ctx and `provide()`d
- * it — silently SHADOWING the ctx that `renderWithHead` had pushed onto
- * the per-request context stack. Every `useHead({...})` call in the
- * subtree wrote tags to the inner ctx (HeadProvider's), but
- * `renderWithHead` resolved the outer ctx (its own, still empty) and
- * produced an empty `<head>` string. Static SSG / SSR output shipped
- * with NO `<title>` / `<meta>` / JSON-LD / OG tags — social scrapers and
- * non-JS crawlers saw nothing. Fixed by adding `useContext(HeadContext)`
- * to the resolution chain so an outer ctx is inherited transparently.
- */
-describe('HeadProvider — inherits an outer HeadContext (composability contract)', () => {
-  it('REGRESSION: `renderWithHead(h(HeadProvider, null, h(App)))` carries useHead tags into <head>', async () => {
-    // This is the EXACT shape `@pyreon/zero`'s `createApp` mounts:
-    //   h(App, null) → h(HeadProvider, null, h(RouterProvider, …, h(RouterView, null)))
-    // — i.e. the inner `HeadProvider` has no `context` prop. Pre-fix this
-    // produced an empty `head` string; the rendered HTML was perfectly fine.
-    const App: ComponentFn = () => {
-      useHead({
-        title: 'Page Title',
-        meta: [{ name: 'description', content: 'page desc' }],
-      })
-      return h('div', null, 'app body')
-    }
-
-    const wrapped = h(HeadProvider as ComponentFn, null, h(App, null))
-    const { html, head } = await renderWithHead(wrapped)
-
-    expect(html).toContain('app body')
-    expect(head).toContain('<title>Page Title</title>')
-    expect(head).toContain('name="description"')
-    expect(head).toContain('content="page desc"')
-  })
-
-  it('direct `h(App)` (no inner HeadProvider) still works — baseline parity', async () => {
-    const App: ComponentFn = () => {
-      useHead({ title: 'Baseline' })
-      return h('div', null)
-    }
-    const { head } = await renderWithHead(h(App, null))
-    expect(head).toContain('<title>Baseline</title>')
-  })
-
-  it('explicit `context` prop on the inner HeadProvider still wins (opt-out for isolation)', async () => {
-    // Apps that genuinely want an isolated head registry (iframe / micro-
-    // frontend) can pass their own ctx; the explicit prop overrides
-    // inheritance. The outer ctx that `renderWithHead` resolves remains
-    // empty in this case BY DESIGN — verifying the opt-out works.
-    const isolatedCtx = createHeadContext()
-    const App: ComponentFn = () => {
-      useHead({ title: 'Isolated' })
-      return h('div', null)
-    }
-    const wrapped = h(
-      HeadProvider as ComponentFn,
-      { context: isolatedCtx },
-      h(App, null),
-    )
-    const { head } = await renderWithHead(wrapped)
-    // Tags landed in the isolated ctx, NOT in renderWithHead's outer ctx
-    expect(head).toBe('')
-    // Confirm the tags really did go into the isolated ctx
-    const isolatedTags = isolatedCtx.resolve()
-    expect(isolatedTags.find((t) => t.tag === 'title')?.children).toBe('Isolated')
-  })
-
-  it('nested HeadProvider — inner inherits outer ctx, no shadow (registry stays single)', async () => {
-    // Two HeadProviders in the same tree should write into ONE registry,
-    // not two disjoint ones. Pre-fix the inner one created a fresh ctx,
-    // so the outer registry (which renderWithHead resolves) lost the
-    // inner subtree's tags. Post-fix the inner inherits the outer ctx
-    // and tags from both subtrees land in the same resolved <head>.
-    const Inner: ComponentFn = () => {
-      useHead({ meta: [{ name: 'inner', content: 'inner-value' }] })
-      return h('span', null, 'inner')
-    }
-    const Outer: ComponentFn = () => {
-      useHead({ title: 'Outer Title' })
-      return h(
-        'div',
-        null,
-        h(HeadProvider as ComponentFn, null, h(Inner, null)),
-      )
-    }
-    const { head } = await renderWithHead(h(Outer, null))
-    expect(head).toContain('<title>Outer Title</title>')
-    expect(head).toContain('name="inner"')
-    expect(head).toContain('content="inner-value"')
-  })
-
-  describe('CSR root — fresh-ctx fallback preserved (regression guard for the fix)', () => {
-    let container: HTMLElement
-    beforeEach(() => {
-      container = document.createElement('div')
-      document.body.appendChild(container)
-      for (const el of document.head.querySelectorAll('[data-pyreon-head]'))
-        el.remove()
-      document.title = ''
-    })
-    afterEach(() => {
-      container.remove()
-    })
-
-    it('mounts at CSR root with NO `context` prop + NO outer provider → auto-creates fresh ctx, useHead works', () => {
-      // When neither `props.context` nor an outer `HeadContext` is in
-      // scope, HeadProvider must STILL auto-create a fresh ctx so pure
-      // CSR roots work. If the fix accidentally regressed this path
-      // (e.g. requiring an outer ctx), `useHead` would no-op silently
-      // and `document.title` would stay empty.
-      const App: ComponentFn = () => {
-        useHead({ title: 'CSR Root' })
-        return h('div', null)
-      }
-      mount(h(HeadProvider as ComponentFn, null, h(App, null)), container)
-      expect(document.title).toBe('CSR Root')
-    })
-  })
-})

package/src/tests/setup.ts

@@ -1,3 +0,0 @@
-import { GlobalRegistrator } from '@happy-dom/global-registrator'
-
-GlobalRegistrator.register()

package/src/use-head.ts

@@ -1,123 +0,0 @@
-import { onMount, onUnmount, useContext } from '@pyreon/core'
-import { effect } from '@pyreon/reactivity'
-import type { HeadEntry, HeadTag, UseHeadInput } from './context'
-import { HeadContext } from './context'
-import { syncDom } from './dom'
-
-/** Cast a strict tag interface to the internal props format, stripping undefined values */
-function toProps(obj: Record<string, string | undefined>): Record<string, string> {
-  const result: Record<string, string> = {}
-  for (const [k, v] of Object.entries(obj)) {
-    if (v !== undefined) result[k] = v
-  }
-  return result
-}
-
-function buildEntry(o: UseHeadInput): HeadEntry {
-  const tags: HeadTag[] = []
-  if (o.title != null) tags.push({ tag: 'title', key: 'title', children: o.title })
-  o.meta?.forEach((m, i) => {
-    tags.push({
-      tag: 'meta',
-      key: m.name ?? m.property ?? `meta-${i}`,
-      props: toProps(m as Record<string, string | undefined>),
-    })
-  })
-  o.link?.forEach((l, i) => {
-    tags.push({
-      tag: 'link',
-      key: l.href ? `link-${l.rel || ''}-${l.href}` : l.rel ? `link-${l.rel}` : `link-${i}`,
-      props: toProps(l as Record<string, string | undefined>),
-    })
-  })
-  o.script?.forEach((s, i) => {
-    const { children, ...rest } = s
-    tags.push({
-      tag: 'script',
-      key: s.src ?? `script-${i}`,
-      props: toProps(rest as Record<string, string | undefined>),
-      ...(children != null ? { children } : {}),
-    })
-  })
-  o.style?.forEach((s, i) => {
-    const { children, ...rest } = s
-    tags.push({
-      tag: 'style',
-      key: `style-${i}`,
-      props: toProps(rest as Record<string, string | undefined>),
-      children,
-    })
-  })
-  o.noscript?.forEach((ns, i) => {
-    tags.push({ tag: 'noscript', key: `noscript-${i}`, children: ns.children })
-  })
-  if (o.jsonLd) {
-    tags.push({
-      tag: 'script',
-      key: 'jsonld',
-      props: { type: 'application/ld+json' },
-      children: JSON.stringify(o.jsonLd),
-    })
-  }
-  if (o.speculationRules) {
-    tags.push({
-      tag: 'script',
-      key: 'speculationrules',
-      props: { type: 'speculationrules' },
-      children: JSON.stringify(o.speculationRules),
-    })
-  }
-  if (o.base)
-    tags.push({
-      tag: 'base',
-      key: 'base',
-      props: toProps(o.base as Record<string, string | undefined>),
-    })
-  return {
-    tags,
-    titleTemplate: o.titleTemplate,
-    htmlAttrs: o.htmlAttrs,
-    bodyAttrs: o.bodyAttrs,
-  }
-}
-
-/**
- * Register head tags (title, meta, link, script, style, noscript, base, jsonLd)
- * for the current component.
- *
- * Accepts a static object or a reactive getter:
- *   useHead({ title: "My Page", meta: [{ name: "description", content: "..." }] })
- *   useHead(() => ({ title: `${count()} items` }))  // updates when signal changes
- *
- * Tags are deduplicated by key — innermost component wins.
- * Requires a <HeadProvider> (CSR) or renderWithHead() (SSR) ancestor.
- */
-export function useHead(input: UseHeadInput | (() => UseHeadInput)): void {
-  const ctx = useContext(HeadContext)
-  if (!ctx) return // no HeadProvider — silently no-op
-
-  const id = Symbol()
-
-  if (typeof input === 'function') {
-    if (typeof document !== 'undefined') {
-      // CSR: reactive — re-register whenever signals change
-      effect(() => {
-        ctx.add(id, buildEntry(input()))
-        syncDom(ctx)
-      })
-    } else {
-      // SSR: evaluate once synchronously (no effects on server)
-      ctx.add(id, buildEntry(input()))
-    }
-  } else {
-    ctx.add(id, buildEntry(input))
-    onMount(() => {
-      syncDom(ctx)
-    })
-  }
-
-  onUnmount(() => {
-    ctx.remove(id)
-    syncDom(ctx)
-  })
-}