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

package/tests/router/cli.test.ts

@@ -1,9 +1,12 @@
 import { mkdir, mkdtemp, readFile, rm } from 'node:fs/promises';
 import { tmpdir } from 'node:os';
 import path from 'node:path';
+import { mergeConfig } from '@modern-js/plugin/cli';
 import type { Entrypoint } from '@modern-js/types';
 import { fs, NESTED_ROUTE_SPEC_FILE } from '@modern-js/utils';
 import {
+  createTanstackRsbuildRouteSplittingProfile,
+  isTanstackStartRouteModuleSource,
   tanstackRouterPlugin,
   writeTanstackRegisterFile,
   writeTanstackRouterTypesForEntries,
@@ -120,6 +123,82 @@ describe('tanstack router cli plugin', () => {
     );
   });
 
+  test('writes plugin-i18n module augmentation when canonicalRoutes are provided', async () => {
+    tempDir = await mkdtemp(path.join(tmpdir(), 'modern-tanstack-cli-'));
+    const srcDirectory = path.join(tempDir, 'src');
+
+    await writeTanstackRegisterFile({
+      entries: ['main'],
+      generatedDirName: 'tanstack',
+      srcDirectory,
+      canonicalRoutes: {
+        '/': 'Record<string, never>',
+        '/products/$slug': '{ "slug": string }',
+      },
+    });
+
+    const register = await readFile(
+      path.join(srcDirectory, 'tanstack', 'register.gen.d.ts'),
+      'utf-8',
+    );
+
+    expect(register).toContain(
+      "declare module '@modern-js/plugin-i18n/runtime'",
+    );
+    expect(register).toContain('interface UltramodernCanonicalRoutes');
+    expect(register).toContain("'/': Record<string, never>;");
+    expect(register).toContain('\'/products/$slug\': { "slug": string };');
+  });
+
+  test('does not emit plugin-i18n augmentation when canonicalRoutes is absent (back-compat)', async () => {
+    tempDir = await mkdtemp(path.join(tmpdir(), 'modern-tanstack-cli-'));
+    const srcDirectory = path.join(tempDir, 'src');
+
+    await writeTanstackRegisterFile({
+      entries: ['main'],
+      generatedDirName: 'tanstack',
+      srcDirectory,
+      // No canonicalRoutes provided at all — plain TanStack app
+    });
+
+    const register = await readFile(
+      path.join(srcDirectory, 'tanstack', 'register.gen.d.ts'),
+      'utf-8',
+    );
+
+    expect(register).not.toContain('plugin-i18n');
+    expect(register).not.toContain('UltramodernCanonicalRoutes');
+    // But the standard TanStack runtime augmentation must still be present.
+    expect(register).toContain(
+      "declare module '@modern-js/plugin-tanstack/runtime'",
+    );
+  });
+
+  test('uses a custom i18nRuntimeModule when specified', async () => {
+    tempDir = await mkdtemp(path.join(tmpdir(), 'modern-tanstack-cli-'));
+    const srcDirectory = path.join(tempDir, 'src');
+
+    await writeTanstackRegisterFile({
+      entries: ['main'],
+      generatedDirName: 'tanstack',
+      srcDirectory,
+      canonicalRoutes: {
+        '/talks': 'Record<string, never>',
+      },
+      i18nRuntimeModule: '@my-org/i18n/runtime',
+    });
+
+    const register = await readFile(
+      path.join(srcDirectory, 'tanstack', 'register.gen.d.ts'),
+      'utf-8',
+    );
+
+    expect(register).toContain("declare module '@my-org/i18n/runtime'");
+    expect(register).not.toContain(
+      "declare module '@modern-js/plugin-i18n/runtime'",
+    );
+  });
+
   test('claims custom routes, injects runtime plugin, and merges route specs', async () => {
     tempDir = await mkdtemp(path.join(tmpdir(), 'modern-tanstack-cli-'));
     const srcDirectory = path.join(tempDir, 'src');
@@ -193,6 +272,12 @@ describe('tanstack router cli plugin', () => {
       },
     ]);
 
+    expect(taps.config()).toMatchObject({
+      output: {
+        splitRouteChunks: true,
+      },
+    });
+
     const specPath = path.join(distDirectory, NESTED_ROUTE_SPEC_FILE);
     await fs.outputJSON(specPath, {
       existing: [{ id: 'keep-me' }],
@@ -383,4 +468,234 @@ describe('tanstack router cli plugin', () => {
       }),
     );
   });
+
+  test('can opt out of Modern-owned route code splitting', async () => {
+    const taps: Record<string, any> = {};
+    const api = {
+      getAppContext: () => ({
+        srcDirectory: '/tmp/app/src',
+        serverRoutes: [],
+      }),
+      _internalRuntimePlugins: () => {},
+      checkEntryPoint: () => {},
+      config: (tap: any) => {
+        taps.config = tap;
+      },
+      modifyEntrypoints: () => {},
+      generateEntryCode: () => {},
+      onFileChanged: () => {},
+      modifyFileSystemRoutes: () => {},
+      onBeforeGenerateRoutes: () => {},
+    };
+
+    tanstackRouterPlugin({ routeCodeSplitting: false }).setup!(api as any);
+
+    expect(taps.config()).toMatchObject({
+      output: {
+        splitRouteChunks: false,
+      },
+    });
+  });
+
+  test('documents why TanStack Start Rspack splitter is not registered for Modern routes', () => {
+    const profile = createTanstackRsbuildRouteSplittingProfile({});
+
+    expect(profile).toMatchObject({
+      defaultConfig: {
+        output: {
+          splitRouteChunks: true,
+        },
+      },
+      modernRouteChunks: {
+        enabled: true,
+        owner: 'modern',
+      },
+      builderChunkSplit: {
+        owner: 'modern-rsbuild',
+        preserved: true,
+      },
+      tanstackStartRspackSplitter: {
+        compatible: false,
+        clientDeleteNodes: ['ssr', 'server', 'headers'],
+      },
+    });
+    expect(
+      isTanstackStartRouteModuleSource(
+        "export const Route = createFileRoute('/dashboard')({ component })",
+      ),
+    ).toBe(true);
+    expect(
+      isTanstackStartRouteModuleSource(
+        'export const route = createRoute({ getParentRoute, path })',
+      ),
+    ).toBe(false);
+  });
+
+  test('preserves user-selected route and builder chunk splitting modes', () => {
+    const pluginDefaults = createTanstackRsbuildRouteSplittingProfile(
+      {},
+    ).defaultConfig;
+    const chunkSplits = [
+      { strategy: 'split-by-module' },
+      { strategy: 'split-by-experience' },
+      { strategy: 'all-in-one' },
+      { strategy: 'single-vendor' },
+      { strategy: 'split-by-size', minSize: 10_000, maxSize: 60_000 },
+      {
+        strategy: 'custom',
+        splitChunks: {
+          chunks: 'all',
+          cacheGroups: {
+            tractors: {
+              name: 'tractors',
+              test: /tractors/u,
+            },
+          },
+        },
+      },
+    ];
+
+    for (const chunkSplit of chunkSplits) {
+      expect(
+        mergeConfig([
+          pluginDefaults,
+          {
+            output: {
+              splitRouteChunks: false,
+            },
+            performance: {
+              chunkSplit,
+            },
+            splitChunks: false,
+          },
+        ]),
+      ).toMatchObject({
+        output: {
+          splitRouteChunks: false,
+        },
+        performance: {
+          chunkSplit,
+        },
+        splitChunks: false,
+      });
+    }
+
+    const pageSplitWithManualAsyncChunks = mergeConfig([
+      pluginDefaults,
+      {
+        performance: {
+          chunkSplit: {
+            strategy: 'custom',
+            splitChunks: {
+              chunks: 'async',
+            },
+          },
+        },
+      },
+    ]);
+
+    expect(pageSplitWithManualAsyncChunks).toMatchObject({
+      output: {
+        splitRouteChunks: true,
+      },
+      performance: {
+        chunkSplit: {
+          strategy: 'custom',
+          splitChunks: {
+            chunks: 'async',
+          },
+        },
+      },
+    });
+  });
+
+  test('keeps custom cache group details intact', () => {
+    const pluginDefaults = createTanstackRsbuildRouteSplittingProfile(
+      {},
+    ).defaultConfig;
+
+    const mergedConfig = mergeConfig([
+      pluginDefaults,
+      {
+        performance: {
+          chunkSplit: {
+            strategy: 'custom',
+            splitChunks: {
+              chunks: 'all',
+              cacheGroups: {
+                tractors: {
+                  name: 'tractors',
+                  test: /tractors/u,
+                },
+              },
+            },
+          },
+        },
+      },
+    ]);
+
+    expect(
+      (
+        mergedConfig as {
+          performance?: {
+            chunkSplit?: {
+              splitChunks?: {
+                cacheGroups?: {
+                  tractors?: {
+                    test?: RegExp;
+                  };
+                };
+              };
+            };
+          };
+        }
+      ).performance?.chunkSplit?.splitChunks?.cacheGroups?.tractors?.test,
+    ).toEqual(/tractors/u);
+    expect(mergedConfig).toMatchObject({
+      output: {
+        splitRouteChunks: true,
+      },
+      performance: {
+        chunkSplit: {
+          strategy: 'custom',
+          splitChunks: {
+            chunks: 'all',
+            cacheGroups: {
+              tractors: {
+                name: 'tractors',
+              },
+            },
+          },
+        },
+      },
+    });
+  });
+
+  test('plugin opt-out can still combine with manual builder chunking', () => {
+    const pluginDefaults = createTanstackRsbuildRouteSplittingProfile({
+      routeCodeSplitting: false,
+    }).defaultConfig;
+
+    expect(
+      mergeConfig([
+        pluginDefaults,
+        {
+          performance: {
+            chunkSplit: {
+              strategy: 'single-vendor',
+            },
+          },
+        },
+      ]),
+    ).toMatchObject({
+      output: {
+        splitRouteChunks: false,
+      },
+      performance: {
+        chunkSplit: {
+          strategy: 'single-vendor',
+        },
+      },
+    });
+  });
 });

package/tests/router/fastDefaults.test.ts

@@ -0,0 +1,25 @@
+import {
+  getModernTanstackRouterFastDefaults,
+  modernTanstackRouterFastDefaults,
+} from '../../src/runtime/types';
+
+describe('tanstack router fast defaults', () => {
+  test('enables structural sharing by default', () => {
+    expect(modernTanstackRouterFastDefaults).toEqual({
+      defaultStructuralSharing: true,
+    });
+    expect(getModernTanstackRouterFastDefaults()).toEqual({
+      defaultStructuralSharing: true,
+    });
+  });
+
+  test('allows explicit structural sharing override', () => {
+    expect(
+      getModernTanstackRouterFastDefaults({
+        defaultStructuralSharing: false,
+      }),
+    ).toEqual({
+      defaultStructuralSharing: false,
+    });
+  });
+});

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/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']);
   });
 });