@mmapp/react-compiler 0.1.0-alpha.1

package/src/__tests__/route-merging.test.ts

@@ -0,0 +1,372 @@
+/**
+ * Route Merging Tests — validates compile-time route merging from module dependencies.
+ *
+ * When a blueprint has dependencies with routeConfig in mm.config.ts, and the caller
+ * provides resolvedModules with pre-compiled route tables, the compiler should:
+ *   1. Prefix module routes with routeConfig.prefix
+ *   2. Apply per-route overrides (remap or disable)
+ *   3. Merge into the parent's routeTable
+ *   4. Add merged module routes as Router/Route experience nodes
+ */
+
+import { describe, it, expect } from 'vitest';
+import { compileProject } from '../project-compiler';
+import type { ResolvedModule, RouteTableEntry } from '../project-compiler';
+import type { IRExperienceNode } from '@mindmatrix/player-core';
+
+// =============================================================================
+// Helpers
+// =============================================================================
+
+/** Minimal page TSX that the babel plugin can compile. */
+function page(title: string): string {
+  return `
+    export default function ${title.replace(/[^a-zA-Z]/g, '')}Page() {
+      return <div><h1>${title}</h1></div>;
+    }
+  `;
+}
+
+/** Extract the composed experience from the parent IR. */
+function getExperience(ir: any): IRExperienceNode | undefined {
+  return ir.experience as IRExperienceNode | undefined;
+}
+
+/** Collect all nodes matching a component type (recursive). */
+function findAllByComponent(node: IRExperienceNode, component: string): IRExperienceNode[] {
+  const results: IRExperienceNode[] = [];
+  if (node.component === component) results.push(node);
+  for (const child of node.children ?? []) {
+    results.push(...findAllByComponent(child, component));
+  }
+  return results;
+}
+
+/** Standard module route table for mod-authentication. */
+const authModuleRoutes: RouteTableEntry[] = [
+  { path: '/login', stateName: 'LOGIN', sourceFile: 'app/login.tsx', params: [] },
+  { path: '/signup', stateName: 'SIGNUP', sourceFile: 'app/signup.tsx', params: [] },
+  { path: '/admin/users', stateName: 'ADMIN_USERS', sourceFile: 'app/admin/users.tsx', params: [] },
+];
+
+/** Config file with auth dependency. */
+const configWithAuthDep = `
+  import { defineBlueprint } from '@mindmatrix/react';
+  export default defineBlueprint({
+    slug: 'team-directory',
+    name: 'Team Directory',
+    version: '1.0.0',
+    dependencies: [
+      {
+        slug: 'mod-authentication',
+        version: '>=3.0.0',
+        required: true,
+        routeConfig: {
+          prefix: '/auth',
+          routes: {
+            '/admin/users': '/admin/users',
+          },
+        },
+      },
+    ],
+  });
+`;
+
+// =============================================================================
+// Tests
+// =============================================================================
+
+describe('Route Merging at Compile Time', () => {
+  // -------------------------------------------------------------------------
+  // 1. Basic route merging with prefix
+  // -------------------------------------------------------------------------
+  it('should merge module routes with prefix into the parent route table', () => {
+    const resolvedModules: ResolvedModule[] = [{
+      slug: 'mod-authentication',
+      routeTable: authModuleRoutes,
+    }];
+
+    const result = compileProject({
+      'mm.config.ts': configWithAuthDep,
+      'app/home.tsx': page('Home'),
+      'app/members.tsx': page('Members'),
+    }, { resolvedModules });
+
+    expect(result.errors).toHaveLength(0);
+
+    // Parent routes should exist
+    const parentRoutes = result.routeTable.filter(r => !r.moduleSlug);
+    expect(parentRoutes.length).toBeGreaterThanOrEqual(2);
+
+    // Module routes should be merged with prefix
+    const moduleRoutes = result.routeTable.filter(r => r.moduleSlug === 'mod-authentication');
+    expect(moduleRoutes.length).toBe(3);
+
+    // /login → /auth/login (prefixed)
+    const loginRoute = moduleRoutes.find(r => r.path === '/auth/login');
+    expect(loginRoute).toBeDefined();
+    expect(loginRoute!.moduleSlug).toBe('mod-authentication');
+
+    // /signup → /auth/signup (prefixed)
+    const signupRoute = moduleRoutes.find(r => r.path === '/auth/signup');
+    expect(signupRoute).toBeDefined();
+
+    // /admin/users → /admin/users (overridden to exact path, no prefix)
+    const adminRoute = moduleRoutes.find(r => r.path === '/admin/users');
+    expect(adminRoute).toBeDefined();
+  });
+
+  // -------------------------------------------------------------------------
+  // 2. Route prefixing works correctly
+  // -------------------------------------------------------------------------
+  it('should apply prefix correctly to all non-overridden routes', () => {
+    const resolvedModules: ResolvedModule[] = [{
+      slug: 'mod-payments',
+      routeTable: [
+        { path: '/', stateName: 'INDEX', sourceFile: 'app/index.tsx', params: [] },
+        { path: '/checkout', stateName: 'CHECKOUT', sourceFile: 'app/checkout.tsx', params: [] },
+        { path: '/history', stateName: 'HISTORY', sourceFile: 'app/history.tsx', params: [] },
+      ],
+    }];
+
+    const result = compileProject({
+      'mm.config.ts': `
+        import { defineBlueprint } from '@mindmatrix/react';
+        export default defineBlueprint({
+          slug: 'my-store',
+          name: 'My Store',
+          version: '1.0.0',
+          dependencies: [
+            {
+              slug: 'mod-payments',
+              routeConfig: { prefix: '/pay' },
+            },
+          ],
+        });
+      `,
+      'app/home.tsx': page('Home'),
+    }, { resolvedModules });
+
+    const moduleRoutes = result.routeTable.filter(r => r.moduleSlug === 'mod-payments');
+    expect(moduleRoutes).toHaveLength(3);
+
+    // Root route '/' becomes just '/pay' (no trailing slash)
+    expect(moduleRoutes.find(r => r.path === '/pay')).toBeDefined();
+    expect(moduleRoutes.find(r => r.path === '/pay/checkout')).toBeDefined();
+    expect(moduleRoutes.find(r => r.path === '/pay/history')).toBeDefined();
+  });
+
+  // -------------------------------------------------------------------------
+  // 3. No duplicate routes after merge
+  // -------------------------------------------------------------------------
+  it('should not create duplicate routes after merge', () => {
+    const resolvedModules: ResolvedModule[] = [{
+      slug: 'mod-authentication',
+      routeTable: [
+        { path: '/login', stateName: 'LOGIN', sourceFile: 'app/login.tsx', params: [] },
+      ],
+    }];
+
+    // The parent also has /auth/login as a page
+    const result = compileProject({
+      'mm.config.ts': configWithAuthDep,
+      'app/home.tsx': page('Home'),
+      'app/auth/login.tsx': page('AuthLogin'), // same path as module route after prefix
+    }, { resolvedModules });
+
+    // Count routes at /auth/login — should have only one
+    const authLoginRoutes = result.routeTable.filter(r => r.path === '/auth/login');
+    expect(authLoginRoutes).toHaveLength(1);
+  });
+
+  // -------------------------------------------------------------------------
+  // 4. Module routes appear in the compiled Router experience
+  // -------------------------------------------------------------------------
+  it('should add module routes to the Router experience as Route nodes', () => {
+    const resolvedModules: ResolvedModule[] = [{
+      slug: 'mod-authentication',
+      routeTable: authModuleRoutes,
+    }];
+
+    const result = compileProject({
+      'mm.config.ts': configWithAuthDep,
+      'app/home.tsx': page('Home'),
+    }, { resolvedModules });
+
+    const exp = getExperience(result.ir);
+    expect(exp).toBeDefined();
+
+    // Find all Route nodes in the experience
+    const routes = findAllByComponent(exp!, 'Route');
+    // Should have: index route + /home + 3 module routes
+    expect(routes.length).toBeGreaterThanOrEqual(4);
+
+    // Module routes should use ModuleView placeholder component
+    const moduleViews = findAllByComponent(exp!, 'ModuleView');
+    expect(moduleViews.length).toBe(3);
+
+    // Module views should carry moduleSlug config
+    for (const mv of moduleViews) {
+      expect(mv.config?.moduleSlug).toBe('mod-authentication');
+    }
+  });
+
+  // -------------------------------------------------------------------------
+  // 5. NavLinks are created for module routes
+  // -------------------------------------------------------------------------
+  it('should add NavLinks for module routes', () => {
+    const resolvedModules: ResolvedModule[] = [{
+      slug: 'mod-authentication',
+      routeTable: [
+        { path: '/login', stateName: 'LOGIN', sourceFile: 'app/login.tsx', params: [] },
+      ],
+    }];
+
+    const result = compileProject({
+      'mm.config.ts': configWithAuthDep,
+      'app/home.tsx': page('Home'),
+    }, { resolvedModules });
+
+    const exp = getExperience(result.ir);
+    expect(exp).toBeDefined();
+
+    const navLinks = findAllByComponent(exp!, 'NavLink');
+    // Should have at least: home + 1 module route
+    expect(navLinks.length).toBeGreaterThanOrEqual(2);
+
+    const modNavLink = navLinks.find(n => n.config?.moduleSlug === 'mod-authentication');
+    expect(modNavLink).toBeDefined();
+    expect(modNavLink!.config!.to).toBe('/auth/login');
+  });
+
+  // -------------------------------------------------------------------------
+  // 6. Route override: disable a route
+  // -------------------------------------------------------------------------
+  it('should disable routes marked as false in routeConfig.routes', () => {
+    const resolvedModules: ResolvedModule[] = [{
+      slug: 'mod-authentication',
+      routeTable: [
+        { path: '/login', stateName: 'LOGIN', sourceFile: 'app/login.tsx', params: [] },
+        { path: '/signup', stateName: 'SIGNUP', sourceFile: 'app/signup.tsx', params: [] },
+      ],
+    }];
+
+    const result = compileProject({
+      'mm.config.ts': `
+        import { defineBlueprint } from '@mindmatrix/react';
+        export default defineBlueprint({
+          slug: 'no-signup-app',
+          name: 'No Signup App',
+          version: '1.0.0',
+          dependencies: [
+            {
+              slug: 'mod-authentication',
+              routeConfig: {
+                prefix: '/auth',
+                routes: {
+                  '/signup': false,
+                },
+              },
+            },
+          ],
+        });
+      `,
+      'app/home.tsx': page('Home'),
+    }, { resolvedModules });
+
+    const moduleRoutes = result.routeTable.filter(r => r.moduleSlug === 'mod-authentication');
+    expect(moduleRoutes).toHaveLength(1);
+    expect(moduleRoutes[0].path).toBe('/auth/login');
+
+    // /signup should NOT be in the route table
+    expect(result.routeTable.find(r => r.path === '/auth/signup')).toBeUndefined();
+  });
+
+  // -------------------------------------------------------------------------
+  // 7. Default prefix derived from slug when not specified
+  // -------------------------------------------------------------------------
+  it('should derive prefix from slug when routeConfig.prefix is not specified', () => {
+    const resolvedModules: ResolvedModule[] = [{
+      slug: 'mod-billing',
+      routeTable: [
+        { path: '/invoices', stateName: 'INVOICES', sourceFile: 'app/invoices.tsx', params: [] },
+      ],
+    }];
+
+    const result = compileProject({
+      'mm.config.ts': `
+        import { defineBlueprint } from '@mindmatrix/react';
+        export default defineBlueprint({
+          slug: 'my-app',
+          name: 'My App',
+          version: '1.0.0',
+          dependencies: [
+            { slug: 'mod-billing' },
+          ],
+        });
+      `,
+      'app/home.tsx': page('Home'),
+    }, { resolvedModules });
+
+    // Default prefix for 'mod-billing' should be '/billing' (strip 'mod-' prefix)
+    const moduleRoutes = result.routeTable.filter(r => r.moduleSlug === 'mod-billing');
+    expect(moduleRoutes).toHaveLength(1);
+    expect(moduleRoutes[0].path).toBe('/billing/invoices');
+  });
+
+  // -------------------------------------------------------------------------
+  // 8. No resolvedModules → no module routes
+  // -------------------------------------------------------------------------
+  it('should produce no module routes when resolvedModules is not provided', () => {
+    const result = compileProject({
+      'mm.config.ts': configWithAuthDep,
+      'app/home.tsx': page('Home'),
+    });
+
+    const moduleRoutes = result.routeTable.filter(r => r.moduleSlug);
+    expect(moduleRoutes).toHaveLength(0);
+  });
+
+  // -------------------------------------------------------------------------
+  // 9. Module stateName is prefixed with MOD_ namespace
+  // -------------------------------------------------------------------------
+  it('should prefix module route stateNames with MOD_{SLUG} namespace', () => {
+    const resolvedModules: ResolvedModule[] = [{
+      slug: 'mod-authentication',
+      routeTable: [
+        { path: '/login', stateName: 'LOGIN', sourceFile: 'app/login.tsx', params: [] },
+      ],
+    }];
+
+    const result = compileProject({
+      'mm.config.ts': configWithAuthDep,
+      'app/home.tsx': page('Home'),
+    }, { resolvedModules });
+
+    const modRoute = result.routeTable.find(r => r.moduleSlug === 'mod-authentication');
+    expect(modRoute).toBeDefined();
+    expect(modRoute!.stateName).toBe('MOD_MOD_AUTHENTICATION_LOGIN');
+  });
+
+  // -------------------------------------------------------------------------
+  // 10. Module route params are preserved
+  // -------------------------------------------------------------------------
+  it('should preserve dynamic params from module routes', () => {
+    const resolvedModules: ResolvedModule[] = [{
+      slug: 'mod-authentication',
+      routeTable: [
+        { path: '/users/:id', stateName: 'USER_DETAIL', sourceFile: 'app/users/[id].tsx', params: ['id'] },
+      ],
+    }];
+
+    const result = compileProject({
+      'mm.config.ts': configWithAuthDep,
+      'app/home.tsx': page('Home'),
+    }, { resolvedModules });
+
+    const modRoute = result.routeTable.find(r => r.moduleSlug === 'mod-authentication');
+    expect(modRoute).toBeDefined();
+    expect(modRoute!.path).toBe('/auth/users/:id');
+    expect(modRoute!.params).toEqual(['id']);
+  });
+});