@bleedingdev/modern-js-plugin-tanstack 3.5.0-ultramodern.3 → 3.5.0-ultramodern.31

package/tests/router/prefetchLink.test.tsx

@@ -1,79 +1,126 @@
-import { render } from '@testing-library/react';
+import { createMemoryHistory } from '@tanstack/history';
+import {
+  createRootRoute,
+  createRoute,
+  createRouter,
+  RouterProvider,
+} from '@tanstack/react-router';
+import { render, waitFor } from '@testing-library/react';
 import React from 'react';
 import { Link, NavLink } from '../../src/runtime/prefetchLink';
 
-type MockLinkProps = {
-  children?: React.ReactNode;
-  preload?: unknown;
-};
-
-let capturedPreloads: unknown[] = [];
-
-rstest.mock('@tanstack/react-router', () => ({
-  Link: (props: MockLinkProps) => {
-    capturedPreloads.push(props.preload);
-    return <a href="/settings">{props.children}</a>;
-  },
-}));
-
-describe('tanstack prefetch link adapter', () => {
-  beforeEach(() => {
-    capturedPreloads = [];
+// Real-router harness (no module mocking): STATIC_ACTIVE_PROPS (the
+// TanStack behavior this adapter works around) is injected by
+// useLinkProps() based on live route match state, which a mocked
+// useLinkProps() cannot reproduce faithfully. We tried spying on
+// useLinkProps via rstest.mock()+importActual while re-exporting the rest
+// of the module untouched, but rstest's module-mock hoisting resolves the
+// "actual" import for a module through its own in-progress mock
+// registration, so every named export (createRootRoute included) comes
+// back undefined -- see the sibling prefetchLinkPreload.test.tsx file for
+// the fully-mocked preload-mapping coverage instead. This file renders
+// through an actual createRouter()/RouterProvider tree with in-memory
+// history so the active/inactive aria-current behavior is exercised for
+// real.
+function buildRouter(options: {
+  initialPath: string;
+  linkProps?: Record<string, unknown>;
+  useNavLink?: boolean;
+  children?:
+    | React.ReactNode
+    | ((state: { isActive: boolean }) => React.ReactNode);
+}) {
+  // The Link lives on the always-rendered root component (not a route
+  // that's only matched at "/settings") so the "inactive link" case -
+  // sitting at "/" while linking to "/settings" - actually mounts it.
+  const rootRoute = createRootRoute({
+    component: () => {
+      const Component = options.useNavLink ? NavLink : Link;
+      return (
+        <Component to="/settings" {...(options.linkProps ?? {})}>
+          {options.children ?? 'Settings'}
+        </Component>
+      );
+    },
   });
-
-  it('defaults TanStack preload to viewport', () => {
-    render(<Link to="/settings">Settings</Link>);
-
-    expect(capturedPreloads).toEqual(['viewport']);
+  const homeRoute = createRoute({
+    getParentRoute: () => rootRoute,
+    path: '/',
+    component: () => null,
+  });
+  const settingsRoute = createRoute({
+    getParentRoute: () => rootRoute,
+    path: '/settings',
+    component: () => null,
   });
 
-  it('preserves explicit preload', () => {
-    render(
-      <Link to="/settings" prefetch="render" preload="intent">
-        Settings
-      </Link>,
-    );
+  const routeTree = rootRoute.addChildren([homeRoute, settingsRoute]);
 
-    expect(capturedPreloads).toEqual(['intent']);
+  return createRouter({
+    routeTree,
+    history: createMemoryHistory({ initialEntries: [options.initialPath] }),
+  });
+}
+
+async function renderLink(options: Parameters<typeof buildRouter>[0]) {
+  const router = buildRouter(options);
+  const utils = render(<RouterProvider router={router} />);
+
+  const anchor = await waitFor(() => {
+    const found = utils.container.querySelector('a[href="/settings"]');
+    if (!found) {
+      throw new Error('anchor not rendered yet');
+    }
+    return found as HTMLAnchorElement;
   });
 
-  it('preserves explicit disabled preload', () => {
-    render(
-      <Link to="/settings" prefetch="render" preload={false}>
-        Settings
-      </Link>,
-    );
+  return { anchor, ...utils };
+}
 
-    expect(capturedPreloads).toEqual([false]);
+describe('tanstack prefetch link adapter - aria-current override', () => {
+  it('defaults active link to aria-current="page" when caller passes nothing', async () => {
+    const { anchor } = await renderLink({ initialPath: '/settings' });
+    expect(anchor.getAttribute('aria-current')).toBe('page');
   });
 
-  it('maps none prefetch to disabled TanStack preload', () => {
-    render(
-      <Link to="/settings" prefetch="none">
-        Settings
-      </Link>,
-    );
-
-    expect(capturedPreloads).toEqual([false]);
+  it('lets caller aria-current="true" win over the TanStack-forced value', async () => {
+    const { anchor } = await renderLink({
+      initialPath: '/settings',
+      linkProps: { 'aria-current': 'true' },
+    });
+    expect(anchor.getAttribute('aria-current')).toBe('true');
+    expect(anchor.outerHTML.match(/aria-current=/g)).toHaveLength(1);
   });
 
-  it.each([
-    'intent',
-    'render',
-    'viewport',
-  ] as const)('maps %s prefetch to TanStack preload', prefetch => {
-    render(
-      <Link to="/settings" prefetch={prefetch}>
-        Settings
-      </Link>,
-    );
+  it('suppresses aria-current entirely when caller passes false', async () => {
+    const { anchor } = await renderLink({
+      initialPath: '/settings',
+      linkProps: { 'aria-current': false },
+    });
+    expect(anchor.hasAttribute('aria-current')).toBe(false);
+  });
 
-    expect(capturedPreloads).toEqual([prefetch]);
+  it('leaves an inactive link untouched when caller passes nothing', async () => {
+    const { anchor } = await renderLink({ initialPath: '/' });
+    expect(anchor.hasAttribute('aria-current')).toBe(false);
+    expect(anchor.getAttribute('data-status')).not.toBe('active');
   });
 
-  it('defaults NavLink preload to viewport', () => {
-    render(<NavLink to="/settings">Settings</NavLink>);
+  it('resolves render-prop children with the active state like TanStack Link', async () => {
+    const { anchor } = await renderLink({
+      initialPath: '/settings',
+      children: ({ isActive }: { isActive: boolean }) =>
+        isActive ? 'Active settings' : 'Settings',
+    });
+    expect(anchor.textContent).toBe('Active settings');
+  });
 
-    expect(capturedPreloads).toEqual(['viewport']);
+  it('resolves render-prop children as inactive on a non-matching route', async () => {
+    const { anchor } = await renderLink({
+      initialPath: '/',
+      children: ({ isActive }: { isActive: boolean }) =>
+        isActive ? 'Active settings' : 'Settings',
+    });
+    expect(anchor.textContent).toBe('Settings');
   });
 });

package/tests/router/prefetchLinkPreload.test.tsx

@@ -0,0 +1,85 @@
+import { render } from '@testing-library/react';
+import React from 'react';
+import { Link, NavLink } from '../../src/runtime/prefetchLink';
+
+type CapturedOptions = {
+  preload?: unknown;
+};
+
+type MockLinkAnchorProps = Record<string, unknown> & {
+  href?: string;
+  ref?: unknown;
+};
+
+let capturedOptions: CapturedOptions[] = [];
+let mockReturnProps: MockLinkAnchorProps = { href: '/settings' };
+
+rstest.mock('@tanstack/react-router', () => ({
+  useLinkProps: (options: CapturedOptions) => {
+    capturedOptions.push(options);
+    return mockReturnProps;
+  },
+}));
+
+describe('tanstack prefetch link adapter - preload mapping', () => {
+  beforeEach(() => {
+    capturedOptions = [];
+    mockReturnProps = { href: '/settings' };
+  });
+
+  it('defaults TanStack preload to viewport', () => {
+    render(<Link to="/settings">Settings</Link>);
+
+    expect(capturedOptions.map(o => o.preload)).toEqual(['viewport']);
+  });
+
+  it('preserves explicit preload', () => {
+    render(
+      <Link to="/settings" prefetch="render" preload="intent">
+        Settings
+      </Link>,
+    );
+
+    expect(capturedOptions.map(o => o.preload)).toEqual(['intent']);
+  });
+
+  it('preserves explicit disabled preload', () => {
+    render(
+      <Link to="/settings" prefetch="render" preload={false}>
+        Settings
+      </Link>,
+    );
+
+    expect(capturedOptions.map(o => o.preload)).toEqual([false]);
+  });
+
+  it('maps none prefetch to disabled TanStack preload', () => {
+    render(
+      <Link to="/settings" prefetch="none">
+        Settings
+      </Link>,
+    );
+
+    expect(capturedOptions.map(o => o.preload)).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(capturedOptions.map(o => o.preload)).toEqual([prefetch]);
+  });
+
+  it('defaults NavLink preload to viewport', () => {
+    render(<NavLink to="/settings">Settings</NavLink>);
+
+    expect(capturedOptions.map(o => o.preload)).toEqual(['viewport']);
+  });
+});

package/tests/router/routeTree.test.ts

@@ -15,7 +15,7 @@ import {
   getModernRouteIdsFromMatches,
 } from '../../src/runtime/routeTree';
 import { __setTanstackRscPayloadDecoderForTests } from '../../src/runtime/rsc/payloadRouter';
-import { createRouteObjectsFromConfig } from '../../src/runtime/utils';
+import { createTanstackRouteObjectsFromConfig } from '../../src/runtime/utils';
 
 type LoaderArgs = {
   params: Record<string, string>;
@@ -151,15 +151,15 @@ describe('tanstack runtime public exports', () => {
     };
 
     expect(packageJson.exports['./runtime/rsc']).toBeUndefined();
-    expect(packageJson.exports['./runtime/rsc/client']).toBeUndefined();
-    expect(packageJson.exports['./runtime/rsc/server']).toBeUndefined();
+    expect(packageJson.exports['./runtime/rsc/client']).toBeDefined();
+    expect(packageJson.exports['./runtime/rsc/server']).toBeDefined();
     expect(packageJson.typesVersions?.['*']?.['runtime/rsc']).toBeUndefined();
-    expect(
-      packageJson.typesVersions?.['*']?.['runtime/rsc/client'],
-    ).toBeUndefined();
-    expect(
-      packageJson.typesVersions?.['*']?.['runtime/rsc/server'],
-    ).toBeUndefined();
+    expect(packageJson.typesVersions?.['*']?.['runtime/rsc/client']).toEqual([
+      './dist/types/runtime/rsc/client.d.ts',
+    ]);
+    expect(packageJson.typesVersions?.['*']?.['runtime/rsc/server']).toEqual([
+      './dist/types/runtime/rsc/server.d.ts',
+    ]);
   });
 });
 
@@ -201,6 +201,41 @@ describe('tanstack route tree from RouteObject[]', () => {
     expect(userMatch?.loaderData).toEqual({ id: '123' });
   });
 
+  test('keeps unnamed sibling pathless layouts distinct', async () => {
+    const routes: RouteObject[] = [
+      {
+        Component: () => null,
+        children: [
+          {
+            path: 'alpha',
+            loader: () => ({ value: 'alpha' }),
+            Component: () => null,
+          },
+        ],
+      },
+      {
+        Component: () => null,
+        children: [
+          {
+            path: 'beta',
+            loader: () => ({ value: 'beta' }),
+            Component: () => null,
+          },
+        ],
+      },
+    ];
+
+    const routeTree = createRouteTreeFromRouteObjects(routes);
+    const router = await loadRouteTree(routeTree, '/beta');
+
+    const matchedLoaderData = router.state.matches
+      .map(match => match.loaderData)
+      .filter(Boolean);
+
+    expect(matchedLoaderData).toContainEqual({ value: 'beta' });
+    expect(matchedLoaderData).not.toContainEqual({ value: 'alpha' });
+  });
+
   test('reports native TanStack unknown routes as HTTP 404', async () => {
     const routes: RouteObject[] = [
       {
@@ -780,7 +815,7 @@ describe('tanstack route tree from RouteObject[]', () => {
         ],
       },
     ];
-    const routeObjects = createRouteObjectsFromConfig({
+    const routeObjects = createTanstackRouteObjectsFromConfig({
       routesConfig: { routes: modernRoutes },
     });
     const routeTree = createRouteTreeFromRouteObjects(routeObjects || []);
@@ -825,7 +860,7 @@ describe('tanstack route tree from RouteObject[]', () => {
       },
     ];
 
-    const routeObjects = createRouteObjectsFromConfig({
+    const routeObjects = createTanstackRouteObjectsFromConfig({
       routesConfig: { routes: modernRoutes },
     });
     const rootRoute = routeObjects?.[0];

package/tests/router/rsc.test.tsx

@@ -2,6 +2,10 @@ import { UNSAFE_ErrorResponseImpl as ErrorResponseImpl } from '@modern-js/runtim
 import type React from 'react';
 import { isValidElement } from 'react';
 import { createRscProxy } from '../../src/runtime/rsc/createRscProxy';
+import {
+  reviveTanstackRscFlightValues,
+  serializeTanstackRscFlightValues,
+} from '../../src/runtime/rsc/flightSerialization';
 import {
   __setTanstackRscPayloadDecoderForTests,
   createTanstackRscServerPayload,
@@ -65,6 +69,54 @@ describe('tanstack rsc runtime helpers', () => {
     ]);
   });
 
+  test('revives shared structures that the Flight serializer preserves', async () => {
+    const shared = { label: 'shared' };
+    const serialized = serializeTanstackRscFlightValues({
+      left: shared,
+      right: shared,
+    }) as { left: unknown; right: unknown };
+
+    const revived = (await reviveTanstackRscFlightValues(serialized)) as {
+      left: unknown;
+      right: unknown;
+    };
+
+    expect(serialized.left).toBe(serialized.right);
+    expect(revived.left).toBe(revived.right);
+  });
+
+  test('serializes TanStack RSC flight values nested in map and set containers', () => {
+    const stream: ServerComponentStream = {
+      createReplayStream: () => new ReadableStream<Uint8Array>(),
+    };
+    const proxy = createRscProxy(() => null, {
+      renderable: true,
+      stream,
+    }) as React.ReactElement & Record<PropertyKey, unknown>;
+
+    const serialized = serializeTanstackRscFlightValues({
+      map: new Map([['slot', proxy]]),
+      set: new Set([proxy]),
+    }) as {
+      map: Map<string, Record<string, unknown>>;
+      set: Set<Record<string, unknown>>;
+    };
+
+    const mapValue = serialized.map.get('slot');
+    const [setValue] = serialized.set;
+
+    expect(mapValue).not.toBe(proxy);
+    expect(setValue).not.toBe(proxy);
+    expect(mapValue).toMatchObject({
+      __modernTanstackRsc: true,
+      kind: 'renderable',
+    });
+    expect(setValue).toMatchObject({
+      __modernTanstackRsc: true,
+      kind: 'renderable',
+    });
+  });
+
   test('renderable RSC proxies preserve React element behavior and metadata', () => {
     const stream: ServerComponentStream = {
       createReplayStream: () => new ReadableStream<Uint8Array>(),
@@ -219,6 +271,36 @@ describe('tanstack rsc runtime helpers', () => {
     expect(JSON.stringify(payload.errors)).not.toContain('stack secret');
   });
 
+  test('redacts production TanStack RSC non-Error server payload errors', () => {
+    const payload = withNodeEnv('production', () =>
+      createTanstackRscServerPayload({
+        state: {
+          location: { href: '/plain' },
+          matches: [
+            {
+              error: { message: 'plain secret', token: 'token secret' },
+              params: {},
+              pathname: '/plain',
+              pathnameBase: '/plain',
+              route: { id: '/plain' },
+              routeId: '/plain',
+            },
+          ],
+        },
+      }),
+    );
+
+    expect(payload.errors).toMatchObject({
+      '/plain': {
+        message: 'Unexpected Server Error',
+        stack: undefined,
+        __type: 'Error',
+      },
+    });
+    expect(JSON.stringify(payload.errors)).not.toContain('plain secret');
+    expect(JSON.stringify(payload.errors)).not.toContain('token secret');
+  });
+
   test('converts TanStack RSC redirects to Modern RSC navigation headers', () => {
     const response = handleTanstackRscRedirect(
       new Headers({ Location: '/base/login' }),
@@ -232,6 +314,54 @@ describe('tanstack rsc runtime helpers', () => {
     expect(response.headers.get('X-Modernjs-BaseUrl')).toBe('/base');
   });
 
+  test('preserves TanStack RSC redirect paths that do not start with the basename', () => {
+    const response = handleTanstackRscRedirect(
+      new Headers({ Location: '/shop/base/login' }),
+      '/base',
+      302,
+    );
+
+    expect(response.headers.get('X-Modernjs-Redirect')).toBe(
+      '/shop/base/login',
+    );
+  });
+
+  test('preserves RSC redirect response status and headers in TanStack redirects', async () => {
+    rstest.stubGlobal(
+      'fetch',
+      rstest.fn(() =>
+        Promise.resolve(
+          new Response(null, {
+            headers: {
+              'X-Modernjs-Redirect': '/login',
+              'X-Trace': 'preserved',
+            },
+            status: 308,
+          }),
+        ),
+      ),
+    );
+
+    const thrown = (await loadTanstackRscRouteData({
+      loadClientData: async () => ({ fallback: true }),
+      request: new Request('http://localhost/products'),
+      routeId: '/products',
+    }).then(
+      () => {
+        throw new Error('expected redirect');
+      },
+      err => err,
+    )) as Response & {
+      options?: { statusCode?: number; to?: string };
+    };
+
+    expect(thrown).toBeInstanceOf(Response);
+    expect(thrown.status).toBe(308);
+    expect(thrown.headers.get('X-Trace')).toBe('preserved');
+    expect(thrown.options?.statusCode).toBe(308);
+    expect(thrown.options?.to).toBe('/login');
+  });
+
   test('loads one RSC payload for multiple server route loaders', async () => {
     const payload = {
       type: 'render',
@@ -275,6 +405,65 @@ describe('tanstack rsc runtime helpers', () => {
     expect(decodeMock).toHaveBeenCalledTimes(1);
   });
 
+  test('separates RSC payload cache entries by forwarded request headers', async () => {
+    const payloadByUser: Record<string, unknown> = {
+      alice: {
+        type: 'render',
+        actionData: null,
+        errors: null,
+        loaderData: {
+          '/profile': { user: 'alice' },
+        },
+        location: { href: '/profile' },
+        routes: [{ id: '/profile', hasLoader: true }],
+      },
+      bob: {
+        type: 'render',
+        actionData: null,
+        errors: null,
+        loaderData: {
+          '/profile': { user: 'bob' },
+        },
+        location: { href: '/profile' },
+        routes: [{ id: '/profile', hasLoader: true }],
+      },
+    };
+    const fetchMock = rstest.fn(
+      (_url: string | URL | Request, init?: RequestInit) => {
+        const user =
+          init?.headers instanceof Headers ? init.headers.get('x-user') : null;
+        return Promise.resolve(
+          new Response(JSON.stringify(payloadByUser[user || ''])),
+        );
+      },
+    );
+    rstest.stubGlobal('fetch', fetchMock);
+    __setTanstackRscPayloadDecoderForTests(async stream =>
+      JSON.parse(await new Response(stream).text()),
+    );
+
+    const [aliceData, bobData] = await Promise.all([
+      loadTanstackRscRouteData({
+        loadClientData: async () => ({ fallback: 'alice' }),
+        request: new Request('http://localhost/profile', {
+          headers: { 'x-user': 'alice' },
+        }),
+        routeId: '/profile',
+      }),
+      loadTanstackRscRouteData({
+        loadClientData: async () => ({ fallback: 'bob' }),
+        request: new Request('http://localhost/profile', {
+          headers: { 'x-user': 'bob' },
+        }),
+        routeId: '/profile',
+      }),
+    ]);
+
+    expect(aliceData).toEqual({ user: 'alice' });
+    expect(bobData).toEqual({ user: 'bob' });
+    expect(fetchMock).toHaveBeenCalledTimes(2);
+  });
+
   test('uses client loader data without requesting an RSC payload for client-loader routes', async () => {
     const fetchMock = rstest.fn();
     const loadClientData = rstest.fn(async () => ({ client: true }));

package/tests/router/ssrPreload.test.ts

@@ -0,0 +1,30 @@
+import { preloadMatchedRouteComponents } from '../../src/runtime/ssrPreload';
+
+describe('preloadMatchedRouteComponents', () => {
+  test('preloads each component identity once per SSR pass', async () => {
+    const sharedComponent = Object.assign(() => null, {
+      preload: rstest.fn(),
+    });
+
+    await preloadMatchedRouteComponents({
+      routesById: {
+        child: {
+          options: {
+            component: sharedComponent,
+          },
+        },
+        root: {
+          options: {
+            component: sharedComponent,
+            pendingComponent: sharedComponent,
+          },
+        },
+      },
+      state: {
+        matches: [{ routeId: 'root' }, { routeId: 'child' }],
+      },
+    } as never);
+
+    expect(sharedComponent.preload).toHaveBeenCalledTimes(1);
+  });
+});