improved route extractions

Author: timonkrebs

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsharp/ng-component-hierarchy-visualizer",
-  "version": "1.6.0",
+  "version": "1.7.0",
   "description": "generate mermaid representations of your angular component hierarchy",
   "keywords": [
     "angular",
@@ -15,7 +15,8 @@
     "ng-route-hierarchy": "scripts/generate.js"
   },
   "scripts": {
-    "test": "node --experimental-vm-modules node_modules/jest/bin/jest.js"
+    "test": "node --experimental-vm-modules node_modules/jest/bin/jest.js",
+    "updateSnapshots": "node --experimental-vm-modules node_modules/jest/bin/jest.js --updateSnapshot"
   },
   "repository": {
     "type": "git",

scripts/route.helper.js

@@ -94,14 +94,13 @@ const extractVariableDeclaration = (declarations) => {
 
 export const extractRoutesFromTS = (routesString, rootName = ROOT_COMPONENT) => {
     try {
-        // Stricter parsing mode
         const ast = parse(routesString, {
             range: true,
         });
 
         // Find the top-level array expression
-        const routesArrayNode = ast.body.find(node => node.type === 'ExpressionStatement' &&
-            node.expression.type === 'ArrayExpression');
+        const routesArrayNode = ast.body
+            .find(node => node.type === 'ExpressionStatement' && node.expression.type === 'ArrayExpression');
 
         if (!routesArrayNode) {
             throw new Error('Could not find the routes array in the configuration.');
@@ -111,7 +110,7 @@ export const extractRoutesFromTS = (routesString, rootName = ROOT_COMPONENT) =>
         const routes = routesArrayNode.expression.elements.map(e => {
             try {
                 const resolvedRoutes = extractRoutes([e], rootName)
-                if(resolvedRoutes.length === 1) {
+                if (resolvedRoutes.length === 1) {
                     return resolvedRoutes[0];
                 }
 
@@ -121,7 +120,7 @@ export const extractRoutesFromTS = (routesString, rootName = ROOT_COMPONENT) =>
             } catch (error) {
                 console.error('Error extracting route configuration:', error);
             }
-        }).filter(Boolean);
+        });
 
         return routes;
     } catch (error) {
@@ -149,40 +148,56 @@ const extractRoutes = (elements, rootName) => {
         const children = e.properties.find(n => n.key?.name === 'children')?.value?.elements;
         if (children?.length > 0) {
             extractRoutes(children, rootName).forEach(element => {
-                tempRoutes.push(element)
+                tempRoutes.push(element);
             });
         }
-    })
+    });
 
     return tempRoutes;
 };
 
 const extractComponents = (properties, parent) => {
     return {
         path: properties.find(n => n.key?.name === 'path')?.value?.value,
-        component: properties.find(n => n.key?.name === 'component')?.value?.name,
+        component: properties.find(n => n.key?.name === 'component').value.name,
         parent
     }
 };
 
 const extractLoadComponents = (properties, parent) => {
-    const loadComponent = properties.find(n => n.key?.name === 'loadComponent')
-    const loadComponentValue = loadComponent?.value?.body?.callee?.object?.source?.value ?? loadComponent?.value?.body?.source?.value;
+    const loadComponent = extractBaseProperty(properties.find(n => n.key?.name === 'loadComponent'));
+
+    const loadComponentValue = loadComponent.callee?.object?.source?.value // if it has .then
+        ?? loadComponent.source.value; // if it has no .then
+
     return {
         path: properties.find(n => n.key?.name === 'path')?.value?.value,
         loadComponent: loadComponentValue,
-        componentName: properties.find(n => n.key?.name === 'loadComponent')?.value?.body?.arguments?.[0]?.body?.property?.name ?? loadComponentValue,
+        componentName: loadComponent.arguments?.[0]?.body?.property?.name ?? loadComponentValue,
         parent
     }
 };
 
 const extractLoadChildren = (properties, parent) => {
-    const loadChildren = properties.find(n => n.key?.name === 'loadChildren')
-    const loadChildrenValue = loadChildren?.value?.body?.callee?.object?.source?.value ?? loadChildren?.value?.body?.source?.value;
+    const loadChildren = extractBaseProperty(properties.find(n => n.key?.name === 'loadChildren'));
+
+    const loadChildrenValue = loadChildren.callee?.object?.source?.value  // if it has .then
+        ?? loadChildren.source.value; // if it has no .then
+
     return {
         path: properties.find(n => n.key?.name === 'path')?.value?.value,
         loadChildren: loadChildrenValue,
-        componentName: properties.find(n => n.key?.name === 'loadChildren')?.value.body.arguments?.[0]?.body?.property?.name ?? loadChildrenValue,
+        componentName: loadChildren.arguments?.[0]?.body?.property?.name ?? loadChildrenValue,
         parent
     }
+};
+
+const extractBaseProperty = (node) => {
+    const body = node.value?.body?.body?.[0]?.argument // if it has a body
+        ?? node.value?.consequent?.body // if it has a ternary
+        ?? node.value?.body; // if it has no body
+
+    return body.body?.[0]?.consequent?.body?.[0]?.argument // if it has an if statement inside the body of the callback
+        ?? body.consequent // if it has a ternary inside the body of the callback
+        ?? body;
 }

test-data/route-definitions/ngx-admin/pages/pages-routing.ts

@@ -21,18 +21,28 @@ const routes: Routes = [{
     {
       path: 'layout',
       loadChildren: () =>
-
-           import('./layout/layout.module')
+      {
+        if  (true)  {
+          return import('./layout/layout.module')
           .then(m => m.LayoutModule)
+        }   else{
+          return import('./bla')
+          .then(m => m.b)
+        }
+
+      }
+
 
 
 
     },
     {
       path: 'forms',
-      loadChildren: () => import('./forms/forms.module')
+      loadChildren: () => false ? import('./forms/forms.module').then(m => m.FormsModule) 
+      : import('./bla')
+      .then(m => m.b)
 
-      .then(m => m.FormsModule)
+      
     },
     {
       path: 'ui-features',

test-data/route-definitions/real-world/app.routes.satisfies.ts

@@ -11,14 +11,16 @@ export const routes = [
   },
   {
     path: "login",
-    loadComponent: () => import("./core/auth/auth.component"),
+    loadComponent: () => false 
+    ? import("./core/auth/auth.component")
+    : import("./uups"),
     canActivate: [
       () => inject(UserService).isAuthenticated.pipe(map((isAuth) => !isAuth)),
     ],
   },
   {
     path: "register",
-    loadComponent: () => import("./core/auth/auth.component"),
+    loadComponent: true? () => import("./core/auth/auth.component") : import("./noooo"),
     canActivate: [
       () => inject(UserService).isAuthenticated.pipe(map((isAuth) => !isAuth)),
     ],
@@ -30,7 +32,7 @@ export const routes = [
   },
   {
     path: "profile",
-    loadChildren: () => import("./features/profile/profile.routes"),
+    loadChildren: () => import("./features/profile/profile.routes")
   },
   {
     path: "editor",