toiljs 0.0.7 → 0.0.8

package/test/dom/loader.test.tsx

@@ -0,0 +1,121 @@
+// @vitest-environment jsdom
+import { afterEach, beforeEach, describe, expect, expectTypeOf, it, vi } from 'vitest';
+
+import {
+    clearLoaderData,
+    invalidateLoaderData,
+    loaderKey,
+    readRouteData,
+    type LoaderData,
+} from '../../src/client/routing/loader';
+import type { Revalidate } 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/router-loading.test.tsx

@@ -0,0 +1,44 @@
+// @vitest-environment jsdom
+import { act, cleanup, render, waitFor } from '@testing-library/react';
+import { afterEach, beforeEach, describe, expect, it } from 'vitest';
+
+import { navigate } from '../../src/client/navigation/navigation';
+import { Router } from '../../src/client/routing/Router';
+import type { RouteDef } from '../../src/client/types';
+
+afterEach(cleanup);
+beforeEach(() => {
+    window.history.replaceState({}, '', '/');
+});
+
+const routes: RouteDef[] = [
+    {
+        pattern: '/',
+        load: () => Promise.resolve({ default: () => <div>HOME</div> }),
+    },
+    {
+        // Page chunk never resolves, so the route stays suspended — exercising the fallback path.
+        pattern: '/slow',
+        load: () => new Promise<{ default: () => null }>(() => undefined),
+        loading: () => Promise.resolve({ default: () => <div>LOADING</div> }),
+    },
+];
+
+describe('Router loading fallback', () => {
+    it("shows the route's loading.tsx immediately when navigating to a suspending route", async () => {
+        const { findByText, queryByText } = render(<Router routes={routes} />);
+        await findByText('HOME');
+
+        // A route with a `loading.tsx` keys its Suspense boundary per URL, so even though navigation
+        // runs in a transition the fallback appears immediately (it isn't suppressed / frozen).
+        act(() => {
+            navigate('/slow');
+        });
+
+        await waitFor(() => {
+            expect(queryByText('LOADING')).not.toBeNull();
+        });
+        // The keyed boundary remounts for the new route, so the previous page is gone (not frozen).
+        expect(queryByText('HOME')).toBeNull();
+    });
+});

package/test/features.test.ts

@@ -1,11 +1,13 @@
 import { describe, expect, it } from 'vitest';
 
 import {
+    defaultConfigSource,
     detectPreprocessor,
     detectTailwind,
     packageDiff,
     preprocessorForExt,
     requiredPackages,
+    setConfigImages,
     setStyleImports,
     styleEntry,
     styleImportLines,
@@ -109,3 +111,32 @@ describe('detect from dependencies', () => {
         expect(detectTailwind({ react: '^19' })).toBe(false);
     });
 });
+
+describe('setConfigImages / defaultConfigSource', () => {
+    it('flips an existing images flag', () => {
+        const src = 'export default defineConfig({\n    client: {\n        images: true,\n    },\n});\n';
+        expect(setConfigImages(src, false)).toContain('images: false');
+        expect(setConfigImages(src, false)).not.toContain('images: true');
+    });
+
+    it('adds images to an existing client block', () => {
+        const out = setConfigImages('export default defineConfig({ client: { base: "/" } });', false);
+        expect(out).toContain('images: false');
+        expect(out).toContain('base: "/"');
+    });
+
+    it('adds a client block to a bare config', () => {
+        const out = setConfigImages('export default defineConfig({});', false);
+        expect(out).toContain('client: { images: false }');
+    });
+
+    it('returns null when the shape is unrecognized', () => {
+        expect(setConfigImages('const x = 1;', false)).toBeNull();
+    });
+
+    it('round-trips through defaultConfigSource', () => {
+        const src = defaultConfigSource(false);
+        expect(src).toContain('images: false');
+        expect(setConfigImages(src, true)).toContain('images: true');
+    });
+});

package/examples/basic/client/template.tsx

@@ -1,7 +0,0 @@
-import { type ReactNode } from 'react';
-
-// Like `layout.tsx`, but re-mounted on every navigation (keyed by pathname) instead of persisting.
-// Use it for per-navigation effects — enter animations, resetting state, replaying transitions.
-export default function Template({ children }: { children?: ReactNode }) {
-    return <div className="route-transition">{children}</div>;
-}