@bleedingdev/modern-js-plugin-tanstack 3.2.0-ultramodern.12 → 3.2.0-ultramodern.121

package/tests/router/hydrationBoundary.test.tsx

@@ -0,0 +1,23 @@
+import { isValidElement, Suspense } from 'react';
+import { wrapTanstackSsrHydrationBoundary } from '../../src/runtime/hydrationBoundary';
+
+describe('tanstack SSR hydration boundary', () => {
+  it('wraps SSR hydration content in a Suspense boundary', () => {
+    const routerContent = <main data-testid="router" />;
+
+    const wrapped = wrapTanstackSsrHydrationBoundary(routerContent, true);
+
+    expect(isValidElement(wrapped)).toBe(true);
+    expect(wrapped.type).toBe(Suspense);
+    expect(wrapped.props.fallback).toBe(null);
+    expect(wrapped.props.children).toBe(routerContent);
+  });
+
+  it('keeps non-SSR router content unwrapped', () => {
+    const routerContent = <main data-testid="router" />;
+
+    expect(wrapTanstackSsrHydrationBoundary(routerContent, false)).toBe(
+      routerContent,
+    );
+  });
+});

package/tests/router/loaderBridge.test.ts

@@ -0,0 +1,211 @@
+import { isNotFound, isRedirect } from '@tanstack/react-router';
+import {
+  createRouteStaticData,
+  isAbsoluteUrl,
+  mapSplatParamsForModernLoader,
+  modernLoaderToTanstack,
+  throwTanstackRedirect,
+} from '../../src/runtime/loaderBridge';
+
+type RedirectLike = {
+  options?: {
+    href?: string;
+    to?: string;
+  };
+};
+
+function catchThrown(fn: () => unknown): unknown {
+  try {
+    fn();
+  } catch (err) {
+    return err;
+  }
+  throw new Error('expected the function to throw');
+}
+
+describe('throwTanstackRedirect', () => {
+  test('absolute URLs redirect via href (external), not via to', () => {
+    // The old inline codegen handler threw `redirect({ href })` INSIDE a
+    // try block whose catch replaced it with `redirect({ to: absoluteUrl })`,
+    // making TanStack treat the absolute URL as an internal path.
+    const thrown = catchThrown(() =>
+      throwTanstackRedirect('https://example.com/external'),
+    ) as RedirectLike;
+
+    expect(isRedirect(thrown)).toBe(true);
+    expect(thrown.options?.href).toBe('https://example.com/external');
+    expect(thrown.options?.to).toBeUndefined();
+  });
+
+  test('relative paths redirect via to so the basepath rewrite applies', () => {
+    const thrown = catchThrown(() =>
+      throwTanstackRedirect('/dashboard'),
+    ) as RedirectLike;
+
+    expect(isRedirect(thrown)).toBe(true);
+    expect(thrown.options?.to).toBe('/dashboard');
+    expect(thrown.options?.href).toBeUndefined();
+  });
+
+  test('empty location falls back to /', () => {
+    const thrown = catchThrown(() => throwTanstackRedirect('')) as RedirectLike;
+    expect(thrown.options?.to).toBe('/');
+  });
+});
+
+describe('isAbsoluteUrl', () => {
+  test('detects absolute and relative URLs', () => {
+    expect(isAbsoluteUrl('https://example.com/a')).toBe(true);
+    expect(isAbsoluteUrl('mailto:x@example.com')).toBe(true);
+    expect(isAbsoluteUrl('/internal/path')).toBe(false);
+    expect(isAbsoluteUrl('relative')).toBe(false);
+  });
+});
+
+describe('mapSplatParamsForModernLoader', () => {
+  test('maps TanStack _splat to React Router * only for splat routes', () => {
+    expect(
+      mapSplatParamsForModernLoader({ _splat: 'a/b', id: '1' }, true),
+    ).toEqual({ '*': 'a/b', id: '1' });
+    expect(
+      mapSplatParamsForModernLoader({ _splat: 'a/b', id: '1' }, false),
+    ).toEqual({ _splat: 'a/b', id: '1' });
+    expect(mapSplatParamsForModernLoader({ id: '1' }, true)).toEqual({
+      id: '1',
+    });
+  });
+});
+
+describe('createRouteStaticData', () => {
+  test('drops empty fields', () => {
+    const loader = () => null;
+    expect(createRouteStaticData({})).toEqual({});
+    expect(createRouteStaticData({ modernRouteId: '' })).toEqual({});
+    expect(
+      createRouteStaticData({
+        modernRouteId: 'page',
+        modernRouteLoader: loader,
+      }),
+    ).toEqual({ modernRouteId: 'page', modernRouteLoader: loader });
+  });
+});
+
+describe('modernLoaderToTanstack', () => {
+  const baseCtx = {
+    location: { href: 'http://localhost/products/1' },
+    params: { id: '1' },
+  };
+
+  test('passes request/params/context through to the modern loader', async () => {
+    const seen: { request?: Request; params?: unknown; context?: unknown } = {};
+    const loader = modernLoaderToTanstack({ hasSplat: false }, (args: any) => {
+      seen.request = args.request;
+      seen.params = args.params;
+      seen.context = args.context;
+      return { ok: true };
+    });
+
+    await expect(
+      loader({
+        ...baseCtx,
+        context: { requestContext: { user: 'u1' } },
+      }),
+    ).resolves.toEqual({ ok: true });
+    expect(seen.request).toBeInstanceOf(Request);
+    expect(seen.request?.url).toBe('http://localhost/products/1');
+    expect(seen.params).toEqual({ id: '1' });
+    expect(seen.context).toEqual({ user: 'u1' });
+  });
+
+  test('translates an absolute-URL redirect Response into redirect({ href })', async () => {
+    const loader = modernLoaderToTanstack({ hasSplat: false }, () =>
+      Response.redirect('https://example.com/away', 302),
+    );
+
+    const thrown = (await loader(baseCtx).then(
+      () => {
+        throw new Error('expected redirect');
+      },
+      (err: unknown) => err,
+    )) as RedirectLike;
+
+    expect(isRedirect(thrown)).toBe(true);
+    expect(thrown.options?.href).toBe('https://example.com/away');
+    expect(thrown.options?.to).toBeUndefined();
+  });
+
+  test('translates a relative redirect Response into redirect({ to })', async () => {
+    const loader = modernLoaderToTanstack(
+      { hasSplat: false },
+      () =>
+        new Response(null, { status: 302, headers: { Location: '/login' } }),
+    );
+
+    const thrown = (await loader(baseCtx).then(
+      () => {
+        throw new Error('expected redirect');
+      },
+      (err: unknown) => err,
+    )) as RedirectLike;
+
+    expect(isRedirect(thrown)).toBe(true);
+    expect(thrown.options?.to).toBe('/login');
+  });
+
+  test('translates a 404 Response into notFound()', async () => {
+    const loader = modernLoaderToTanstack(
+      { hasSplat: false },
+      () => new Response(null, { status: 404 }),
+    );
+
+    const thrown = await loader(baseCtx).then(
+      () => {
+        throw new Error('expected notFound');
+      },
+      (err: unknown) => err,
+    );
+
+    expect(isNotFound(thrown)).toBe(true);
+  });
+
+  test('preserves returned non-404 error Responses as loader results', async () => {
+    const response = new Response('loader exploded', { status: 500 });
+    const loader = modernLoaderToTanstack({ hasSplat: false }, () => response);
+
+    await expect(loader(baseCtx)).resolves.toBe(response);
+  });
+
+  test('translates redirect Responses thrown synchronously by the loader', () => {
+    const loader = modernLoaderToTanstack({ hasSplat: false }, () => {
+      throw new Response(null, {
+        status: 301,
+        headers: { Location: 'https://example.com/moved' },
+      });
+    });
+
+    // A synchronous loader throw surfaces synchronously (TanStack handles
+    // thrown redirects from the loader call itself).
+    const thrown = catchThrown(() => loader(baseCtx)) as RedirectLike;
+
+    expect(isRedirect(thrown)).toBe(true);
+    expect(thrown.options?.href).toBe('https://example.com/moved');
+  });
+
+  test('re-throws TanStack redirects thrown by the loader untouched', async () => {
+    const loader = modernLoaderToTanstack({ hasSplat: false }, async () => {
+      throwTanstackRedirect('/inner');
+    });
+
+    const thrown = (await loader(baseCtx).then(
+      () => {
+        throw new Error('expected redirect');
+      },
+      (err: unknown) => err,
+    )) as RedirectLike;
+
+    // The bridge must not re-translate its own redirect (a Response without
+    // a Location header) — that used to collapse internal targets to '/'.
+    expect(isRedirect(thrown)).toBe(true);
+    expect(thrown.options?.to).toBe('/inner');
+  });
+});

package/tests/router/packageSurface.test.ts

@@ -0,0 +1,24 @@
+import { readFileSync } from 'node:fs';
+import path from 'node:path';
+
+describe('tanstack package public surface', () => {
+  test('package manifest exposes the runtime subpath used by app fixtures', () => {
+    const packageJson = JSON.parse(
+      readFileSync(path.join(__dirname, '../../package.json'), 'utf-8'),
+    ) as {
+      exports: Record<string, unknown>;
+      typesVersions?: Record<string, Record<string, string[]>>;
+    };
+
+    expect(packageJson.exports['./runtime']).toEqual({
+      types: './dist/types/runtime/index.d.ts',
+      node: {
+        module: './dist/esm/runtime/index.mjs',
+      },
+      default: './dist/esm/runtime/index.mjs',
+    });
+    expect(packageJson.typesVersions?.['*']?.runtime).toEqual([
+      './dist/types/runtime/index.d.ts',
+    ]);
+  });
+});

package/tests/router/prefetchLink.test.tsx

@@ -1,6 +1,6 @@
 import { render } from '@testing-library/react';
 import React from 'react';
-import { Link } from '../../src/runtime/prefetchLink';
+import { Link, NavLink } from '../../src/runtime/prefetchLink';
 
 type MockLinkProps = {
   children?: React.ReactNode;
@@ -21,23 +21,59 @@ describe('tanstack prefetch link adapter', () => {
     capturedPreloads = [];
   });
 
-  it('maps viewport prefetch to TanStack preload', () => {
+  it('defaults TanStack preload to viewport', () => {
+    render(<Link to="/settings">Settings</Link>);
+
+    expect(capturedPreloads).toEqual(['viewport']);
+  });
+
+  it('preserves explicit preload', () => {
     render(
-      <Link to="/settings" prefetch="viewport">
+      <Link to="/settings" prefetch="render" preload="intent">
         Settings
       </Link>,
     );
 
-    expect(capturedPreloads).toEqual(['viewport']);
+    expect(capturedPreloads).toEqual(['intent']);
   });
 
-  it('does not override explicit preload', () => {
+  it('preserves explicit disabled preload', () => {
     render(
-      <Link to="/settings" prefetch="viewport" preload="intent">
+      <Link to="/settings" prefetch="render" preload={false}>
         Settings
       </Link>,
     );
 
-    expect(capturedPreloads).toEqual(['intent']);
+    expect(capturedPreloads).toEqual([false]);
+  });
+
+  it('maps none prefetch to disabled TanStack preload', () => {
+    render(
+      <Link to="/settings" prefetch="none">
+        Settings
+      </Link>,
+    );
+
+    expect(capturedPreloads).toEqual([false]);
+  });
+
+  it.each([
+    'intent',
+    'render',
+    'viewport',
+  ] as const)('maps %s prefetch to TanStack preload', prefetch => {
+    render(
+      <Link to="/settings" prefetch={prefetch}>
+        Settings
+      </Link>,
+    );
+
+    expect(capturedPreloads).toEqual([prefetch]);
+  });
+
+  it('defaults NavLink preload to viewport', () => {
+    render(<NavLink to="/settings">Settings</NavLink>);
+
+    expect(capturedPreloads).toEqual(['viewport']);
   });
 });

package/tests/router/register.test.ts

@@ -0,0 +1,46 @@
+import { resolveRouterProvider } from '@modern-js/runtime/context';
+import {
+  Form,
+  Link,
+  NavLink,
+  Outlet,
+  RouteActionResponseError,
+  useFetcher,
+} from '../../src/runtime';
+import { tanstackRouterCompatBindings } from '../../src/runtime/register';
+
+const COMPAT_BINDINGS_SLOT = Symbol.for(
+  '@modern-js/plugin-tanstack:runtime-compat-bindings',
+);
+
+describe("'@modern-js/plugin-tanstack/runtime' import side effects", () => {
+  it('registers the tanstack router provider', () => {
+    expect(typeof resolveRouterProvider('tanstack')).toBe('function');
+  });
+
+  it("publishes the compat bindings consumed by '@modern-js/runtime/tanstack-router'", () => {
+    const bindings = (globalThis as Record<symbol, unknown>)[
+      COMPAT_BINDINGS_SLOT
+    ] as typeof tanstackRouterCompatBindings;
+
+    expect(bindings).toBeDefined();
+    expect(bindings).toBe(tanstackRouterCompatBindings);
+    expect(bindings.Form).toBe(Form);
+    expect(bindings.Link).toBe(Link);
+    expect(bindings.NavLink).toBe(NavLink);
+    expect(bindings.Outlet).toBe(Outlet);
+    expect(bindings.RouteActionResponseError).toBe(RouteActionResponseError);
+    expect(bindings.useFetcher).toBe(useFetcher);
+  });
+
+  it('keeps the first published bindings when a duplicate module copy evaluates', () => {
+    // Simulates a Module Federation remote evaluating its own copy of
+    // register.ts: `??=` must keep the established bindings.
+    const host = globalThis as Record<symbol, unknown>;
+    const established = host[COMPAT_BINDINGS_SLOT];
+    expect(established).toBeDefined();
+
+    host[COMPAT_BINDINGS_SLOT] ??= { duplicate: true };
+    expect(host[COMPAT_BINDINGS_SLOT]).toBe(established);
+  });
+});