@bleedingdev/modern-js-plugin-tanstack 3.9.0-ultramodern.11 → 3.9.0-ultramodern.13

package/tests/router/generateRouteArtifacts.test.ts

@@ -5,7 +5,9 @@ const createRunOptionsMock = rstest.fn(async (options: unknown) => ({
   mockRunOptions: true,
   received: options,
 }));
-const cliInitMock = rstest.fn(async () => ({ appContext: {} }));
+const cliInitMock = rstest.fn(async () => ({
+  appContext: { hooks: { onBeforeExit: { call: async () => {} } } },
+}));
 
 rstest.mock('@modern-js/app-tools/cli/run', () => ({
   createRunOptions: createRunOptionsMock,
@@ -17,6 +19,7 @@ rstest.mock('@modern-js/plugin/cli', () => ({
 import fs from 'node:fs';
 import os from 'node:os';
 import path from 'node:path';
+import { createAsyncHook } from '@modern-js/plugin';
 import { INTERNAL_RUNTIME_PLUGINS } from '@modern-js/utils';
 import {
   generateTanstackRouteArtifacts,
@@ -63,6 +66,12 @@ describe('generateTanstackRouteArtifacts (headless routes-generate)', () => {
       mockRunOptions: true,
       received: runOptions,
     });
+    const onBeforeExit = createAsyncHook<() => Promise<void>>();
+    let disposed = false;
+    onBeforeExit.tap(async () => {
+      await Promise.resolve();
+      disposed = true;
+    });
     cliInitMock.mockImplementation(async () => {
       await writeTanstackRouterTypesForEntries({
         appContext: {
@@ -88,7 +97,7 @@ describe('generateTanstackRouteArtifacts (headless routes-generate)', () => {
           ] as any,
         },
       });
-      return { appContext: {} };
+      return { appContext: { hooks: { onBeforeExit } } };
     });
 
     try {
@@ -110,6 +119,7 @@ describe('generateTanstackRouteArtifacts (headless routes-generate)', () => {
       );
 
       expect(cliInitMock).toHaveBeenCalledTimes(1);
+      expect(disposed).toBe(true);
 
       expect(
         fs.existsSync(
@@ -131,6 +141,30 @@ describe('generateTanstackRouteArtifacts (headless routes-generate)', () => {
     }
   });
 
+  it('preserves initialization and cleanup failures', async () => {
+    const appDirectory = makeAppDir(true);
+    const initializationFailure = new Error('prepare failed');
+    const cleanupFailure = new Error('dispose failed');
+    const onBeforeExit = createAsyncHook<() => Promise<void>>();
+    onBeforeExit.tap(async () => {
+      throw cleanupFailure;
+    });
+    try {
+      cliInitMock.mockRejectedValueOnce(initializationFailure);
+      await expect(
+        generateTanstackRouteArtifacts({ appDirectory }),
+      ).rejects.toBe(initializationFailure);
+      cliInitMock.mockResolvedValueOnce({
+        appContext: { hooks: { onBeforeExit } },
+      });
+      await expect(
+        generateTanstackRouteArtifacts({ appDirectory }),
+      ).rejects.toBe(cleanupFailure);
+    } finally {
+      fs.rmSync(appDirectory, { force: true, recursive: true });
+    }
+  });
+
   it('throws a clear error when no config file exists', async () => {
     const appDirectory = makeAppDir(false);
 

package/tests/router/localisedIdentity.test.tsx

@@ -12,6 +12,7 @@ import { renderToString } from 'react-dom/server';
 import { createModernBasepathRewrite } from '../../src/runtime/basepathRewrite';
 import { createRouteTreeFromRouteObjects } from '../../src/runtime/routeTree';
 import { createTanstackRouteObjectsFromConfig } from '../../src/runtime/utils';
+import { navigateOnClient } from './clientNavigation';
 
 function SearchPage() {
   const data = useLoaderData({ from: '/$lang/search' }) as { language: string };
@@ -55,6 +56,7 @@ test('localized URLs preserve native loader and params route identity in SSR and
       '/search': { en: '/find', cs: '/hledat' },
       '/resources/:id': { en: '/resources/:id', cs: '/zdroje/:id' },
     },
+    'canonical',
   );
   const routeObjects = createTanstackRouteObjectsFromConfig({
     routesConfig: { routes },
@@ -79,14 +81,17 @@ test('localized URLs preserve native loader and params route identity in SSR and
   );
   expect(history.location.href).toBe('/base/cs/hledat?q=tractor#results');
 
-  await router.navigate({ to: '/en/search', search: { q: 'tractor' } });
+  await navigateOnClient(router, {
+    to: '/en/search',
+    search: { q: 'tractor' },
+  });
   expect(history.location.href).toBe('/base/en/find?q=tractor');
   expect(router.state.matches.at(-1)?.routeId).toBe('/$lang/search');
   expect(renderToString(createElement(RouterProvider, { router }))).toContain(
     'search:en',
   );
 
-  await router.navigate({ to: '/cs/zdroje/a%2Fb' });
+  await navigateOnClient(router, { to: '/cs/zdroje/a%2Fb' });
   expect(history.location.href).toBe('/base/cs/zdroje/a%2Fb');
   expect(router.state.matches.at(-1)?.routeId).toBe('/$lang/resources/$id');
   expect(renderToString(createElement(RouterProvider, { router }))).toContain(

package/tests/router/prefetchLink.test.tsx

@@ -7,6 +7,7 @@ import {
 } from '@tanstack/react-router';
 import { act, render, waitFor } from '@testing-library/react';
 import React from 'react';
+import { createTanstackNavigation } from '../../src/runtime/navigation';
 import { Link, NavLink } from '../../src/runtime/prefetchLink';
 
 // Real-router harness (no module mocking): STATIC_ACTIVE_PROPS (the
@@ -120,3 +121,31 @@ describe('tanstack prefetch link adapter - aria-current override', () => {
     expect(ref.current).toBe(anchor);
   });
 });
+
+test('provider navigation observes native navigation and preserves history state', async () => {
+  const { router, unmount } = await renderLink({ initialPath: '/' });
+  const capability = createTanstackNavigation(router);
+  const initial = capability.getSnapshot();
+  expect(capability.getSnapshot()).toBe(initial);
+  const listener = rstest.fn();
+  const stop = capability.subscribe(listener);
+  await act(() =>
+    capability.navigate('/settings?q=two#detail', {
+      replace: true,
+      state: { custom: true },
+    }),
+  );
+  expect(listener).toHaveBeenCalled();
+  expect(capability.getSnapshot().location).toEqual({
+    pathname: '/settings',
+    search: '?q=two',
+    hash: '#detail',
+  });
+  expect(router.state.location.state).toMatchObject({ custom: true });
+  expect(router.history.length).toBe(1);
+  stop();
+  listener.mockClear();
+  await act(() => capability.navigate('/'));
+  expect(listener).not.toHaveBeenCalled();
+  unmount();
+});

package/tests/router/routeHooks.test.ts

@@ -8,6 +8,7 @@ import {
 import React from 'react';
 import { renderToString } from 'react-dom/server';
 import { useMatches } from '../../src/runtime/routeHooks';
+import { navigateOnClient } from './clientNavigation';
 
 function MatchIds() {
   const matches = useMatches();
@@ -41,7 +42,7 @@ test('updates whole match objects after navigation with the structural-sharing g
     renderToString(React.createElement(RouterProvider, { router })),
   ).toContain('__root__');
 
-  await router.navigate({ to: '/settings' });
+  await navigateOnClient(router, { to: '/settings' });
 
   expect(
     renderToString(React.createElement(RouterProvider, { router })),

package/tests/router/serverPlugin.test.ts

@@ -9,6 +9,8 @@ import {
 } from '../../src/runtime/lifecycle';
 import { tanstackRouterPlugin } from '../../src/runtime/plugin.node';
 import type { TanstackRouterPluginAPI } from '../../src/runtime/pluginShared';
+import * as ssrUtils from '../../src/runtime/ssrManagedTags';
+import * as ssrPreload from '../../src/runtime/ssrPreload';
 import type { RouterConfig } from '../../src/runtime/types';
 
 type BeforeRenderListener = Parameters<
@@ -116,6 +118,11 @@ describe('tanstack server plugin router results', () => {
       framework: 'tanstack',
       statusCode: 200,
     });
+    // Without the dehydrated router the client re-renders matched remotes
+    // from scratch instead of hydrating the server HTML.
+    expect(getRouterServerSnapshot(context)?.hydrationScripts).toEqual(
+      expect.arrayContaining([expect.stringContaining('$_TSR')]),
+    );
   });
 
   test('interrupts SSR with the router redirect response', async () => {
@@ -155,3 +162,146 @@ describe('tanstack server plugin router results', () => {
     expect(status).not.toHaveBeenCalled();
   });
 });
+
+describe('TanStack preparation resource lifetime', () => {
+  test.each([
+    'attach',
+    'load',
+    'result',
+    'preload',
+    'dehydrate',
+    'abort',
+    'clientRender',
+    'afterCreate',
+  ])('disposes exactly once when %s fails', async stage => {
+    const failure = new Error(`${stage} failed`);
+    const cleanup = rstest.fn();
+    const controller = new AbortController();
+    const { context } = createServerContext('/');
+    context.ssrContext!.request.raw = new Request('http://localhost/', {
+      signal: controller.signal,
+    });
+    const attach = ssrUtils.attachServerSsrUtils;
+    rstest
+      .spyOn(ssrUtils, 'attachServerSsrUtils')
+      .mockImplementation(async router => {
+        await attach(router);
+        rstest.spyOn(router.serverSsr!, 'cleanup').mockImplementation(cleanup);
+        if (stage === 'attach') throw failure;
+        if (stage === 'load')
+          rstest.spyOn(router, 'load').mockRejectedValue(failure);
+        if (stage === 'result')
+          rstest.spyOn(router, 'load').mockResolvedValue(undefined);
+        if (stage === 'dehydrate')
+          rstest
+            .spyOn(router.serverSsr!, 'dehydrate')
+            .mockRejectedValue(failure);
+        if (stage === 'abort') controller.abort(failure);
+      });
+    if (stage === 'clientRender') {
+      context.ssrContext!.loaderFailureMode = 'clientRender';
+      rstest
+        .spyOn(ssrUtils, 'collectRouterErrors')
+        .mockReturnValue({ root: failure });
+    }
+    if (stage === 'afterCreate')
+      rstest
+        .spyOn(routerProviderRegistryHooks.onAfterCreateRouter, 'call')
+        .mockImplementation(() => {
+          throw failure;
+        });
+    if (stage === 'preload')
+      rstest
+        .spyOn(ssrPreload, 'preloadMatchedRouteComponents')
+        .mockRejectedValue(failure);
+    const beforeRender = collectBeforeRender(() => [
+      { id: 'root', path: '/', Component: () => null },
+    ]);
+    await expect(beforeRender(context, value => value)).rejects.toThrow(
+      stage === 'result' ? 'without a server result' : failure.message,
+    );
+    expect(cleanup).toHaveBeenCalledTimes(1);
+    await getRouterRuntimeState(context)?.cleanup?.();
+    expect(cleanup).toHaveBeenCalledTimes(1);
+  });
+
+  test.each([
+    'string',
+    'stream',
+  ] as const)('retains %s router resources for response termination', async mode => {
+    const { context } = createServerContext('/products/shoe?q=1#detail');
+    context.ssrContext!.mode = mode;
+    const beforeRender = collectBeforeRender(() => [
+      { id: 'product', path: '/products/:id', Component: () => null },
+    ]);
+    await beforeRender(context, value => value);
+    const state = getRouterRuntimeState(context)!;
+    const router = state.instance as AnyRouter;
+    const cleanup = rstest.spyOn(router.serverSsr!, 'cleanup');
+    const navigation = state.navigation!;
+    expect(navigation.getSnapshot()).toMatchObject({
+      location: { pathname: '/products/shoe', search: '?q=1', hash: '#detail' },
+      params: { id: 'shoe' },
+    });
+    expect(navigation.getSnapshot()).toBe(navigation.getSnapshot());
+    expect(navigation.Link).toBe(context.router?.Link);
+    expect(
+      navigation.createLinkProps!({
+        pathname: '/products/shoe',
+        href: '/products/shoe?q=2#detail',
+        search: { q: '2' },
+        hash: 'detail',
+        hashScrollIntoView: false,
+        prefetch: 'none',
+      }),
+    ).toEqual({
+      to: '/products/shoe',
+      search: { q: '2' },
+      hash: 'detail',
+      hashScrollIntoView: false,
+      preload: false,
+    });
+    expect(cleanup).not.toHaveBeenCalled();
+    await state.cleanup?.();
+    await state.cleanup?.();
+    expect(cleanup).toHaveBeenCalledTimes(1);
+  });
+});
+
+test('incoming abort reaches an active Modern loader and disposes its router', async () => {
+  const incoming = new AbortController();
+  let started!: () => void;
+  const loading = new Promise<void>(resolve => {
+    started = resolve;
+  });
+  const { context } = createServerContext('/');
+  context.ssrContext!.request.raw = new Request('http://localhost/', {
+    signal: incoming.signal,
+  });
+  const failure = new Error('client disconnected during loader');
+  const beforeRender = collectBeforeRender(() => [
+    {
+      id: 'root',
+      path: '/',
+      Component: () => null,
+      loader: ({ request }: { request: Request }) =>
+        new Promise((_resolve, reject) => {
+          request.signal.addEventListener(
+            'abort',
+            () => reject(request.signal.reason),
+            { once: true },
+          );
+          started();
+        }),
+    },
+  ]);
+  const pending = beforeRender(context, value => value);
+  await loading;
+  const router = getRouterRuntimeState(context)!.instance as AnyRouter;
+  const cleanup = rstest.spyOn(router.serverSsr!, 'cleanup');
+  incoming.abort(failure);
+  await expect(pending).rejects.toBe(failure);
+  expect(cleanup).toHaveBeenCalledTimes(1);
+  await getRouterRuntimeState(context)?.cleanup?.();
+  expect(cleanup).toHaveBeenCalledTimes(1);
+});

package/tests/router/tanstackTypes.test.ts

@@ -1,14 +1,20 @@
 import { execFile } from 'node:child_process';
-import { mkdir, mkdtemp, rm, writeFile } from 'node:fs/promises';
+import { mkdir, mkdtemp, rm, symlink, writeFile } from 'node:fs/promises';
 import { tmpdir } from 'node:os';
 import path from 'node:path';
+import { pathToFileURL } from 'node:url';
 import { promisify } from 'node:util';
-
+import { applyLocalisedUrlsToRoutes } from '@modern-js/i18n-runtime-extensions';
+import { createMemoryHistory, createRouter } from '@tanstack/react-router';
 import { writeTanstackRegisterFile } from '../../src/cli/artifacts';
 import {
   collectCanonicalRoutesForEntry,
   generateTanstackRouterTypesSourceForEntry,
 } from '../../src/cli/tanstackTypes';
+import { createModernBasepathRewrite } from '../../src/runtime/basepathRewrite';
+import { createRouteTreeFromRouteObjects } from '../../src/runtime/routeTree';
+import { createTanstackRouteObjectsFromConfig } from '../../src/runtime/utils';
+import { navigateOnClient } from './clientNavigation';
 
 const execFileAsync = promisify(execFile);
 const strictestTsconfigPath = path.resolve(
@@ -261,6 +267,119 @@ describe('tanstack router type generation', () => {
     });
   });
 
+  test('generated and runtime trees agree on localized splats, root siblings, layouts and params', async () => {
+    tempDir = await mkdtemp(path.join(tmpdir(), 'modern-tanstack-parity-'));
+    const localized = applyLocalisedUrlsToRoutes(
+      [
+        {
+          type: 'nested',
+          id: 'lang',
+          path: ':lang',
+          children: [
+            {
+              type: 'nested',
+              id: 'products',
+              path: 'products',
+              children: [{ type: 'nested', id: 'product-files', path: '*' }],
+            },
+            { type: 'nested', id: 'fallback', path: '*' },
+          ],
+        },
+      ],
+      ['en', 'cs'],
+      { '/products': { en: '/products', cs: '/produkty' } },
+      'canonical',
+    );
+    const routes = [
+      {
+        type: 'nested',
+        id: 'layout',
+        isRoot: true,
+        children: [
+          ...localized,
+          {
+            type: 'nested',
+            children: [{ type: 'nested', path: 'one/:id?', index: false }],
+          },
+          { type: 'nested', children: [{ type: 'nested', path: 'two/*' }] },
+          { type: 'nested', id: 'index', index: true },
+        ],
+      },
+      { type: 'nested', id: 'sibling', path: 'outside/:lang' },
+    ] as any;
+    const { routerGenTs } = await generateTanstackRouterTypesSourceForEntry({
+      appContext: {
+        srcDirectory: path.join(tempDir, 'src'),
+        internalSrcAlias: '@/_',
+      } as any,
+      entryName: 'parity',
+      routes,
+    });
+    const generated = path.join(tempDir, 'router.gen.ts');
+    await writeFile(generated, routerGenTs);
+    const modules = path.join(tempDir, 'node_modules', '@modern-js');
+    await mkdir(modules, { recursive: true });
+    await symlink(
+      path.resolve(__dirname, '../..'),
+      path.join(modules, 'plugin-tanstack'),
+      'junction',
+    );
+    const { stdout } = await execFileAsync(process.execPath, [
+      '--input-type=module',
+      '--eval',
+      `
+      import { router } from ${JSON.stringify(pathToFileURL(generated).href)};
+      import { createModernBasepathRewrite } from ${JSON.stringify(pathToFileURL(path.resolve(__dirname, '../../dist/esm/runtime/basepathRewrite.mjs')).href)};
+      router.update({ rewrite: createModernBasepathRewrite('/base', false, ${JSON.stringify(routes)}) });
+      router.history.push(router.buildLocation({ to: '/cs/produkty/a/b', search: { q: 'tractor' }, hash: 'files' }).publicHref); router.updateLatestLocation(); await router.load();
+      console.log(JSON.stringify({ ids: Object.keys(router.routesById).sort(), match: router.state.matches.at(-1).routeId, params: router.state.matches.at(-1).params, href: router.history.location.href }));
+    `,
+    ]);
+    const routeObjects = createTanstackRouteObjectsFromConfig({
+      routesConfig: { routes },
+    })!;
+    const runtime = createRouter({
+      routeTree: createRouteTreeFromRouteObjects(routeObjects),
+      history: createMemoryHistory({
+        initialEntries: ['/base/cs/produkty/a/b?q=tractor#files'],
+      }),
+      rewrite: createModernBasepathRewrite('/base', false, routeObjects),
+    });
+    await runtime.load();
+    expect(JSON.parse(stdout)).toEqual({
+      ids: Object.keys(runtime.routesById).sort(),
+      match: runtime.state.matches.at(-1)?.routeId,
+      params: runtime.state.matches.at(-1)?.params,
+      href: runtime.history.location.href,
+    });
+    expect(runtime.state.matches.at(-1)?.routeId).toBe('/$lang/products/$');
+    expect(runtime.state.matches.at(-1)?.params).toMatchObject({
+      lang: 'cs',
+      _splat: 'a/b',
+    });
+    await navigateOnClient(runtime, { to: '/cs/missing/path' });
+    expect(runtime.state.matches.at(-1)?.routeId).toBe('/$lang/$');
+    expect(runtime.state.matches.at(-1)?.params).toMatchObject({
+      lang: 'cs',
+      _splat: 'missing/path',
+    });
+    await navigateOnClient(runtime, { to: '/outside/cs' });
+    expect(runtime.state.matches.at(-1)?.params).toEqual({ lang: 'cs' });
+    const canonicalRoutes = collectCanonicalRoutesForEntry(localized as any)!;
+    expect(Object.keys(canonicalRoutes)).toEqual(['/$', '/products/$']);
+    await typecheckCanonicalRegisterContract({
+      projectDirectory: tempDir,
+      canonicalRoutes,
+      contractLines: [
+        "const product: UltramodernCanonicalRoutes['/products/$'] = { _splat: 'a/b' };",
+        "const fallback: UltramodernCanonicalRoutes['/$'] = { _splat: 'unknown/path' };",
+        '// @ts-expect-error splat remains a string',
+        "const invalid: UltramodernCanonicalRoutes['/products/$'] = { _splat: 42 };",
+        'void product; void fallback; void invalid;',
+      ],
+    });
+  });
+
   test('maps a locale-prefixed route tree to the canonical paths consumers navigate to', () => {
     const routes = [
       {

package/dist/esm/rslib-runtime~1.mjs

@@ -1,18 +0,0 @@
-var __webpack_modules__ = {};
-var __webpack_module_cache__ = {};
-function __webpack_require__(moduleId) {
-    var cachedModule = __webpack_module_cache__[moduleId];
-    if (void 0 !== cachedModule) return cachedModule.exports;
-    var module = __webpack_module_cache__[moduleId] = {
-        exports: {}
-    };
-    __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
-    return module.exports;
-}
-__webpack_require__.m = __webpack_modules__;
-(()=>{
-    __webpack_require__.add = function(modules) {
-        Object.assign(__webpack_require__.m, modules);
-    };
-})();
-export { __webpack_require__ };

package/dist/esm-node/rslib-runtime~0.mjs

@@ -1,19 +0,0 @@
-import "node:module";
-var __webpack_modules__ = {};
-var __webpack_module_cache__ = {};
-function __webpack_require__(moduleId) {
-    var cachedModule = __webpack_module_cache__[moduleId];
-    if (void 0 !== cachedModule) return cachedModule.exports;
-    var module = __webpack_module_cache__[moduleId] = {
-        exports: {}
-    };
-    __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
-    return module.exports;
-}
-__webpack_require__.m = __webpack_modules__;
-(()=>{
-    __webpack_require__.add = function(modules) {
-        Object.assign(__webpack_require__.m, modules);
-    };
-})();
-export { __webpack_require__ };