@pyreon/router 0.24.4 → 0.24.6

package/src/scroll.ts

@@ -1,93 +0,0 @@
-import type { ResolvedRoute, RouterOptions } from './types'
-
-/**
- * Scroll restoration manager.
- *
- * Saves scroll position before each navigation and restores it when
- * navigating back to a previously visited path.
- */
-// LRU cap — in SPAs with unbounded URL space (`/user/:id`, query-string
-// variations, etc.) the `_positions` Map would grow per unique path
-// forever. 100 entries covers typical back-navigation depth; beyond that,
-// scroll restoration is a nice-to-have not a correctness requirement.
-const MAX_SCROLL_POSITIONS = 100
-
-export class ScrollManager {
-  private readonly _positions = new Map<string, number>()
-  private readonly _behavior: RouterOptions['scrollBehavior']
-
-  constructor(behavior: RouterOptions['scrollBehavior'] = 'top') {
-    this._behavior = behavior
-  }
-
-  /** Call before navigating away — saves current scroll position for `fromPath` */
-  save(fromPath: string): void {
-    // ScrollManager methods are only invoked from browser navigation paths,
-    // but an explicit early-return documents the SSR-safety contract at the
-    // callsite (the `no-window-in-ssr` lint rule can't AST-trace indirect
-    // calls from router setup).
-    if (typeof window === 'undefined') return
-    // LRU: re-insert moves the entry to newest. Evict oldest when over cap.
-    if (this._positions.has(fromPath)) this._positions.delete(fromPath)
-    this._positions.set(fromPath, window.scrollY)
-    while (this._positions.size > MAX_SCROLL_POSITIONS) {
-      const oldest = this._positions.keys().next().value
-      if (oldest === undefined) break
-      this._positions.delete(oldest)
-    }
-  }
-
-  /** Call after navigation is committed — applies scroll behavior */
-  restore(to: ResolvedRoute, from: ResolvedRoute): void {
-    const behavior = (to.meta.scrollBehavior as typeof this._behavior) ?? this._behavior ?? 'top'
-
-    if (typeof behavior === 'function') {
-      const saved = this._positions.get(to.path) ?? null
-      const result = behavior(to, from, saved)
-      this._applyResult(result, to.path)
-      return
-    }
-
-    this._applyResult(behavior, to.path)
-  }
-
-  private _applyResult(result: 'top' | 'restore' | 'none' | number, toPath: string): void {
-    if (typeof window === 'undefined') return
-    // Hash scrolling: if the path contains #, scroll to the element
-    const hashIdx = toPath.indexOf('#')
-    if (hashIdx >= 0) {
-      const id = toPath.slice(hashIdx + 1)
-      if (id) {
-        // Use requestAnimationFrame to ensure DOM is updated before scrolling
-        requestAnimationFrame(() => {
-          const el = document.getElementById(id)
-          if (el) {
-            el.scrollIntoView({ behavior: 'smooth' })
-            return
-          }
-          // Fallback: try name attribute (for anchors)
-          const namedEl = document.querySelector(`[name="${CSS.escape(id)}"]`)
-          if (namedEl) namedEl.scrollIntoView({ behavior: 'smooth' })
-        })
-        return
-      }
-    }
-
-    if (result === 'none') return
-    if (result === 'top' || result === undefined) {
-      window.scrollTo({ top: 0, behavior: 'instant' as ScrollBehavior })
-      return
-    }
-    if (result === 'restore') {
-      const saved = this._positions.get(toPath) ?? 0
-      window.scrollTo({ top: saved, behavior: 'instant' as ScrollBehavior })
-      return
-    }
-    // At this point result must be a number (all string cases handled above)
-    window.scrollTo({ top: result as number, behavior: 'instant' as ScrollBehavior })
-  }
-
-  getSavedPosition(path: string): number | null {
-    return this._positions.get(path) ?? null
-  }
-}

package/src/tests/integration.test.tsx

@@ -1,298 +0,0 @@
-import { h } from '@pyreon/core'
-import { signal } from '@pyreon/reactivity'
-import { mount } from '@pyreon/runtime-dom'
-import type { RouteRecord } from '../index'
-import {
-  createRouter,
-  prefetchLoaderData,
-  RouterProvider,
-  RouterView,
-  useLoaderData,
-} from '../index'
-import { setActiveRouter } from '../router'
-import type { RouterInstance } from '../types'
-
-// ─── Helpers ────────────────────────────────────────────────────────────────
-
-function container(): HTMLElement {
-  const el = document.createElement('div')
-  document.body.appendChild(el)
-  return el
-}
-
-const Home = () => h('div', null, 'Home Page')
-const About = () => h('div', null, 'About Page')
-const NotFound = () => h('div', null, 'Not Found')
-
-afterEach(() => {
-  setActiveRouter(null)
-  document.body.innerHTML = ''
-})
-
-// ─── Navigation cycle ───────────────────────────────────────────────────────
-
-describe('router integration — navigation cycle', () => {
-  const routes: RouteRecord[] = [
-    { path: '/', component: Home },
-    { path: '/about', component: About },
-    { path: '/user/:id', component: (props: Record<string, unknown>) => {
-      const params = props.params as Record<string, string>
-      return h('div', null, 'User: ', params.id)
-    }},
-    { path: '*', component: NotFound },
-  ]
-
-  test('push to route — correct component renders in DOM', async () => {
-    const el = container()
-    const router = createRouter({ routes, url: '/' })
-    mount(h(RouterProvider, { router }, h(RouterView, {})), el)
-    expect(el.textContent).toContain('Home Page')
-
-    await router.push('/about')
-    expect(el.textContent).toContain('About Page')
-  })
-
-  test('push to dynamic route /user/:id — component renders with correct params', async () => {
-    const el = container()
-    const router = createRouter({ routes, url: '/' })
-    mount(h(RouterProvider, { router }, h(RouterView, {})), el)
-
-    await router.push('/user/42')
-    expect(el.textContent).toContain('User: 42')
-  })
-
-  test('router.back() — previous route renders', async () => {
-    const el = container()
-    const router = createRouter({ routes, url: '/' })
-    mount(h(RouterProvider, { router }, h(RouterView, {})), el)
-
-    await router.push('/about')
-    expect(el.textContent).toContain('About Page')
-
-    router.back()
-    // back() is synchronous in SSR mode, give DOM time to update
-    await new Promise<void>((r) => setTimeout(r, 50))
-    // In SSR mode, back() may be a no-op (no window.history).
-    // Verify it doesn't throw and DOM is in a valid state.
-    expect(el.textContent).toBeDefined()
-  })
-
-  test('push to unknown route — catch-all component renders', async () => {
-    const el = container()
-    const router = createRouter({ routes, url: '/' })
-    mount(h(RouterProvider, { router }, h(RouterView, {})), el)
-
-    await router.push('/nonexistent/path')
-    expect(el.textContent).toContain('Not Found')
-  })
-})
-
-// ─── Guards ─────────────────────────────────────────────────────────────────
-
-describe('router integration — guards', () => {
-  test('beforeEnter returns false — navigation blocked, DOM unchanged', async () => {
-    const routes: RouteRecord[] = [
-      { path: '/', component: Home },
-      { path: '/protected', component: About, beforeEnter: () => false },
-    ]
-    const el = container()
-    const router = createRouter({ routes, url: '/' })
-    mount(h(RouterProvider, { router }, h(RouterView, {})), el)
-    expect(el.textContent).toContain('Home Page')
-
-    await router.push('/protected')
-    expect(el.textContent).toContain('Home Page')
-    expect(el.textContent).not.toContain('About Page')
-  })
-
-  test('beforeEnter returns string — redirects to that route', async () => {
-    const Redirected = () => h('div', null, 'Redirected Page')
-    const routes: RouteRecord[] = [
-      { path: '/', component: Home },
-      { path: '/old', component: About, beforeEnter: () => '/redirected' },
-      { path: '/redirected', component: Redirected },
-    ]
-    const el = container()
-    const router = createRouter({ routes, url: '/' })
-    mount(h(RouterProvider, { router }, h(RouterView, {})), el)
-
-    await router.push('/old')
-    expect(el.textContent).toContain('Redirected Page')
-    expect(router.currentRoute().path).toBe('/redirected')
-  })
-
-  test('async guard — resolves before navigation commits', async () => {
-    const order: string[] = []
-    const Protected = () => {
-      order.push('render')
-      return h('div', null, 'Protected')
-    }
-    const routes: RouteRecord[] = [
-      { path: '/', component: Home },
-      {
-        path: '/guarded',
-        component: Protected,
-        beforeEnter: async () => {
-          await new Promise<void>((r) => setTimeout(r, 20))
-          order.push('guard')
-          return true
-        },
-      },
-    ]
-    const el = container()
-    const router = createRouter({ routes, url: '/' })
-    mount(h(RouterProvider, { router }, h(RouterView, {})), el)
-
-    await router.push('/guarded')
-    // Guard runs before component renders
-    expect(order[0]).toBe('guard')
-    expect(order[1]).toBe('render')
-    expect(el.textContent).toContain('Protected')
-  })
-})
-
-// ─── Loaders ────────────────────────────────────────────────────────────────
-
-describe('router integration — loaders', () => {
-  test('route with loader — useLoaderData returns loader result', async () => {
-    const el = container()
-    let capturedData: unknown
-    const DataComp = () => {
-      capturedData = useLoaderData()
-      return h('span', null, 'data-loaded')
-    }
-    const routes: RouteRecord[] = [
-      { path: '/', component: Home },
-      {
-        path: '/data',
-        component: DataComp,
-        loader: async () => ({ items: [1, 2, 3] }),
-      },
-    ]
-    const router = createRouter({ routes, url: '/' })
-    await prefetchLoaderData(router as RouterInstance, '/data')
-    mount(h(RouterProvider, { router }, h(RouterView, {})), el)
-
-    await router.push('/data')
-    await new Promise<void>((r) => setTimeout(r, 50))
-    expect(capturedData).toEqual({ items: [1, 2, 3] })
-    expect(el.textContent).toContain('data-loaded')
-  })
-
-  test('loader throws — errorComponent renders instead', async () => {
-    const el = container()
-    const ErrorComp = () => h('span', null, 'loader-error')
-    const DataComp = () => h('span', null, 'data')
-    const routes: RouteRecord[] = [
-      { path: '/', component: Home },
-      {
-        path: '/err',
-        component: DataComp,
-        loader: async () => {
-          throw new Error('fail')
-        },
-        errorComponent: ErrorComp,
-      },
-    ]
-    const router = createRouter({ routes, url: '/' })
-    mount(h(RouterProvider, { router }, h(RouterView, {})), el)
-
-    await router.push('/err')
-    await new Promise<void>((r) => setTimeout(r, 50))
-    expect(el.textContent).toContain('loader-error')
-  })
-})
-
-// ─── Nested routes ──────────────────────────────────────────────────────────
-
-describe('router integration — nested routes', () => {
-  test('parent layout + child — both render (parent wraps child)', () => {
-    const el = container()
-    const ChildComp = () => h('span', { class: 'child' }, 'child-content')
-    const ParentComp = () =>
-      h('div', { class: 'parent' }, h('span', null, 'parent-content'), h(RouterView, {}))
-
-    const routes: RouteRecord[] = [
-      {
-        path: '/parent',
-        component: ParentComp,
-        children: [{ path: 'child', component: ChildComp }],
-      },
-    ]
-    const router = createRouter({ routes, url: '/parent/child' })
-    mount(h(RouterProvider, { router }, h(RouterView, {})), el)
-
-    expect(el.textContent).toContain('parent-content')
-    expect(el.textContent).toContain('child-content')
-  })
-
-  test('navigate to sibling child — parent stays, child swaps', async () => {
-    const el = container()
-    const ChildA = () => h('span', null, 'child-A')
-    const ChildB = () => h('span', null, 'child-B')
-    const ParentComp = () =>
-      h('div', { class: 'parent' }, h('span', null, 'parent-layout'), h(RouterView, {}))
-
-    const routes: RouteRecord[] = [
-      {
-        path: '/parent',
-        component: ParentComp,
-        children: [
-          { path: 'a', component: ChildA },
-          { path: 'b', component: ChildB },
-        ],
-      },
-    ]
-    const router = createRouter({ routes, url: '/parent/a' })
-    mount(h(RouterProvider, { router }, h(RouterView, {})), el)
-
-    expect(el.textContent).toContain('parent-layout')
-    expect(el.textContent).toContain('child-A')
-
-    await router.push('/parent/b')
-    expect(el.textContent).toContain('parent-layout')
-    expect(el.textContent).toContain('child-B')
-    expect(el.textContent).not.toContain('child-A')
-  })
-})
-
-// ─── Cleanup ────────────────────────────────────────────────────────────────
-
-describe('router integration — cleanup', () => {
-  test('navigate away — effect from previous route stops running', async () => {
-    const el = container()
-    let effectRunCount = 0
-    const counter = signal(0)
-
-    const Reactive = () => {
-      // Create a reactive text node that tracks the signal
-      return h('div', null, () => {
-        effectRunCount++
-        return `count: ${counter()}`
-      })
-    }
-
-    const routes: RouteRecord[] = [
-      { path: '/', component: Reactive },
-      { path: '/other', component: About },
-    ]
-    const router = createRouter({ routes, url: '/' })
-    mount(h(RouterProvider, { router }, h(RouterView, {})), el)
-
-    // Signal change triggers reactive update
-    const initialRuns = effectRunCount
-    counter.set(1)
-    expect(effectRunCount).toBeGreaterThan(initialRuns)
-
-    // Navigate away
-    await router.push('/other')
-    expect(el.textContent).toContain('About Page')
-
-    // Signal change should NOT trigger the old component's reactive text
-    const runsAfterNav = effectRunCount
-    counter.set(2)
-    // Give any potential stale effects time to fire
-    await new Promise<void>((r) => setTimeout(r, 50))
-    expect(effectRunCount).toBe(runsAfterNav)
-  })
-})