toiljs 0.0.14 → 0.0.16

package/test/dom/NavLink.test.tsx

@@ -1,37 +1,37 @@
-// @vitest-environment jsdom
-import { cleanup, render } from '@testing-library/react';
-import { afterEach, describe, expect, it } from 'vitest';
-
-import { NavLink } from '../../src/client/navigation/NavLink';
-
-afterEach(cleanup);
-
-describe('NavLink', () => {
-    it('adds the active class + aria-current on the current route', () => {
-        window.history.replaceState({}, '', '/about');
-        const { getByText } = render(<NavLink href="/about">about</NavLink>);
-        const a = getByText('about') as HTMLAnchorElement;
-        expect(a.className).toContain('active');
-        expect(a.getAttribute('aria-current')).toBe('page');
-    });
-
-    it('is not active on a different route', () => {
-        window.history.replaceState({}, '', '/home');
-        const { getByText } = render(<NavLink href="/about">about</NavLink>);
-        const a = getByText('about') as HTMLAnchorElement;
-        expect(a.className).not.toContain('active');
-        expect(a.getAttribute('aria-current')).toBeNull();
-    });
-
-    it('supports a function className', () => {
-        window.history.replaceState({}, '', '/about');
-        const { getByText } = render(
-            <NavLink
-                href="/about"
-                className={({ isActive }) => (isActive ? 'on' : 'off')}>
-                about
-            </NavLink>,
-        );
-        expect((getByText('about') as HTMLAnchorElement).className).toBe('on');
-    });
-});
+// @vitest-environment jsdom
+import { cleanup, render } from '@testing-library/react';
+import { afterEach, describe, expect, it } from 'vitest';
+
+import { NavLink } from '../../src/client/navigation/NavLink';
+
+afterEach(cleanup);
+
+describe('NavLink', () => {
+    it('adds the active class + aria-current on the current route', () => {
+        window.history.replaceState({}, '', '/about');
+        const { getByText } = render(<NavLink href="/about">about</NavLink>);
+        const a = getByText('about') as HTMLAnchorElement;
+        expect(a.className).toContain('active');
+        expect(a.getAttribute('aria-current')).toBe('page');
+    });
+
+    it('is not active on a different route', () => {
+        window.history.replaceState({}, '', '/home');
+        const { getByText } = render(<NavLink href="/about">about</NavLink>);
+        const a = getByText('about') as HTMLAnchorElement;
+        expect(a.className).not.toContain('active');
+        expect(a.getAttribute('aria-current')).toBeNull();
+    });
+
+    it('supports a function className', () => {
+        window.history.replaceState({}, '', '/about');
+        const { getByText } = render(
+            <NavLink
+                href="/about"
+                className={({ isActive }) => (isActive ? 'on' : 'off')}>
+                about
+            </NavLink>,
+        );
+        expect((getByText('about') as HTMLAnchorElement).className).toBe('on');
+    });
+});

package/test/dom/error-overlay.test.tsx

@@ -1,44 +1,44 @@
-// @vitest-environment jsdom
-import { act, cleanup, fireEvent, render } from '@testing-library/react';
-import { afterEach, describe, expect, it, vi } from 'vitest';
-
-import {
-    DevErrorBoundary,
-    DevErrorOverlay,
-    initDevErrorOverlay,
-} from '../../src/client/dev/error-overlay';
-
-afterEach(cleanup);
-
-function Boom(): never {
-    throw new Error('render boom');
-}
-
-describe('dev error overlay', () => {
-    it('surfaces an uncaught render error', () => {
-        // React logs caught boundary errors to console.error, silence it for a clean test run.
-        const spy = vi.spyOn(console, 'error').mockImplementation(() => undefined);
-        const { getByRole } = render(
-            <>
-                <DevErrorBoundary>
-                    <Boom />
-                </DevErrorBoundary>
-                <DevErrorOverlay />
-            </>,
-        );
-        expect(getByRole('alert').textContent).toContain('render boom');
-        spy.mockRestore();
-    });
-
-    it('surfaces an unhandled window error and dismisses it', async () => {
-        initDevErrorOverlay();
-        const { findByRole, queryByRole, getByText } = render(<DevErrorOverlay />);
-        act(() => {
-            window.dispatchEvent(new ErrorEvent('error', { error: new Error('async boom') }));
-        });
-        const alert = await findByRole('alert');
-        expect(alert.textContent).toContain('async boom');
-        fireEvent.click(getByText('Dismiss'));
-        expect(queryByRole('alert')).toBeNull();
-    });
-});
+// @vitest-environment jsdom
+import { act, cleanup, fireEvent, render } from '@testing-library/react';
+import { afterEach, describe, expect, it, vi } from 'vitest';
+
+import {
+    DevErrorBoundary,
+    DevErrorOverlay,
+    initDevErrorOverlay,
+} from '../../src/client/dev/error-overlay';
+
+afterEach(cleanup);
+
+function Boom(): never {
+    throw new Error('render boom');
+}
+
+describe('dev error overlay', () => {
+    it('surfaces an uncaught render error', () => {
+        // React logs caught boundary errors to console.error, silence it for a clean test run.
+        const spy = vi.spyOn(console, 'error').mockImplementation(() => undefined);
+        const { getByRole } = render(
+            <>
+                <DevErrorBoundary>
+                    <Boom />
+                </DevErrorBoundary>
+                <DevErrorOverlay />
+            </>,
+        );
+        expect(getByRole('alert').textContent).toContain('render boom');
+        spy.mockRestore();
+    });
+
+    it('surfaces an unhandled window error and dismisses it', async () => {
+        initDevErrorOverlay();
+        const { findByRole, queryByRole, getByText } = render(<DevErrorOverlay />);
+        act(() => {
+            window.dispatchEvent(new ErrorEvent('error', { error: new Error('async boom') }));
+        });
+        const alert = await findByRole('alert');
+        expect(alert.textContent).toContain('async boom');
+        fireEvent.click(getByText('Dismiss'));
+        expect(queryByRole('alert')).toBeNull();
+    });
+});

package/test/dom/loader.test.tsx

@@ -1,121 +1,121 @@
-// @vitest-environment jsdom
-import { afterEach, beforeEach, describe, expect, expectTypeOf, it, vi } from 'vitest';
-
-import type { Revalidate } from '../../src/client/routing/loader';
-import {
-    clearLoaderData,
-    invalidateLoaderData,
-    type LoaderData,
-    loaderKey,
-    readRouteData,
-} from '../../src/client/routing/loader';
-import type { RouteDef } from '../../src/client/types';
-
-/** Reads route data, awaiting the suspending promise once if it's pending. */
-async function read(route: RouteDef, key: string, epoch: number): Promise<unknown> {
-    try {
-        return readRouteData(route, {}, key, epoch).data;
-    } catch (thrown) {
-        if (thrown instanceof Promise) {
-            await thrown;
-            return readRouteData(route, {}, key, epoch).data;
-        }
-        throw thrown;
-    }
-}
-
-/** A route whose `load()` count tells us how many times the loader actually ran. */
-function makeRoute(revalidate?: Revalidate): { route: RouteDef; loads: () => number } {
-    let loads = 0;
-    const route: RouteDef = {
-        pattern: '/x',
-        load: () => {
-            loads += 1;
-            return Promise.resolve({
-                default: () => null,
-                loader: () => ({ n: loads }),
-                revalidate,
-            });
-        },
-    };
-    return { route, loads: () => loads };
-}
-
-beforeEach(() => {
-    clearLoaderData();
-});
-afterEach(() => {
-    vi.useRealTimers();
-});
-
-describe('loader caching', () => {
-    it('reuses cached data on re-read within the same navigation (loader runs once)', async () => {
-        const { route, loads } = makeRoute();
-        const key = loaderKey('/x', '');
-        await read(route, key, 1);
-        await read(route, key, 1);
-        expect(loads()).toBe(1);
-    });
-
-    it('a route with no loader stays cached across navigations (never re-suspends)', async () => {
-        let loads = 0;
-        const route: RouteDef = {
-            pattern: '/p',
-            load: () => {
-                loads += 1;
-                return Promise.resolve({ default: () => null });
-            },
-        };
-        const key = loaderKey('/p', '');
-        await read(route, key, 1);
-        await read(route, key, 2);
-        await read(route, key, 3);
-        expect(loads).toBe(1);
-    });
-
-    it('refetches on a new navigation under the default policy', async () => {
-        const { route, loads } = makeRoute();
-        const key = loaderKey('/x', '');
-        await read(route, key, 1);
-        await read(route, key, 2);
-        expect(loads()).toBe(2);
-    });
-
-    it('revalidate=false caches across navigations', async () => {
-        const { route, loads } = makeRoute(false);
-        const key = loaderKey('/x', '');
-        await read(route, key, 1);
-        await read(route, key, 2);
-        expect(loads()).toBe(1);
-    });
-
-    it('numeric revalidate caches until the staleTime elapses', async () => {
-        vi.useFakeTimers();
-        const { route, loads } = makeRoute(1); // 1 second
-        const key = loaderKey('/x', '');
-        await read(route, key, 1);
-        await read(route, key, 2); // still fresh
-        expect(loads()).toBe(1);
-        vi.advanceTimersByTime(1500); // now stale
-        await read(route, key, 3);
-        expect(loads()).toBe(2);
-    });
-
-    it('invalidateLoaderData(href) forces a refetch of that route', async () => {
-        const { route, loads } = makeRoute(false);
-        const key = loaderKey('/x', '');
-        await read(route, key, 1);
-        invalidateLoaderData('/x');
-        await read(route, key, 1);
-        expect(loads()).toBe(2);
-    });
-});
-
-describe('useLoaderData type inference', () => {
-    it('LoaderData<typeof loader> resolves to the loader return type', () => {
-        const loader = async () => Promise.resolve({ a: 1, b: 'x' as string | null });
-        expectTypeOf<LoaderData<typeof loader>>().toEqualTypeOf<{ a: number; b: string | null }>();
-        // An explicit type still passes straight through.
-        expectTypeOf<LoaderData<{ id: number }>>().toEqualTypeOf<{ id: number }>();
-    });
-});
+// @vitest-environment jsdom
+import { afterEach, beforeEach, describe, expect, expectTypeOf, it, vi } from 'vitest';
+
+import type { Revalidate } from '../../src/client/routing/loader';
+import {
+    clearLoaderData,
+    invalidateLoaderData,
+    type LoaderData,
+    loaderKey,
+    readRouteData,
+} from '../../src/client/routing/loader';
+import type { RouteDef } from '../../src/client/types';
+
+/** Reads route data, awaiting the suspending promise once if it's pending. */
+async function read(route: RouteDef, key: string, epoch: number): Promise<unknown> {
+    try {
+        return readRouteData(route, {}, key, epoch).data;
+    } catch (thrown) {
+        if (thrown instanceof Promise) {
+            await thrown;
+            return readRouteData(route, {}, key, epoch).data;
+        }
+        throw thrown;
+    }
+}
+
+/** A route whose `load()` count tells us how many times the loader actually ran. */
+function makeRoute(revalidate?: Revalidate): { route: RouteDef; loads: () => number } {
+    let loads = 0;
+    const route: RouteDef = {
+        pattern: '/x',
+        load: () => {
+            loads += 1;
+            return Promise.resolve({
+                default: () => null,
+                loader: () => ({ n: loads }),
+                revalidate,
+            });
+        },
+    };
+    return { route, loads: () => loads };
+}
+
+beforeEach(() => {
+    clearLoaderData();
+});
+afterEach(() => {
+    vi.useRealTimers();
+});
+
+describe('loader caching', () => {
+    it('reuses cached data on re-read within the same navigation (loader runs once)', async () => {
+        const { route, loads } = makeRoute();
+        const key = loaderKey('/x', '');
+        await read(route, key, 1);
+        await read(route, key, 1);
+        expect(loads()).toBe(1);
+    });
+
+    it('a route with no loader stays cached across navigations (never re-suspends)', async () => {
+        let loads = 0;
+        const route: RouteDef = {
+            pattern: '/p',
+            load: () => {
+                loads += 1;
+                return Promise.resolve({ default: () => null });
+            },
+        };
+        const key = loaderKey('/p', '');
+        await read(route, key, 1);
+        await read(route, key, 2);
+        await read(route, key, 3);
+        expect(loads).toBe(1);
+    });
+
+    it('refetches on a new navigation under the default policy', async () => {
+        const { route, loads } = makeRoute();
+        const key = loaderKey('/x', '');
+        await read(route, key, 1);
+        await read(route, key, 2);
+        expect(loads()).toBe(2);
+    });
+
+    it('revalidate=false caches across navigations', async () => {
+        const { route, loads } = makeRoute(false);
+        const key = loaderKey('/x', '');
+        await read(route, key, 1);
+        await read(route, key, 2);
+        expect(loads()).toBe(1);
+    });
+
+    it('numeric revalidate caches until the staleTime elapses', async () => {
+        vi.useFakeTimers();
+        const { route, loads } = makeRoute(1); // 1 second
+        const key = loaderKey('/x', '');
+        await read(route, key, 1);
+        await read(route, key, 2); // still fresh
+        expect(loads()).toBe(1);
+        vi.advanceTimersByTime(1500); // now stale
+        await read(route, key, 3);
+        expect(loads()).toBe(2);
+    });
+
+    it('invalidateLoaderData(href) forces a refetch of that route', async () => {
+        const { route, loads } = makeRoute(false);
+        const key = loaderKey('/x', '');
+        await read(route, key, 1);
+        invalidateLoaderData('/x');
+        await read(route, key, 1);
+        expect(loads()).toBe(2);
+    });
+});
+
+describe('useLoaderData type inference', () => {
+    it('LoaderData<typeof loader> resolves to the loader return type', () => {
+        const loader = async () => Promise.resolve({ a: 1, b: 'x' as string | null });
+        expectTypeOf<LoaderData<typeof loader>>().toEqualTypeOf<{ a: number; b: string | null }>();
+        // An explicit type still passes straight through.
+        expectTypeOf<LoaderData<{ id: number }>>().toEqualTypeOf<{ id: number }>();
+    });
+});

package/test/dom/navigation.test.ts

@@ -1,59 +1,59 @@
-// @vitest-environment jsdom
-import { beforeEach, describe, expect, it } from 'vitest';
-
-import {
-    back,
-    isNavigationPending,
-    navigate,
-    navigationEpoch,
-    settleNavigation,
-    subscribeLocation,
-} from '../../src/client/navigation/navigation';
-
-beforeEach(() => {
-    window.history.replaceState({}, '', '/');
-});
-
-describe('navigate', () => {
-    it('updates the location and notifies subscribers', () => {
-        let calls = 0;
-        const off = subscribeLocation(() => {
-            calls += 1;
-        });
-        navigate('/about');
-        expect(window.location.pathname).toBe('/about');
-        expect(calls).toBe(1);
-        off();
-    });
-
-    it('replace updates the location too', () => {
-        navigate('/replaced', { replace: true });
-        expect(window.location.pathname).toBe('/replaced');
-    });
-
-    it('increments the navigation epoch', () => {
-        const before = navigationEpoch();
-        navigate('/a');
-        expect(navigationEpoch()).toBe(before + 1);
-    });
-
-    it('is pending after navigate, settled after settleNavigation', () => {
-        navigate('/pending');
-        expect(isNavigationPending()).toBe(true);
-        settleNavigation();
-        expect(isNavigationPending()).toBe(false);
-    });
-
-    it('back() triggers a notification', () => {
-        navigate('/one');
-        navigate('/two');
-        let popped = 0;
-        const off = subscribeLocation(() => {
-            popped += 1;
-        });
-        back();
-        // jsdom fires popstate synchronously for history.back within the same task.
-        expect(popped).toBeGreaterThanOrEqual(0);
-        off();
-    });
-});
+// @vitest-environment jsdom
+import { beforeEach, describe, expect, it } from 'vitest';
+
+import {
+    back,
+    isNavigationPending,
+    navigate,
+    navigationEpoch,
+    settleNavigation,
+    subscribeLocation,
+} from '../../src/client/navigation/navigation';
+
+beforeEach(() => {
+    window.history.replaceState({}, '', '/');
+});
+
+describe('navigate', () => {
+    it('updates the location and notifies subscribers', () => {
+        let calls = 0;
+        const off = subscribeLocation(() => {
+            calls += 1;
+        });
+        navigate('/about');
+        expect(window.location.pathname).toBe('/about');
+        expect(calls).toBe(1);
+        off();
+    });
+
+    it('replace updates the location too', () => {
+        navigate('/replaced', { replace: true });
+        expect(window.location.pathname).toBe('/replaced');
+    });
+
+    it('increments the navigation epoch', () => {
+        const before = navigationEpoch();
+        navigate('/a');
+        expect(navigationEpoch()).toBe(before + 1);
+    });
+
+    it('is pending after navigate, settled after settleNavigation', () => {
+        navigate('/pending');
+        expect(isNavigationPending()).toBe(true);
+        settleNavigation();
+        expect(isNavigationPending()).toBe(false);
+    });
+
+    it('back() triggers a notification', () => {
+        navigate('/one');
+        navigate('/two');
+        let popped = 0;
+        const off = subscribeLocation(() => {
+            popped += 1;
+        });
+        back();
+        // jsdom fires popstate synchronously for history.back within the same task.
+        expect(popped).toBeGreaterThanOrEqual(0);
+        off();
+    });
+});

package/test/dom/revalidate.test.tsx

@@ -1,38 +1,38 @@
-// @vitest-environment jsdom
-import { act, cleanup, render } from '@testing-library/react';
-import { afterEach, beforeEach, describe, it } from 'vitest';
-
-import { Router } from '../../src/client/routing/Router';
-import { clearLoaderData, revalidate, useLoaderData } from '../../src/client/routing/loader';
-import type { RouteDef } from '../../src/client/types';
-
-afterEach(cleanup);
-beforeEach(() => {
-    clearLoaderData();
-    window.history.replaceState({}, '', '/');
-});
-
-describe('revalidate refetches', () => {
-    it('re-runs the loader and updates the rendered data', async () => {
-        let n = 0;
-        function Page(): React.ReactNode {
-            const value = useLoaderData<number>();
-            return <p>val:{String(value)}</p>;
-        }
-        const routes: RouteDef[] = [
-            {
-                pattern: '/',
-                load: () => Promise.resolve({ default: Page, loader: () => (n += 1) }),
-                // matches the example: this route has a loading.tsx (keyed boundary + transition).
-                loading: () => Promise.resolve({ default: () => <p>loading</p> }),
-            },
-        ];
-        const { findByText } = render(<Router routes={routes} />);
-        await findByText('val:1');
-
-        act(() => {
-            revalidate();
-        });
-        await findByText('val:2');
-    });
-});
+// @vitest-environment jsdom
+import { act, cleanup, render } from '@testing-library/react';
+import { afterEach, beforeEach, describe, it } from 'vitest';
+
+import { Router } from '../../src/client/routing/Router';
+import { clearLoaderData, revalidate, useLoaderData } from '../../src/client/routing/loader';
+import type { RouteDef } from '../../src/client/types';
+
+afterEach(cleanup);
+beforeEach(() => {
+    clearLoaderData();
+    window.history.replaceState({}, '', '/');
+});
+
+describe('revalidate refetches', () => {
+    it('re-runs the loader and updates the rendered data', async () => {
+        let n = 0;
+        function Page(): React.ReactNode {
+            const value = useLoaderData<number>();
+            return <p>val:{String(value)}</p>;
+        }
+        const routes: RouteDef[] = [
+            {
+                pattern: '/',
+                load: () => Promise.resolve({ default: Page, loader: () => (n += 1) }),
+                // matches the example: this route has a loading.tsx (keyed boundary + transition).
+                loading: () => Promise.resolve({ default: () => <p>loading</p> }),
+            },
+        ];
+        const { findByText } = render(<Router routes={routes} />);
+        await findByText('val:1');
+
+        act(() => {
+            revalidate();
+        });
+        await findByText('val:2');
+    });
+});