@codeyam/codeyam-cli 0.1.0-staging.15d0f46 → 0.1.0-staging.1669d45

package/background/src/lib/virtualized/project/writeScenarioComponents.js

@@ -62,7 +62,10 @@ function resetDebugTiming() {
  */
 function findEndOfImports(content) {
     try {
-        const sourceFile = ts.createSourceFile('temp.ts', content, ts.ScriptTarget.Latest, true);
+        // Use temp.tsx to enable JSX parsing - otherwise TypeScript may misparse
+        // JSX content containing the word "import" (e.g., "Entities that import this")
+        // as an import statement, causing mock code to be inserted in the wrong location.
+        const sourceFile = ts.createSourceFile('temp.tsx', content, ts.ScriptTarget.Latest, true, ts.ScriptKind.TSX);
         let lastImportEnd = 0;
         // Visit all top-level statements to find import/export declarations
         for (const statement of sourceFile.statements) {
@@ -476,7 +479,8 @@ function extractInternalImportPaths(fileContent) {
 function extractInternalImportPathsAst(fileContent) {
     const importPaths = [];
     try {
-        const sourceFile = ts.createSourceFile('temp.ts', fileContent, ts.ScriptTarget.Latest, true);
+        // Use temp.tsx to enable JSX parsing for consistent handling of JSX files
+        const sourceFile = ts.createSourceFile('temp.tsx', fileContent, ts.ScriptTarget.Latest, true, ts.ScriptKind.TSX);
         for (const statement of sourceFile.statements) {
             if (ts.isImportDeclaration(statement) && statement.moduleSpecifier) {
                 const moduleSpecifier = statement.moduleSpecifier;
@@ -592,46 +596,97 @@ function addMockToContent(fileContent, importedExport, fileAnalyses, rootAnalysi
     }
     // Check if we have multiple calls with different variable names
     // This requires generating separate mock functions for each call site
-    const hasMultipleCallsWithVariables = importedExport.calls &&
-        importedExport.calls.length > 1 &&
+    //
+    // IMPORTANT: calls array may contain BOTH base hook calls (e.g., "useFetcher<Type>()")
+    // AND method chain usages (e.g., "useFetcher().functionCallReturnValue.submit(...)").
+    // We only want to count base hook calls for the length comparison with callVariableNames.
+    // A "base call" is one that ends with "()" possibly preceded by a type annotation,
+    // without any subsequent method chains like ".functionCallReturnValue" or ".submit(...)".
+    const baseHookCalls = importedExport.calls?.filter((call) => {
+        // Base hook calls match patterns like:
+        // - "useFetcher()"
+        // - "useFetcher<Type>()"
+        // - "useFetcher<{ complex: Type }>()"
+        // They end with "()" and don't have method chains after the call.
+        // Method chains contain ".functionCallReturnValue" or have property access after "()".
+        return (call.endsWith('()') &&
+            !call.includes('.functionCallReturnValue') &&
+            // Also exclude method chains like "hook().something" or "hook().method()"
+            !call.match(/\(\)\.[a-zA-Z]/));
+    });
+    // Determine if we can generate unique mock functions for multiple variables.
+    // We need:
+    // 1. Multiple variable names (callVariableNames.length > 1)
+    // 2. Base hook calls to match them (baseHookCalls.length > 0)
+    // Note: We use min(baseHookCalls.length, callVariableNames.length) for iteration
+    // to handle cases where data might be slightly out of sync (stale entries).
+    const hasMultipleCallsWithVariables = baseHookCalls &&
+        baseHookCalls.length > 1 &&
         importedExport.callVariableNames &&
-        importedExport.callVariableNames.length === importedExport.calls.length;
+        importedExport.callVariableNames.length > 1 &&
+        // Only proceed if we have at least as many base calls as variable names,
+        // OR they're close enough (within 1) to handle minor sync issues
+        Math.abs(baseHookCalls.length - importedExport.callVariableNames.length) <=
+            1;
     let mockCode;
     const variableMockCodes = [];
     if (hasMultipleCallsWithVariables) {
         // Generate separate mock functions for each variable-qualified call
-        // Track variable name occurrences to disambiguate when same variable is reused
-        // (mirrors the logic in gatherDataForMocks)
+        // Look up canonical keys from dataForMocks and track variable names for function naming
+        // Get all call signature keys for this hook from dataForMocks
+        const dataForMocks = rootAnalysis.metadata?.scenariosDataStructure?.dataForMocks;
+        // Match keys that start with the hook name (e.g., "useFetcher" matches "useFetcher<User>()")
+        const callSignatureKeysForHook = dataForMocks
+            ? Object.keys(dataForMocks).filter((key) => {
+                const hookBaseName = importedExport.name.split(/[<(]/)[0];
+                const keyBaseName = key.split(/[<(]/)[0];
+                return keyBaseName === hookBaseName;
+            })
+            : [];
+        // Track variable name occurrences for unique function naming
         const variableNameCounts = {};
-        for (let i = 0; i < importedExport.calls.length; i++) {
+        // Use the minimum of both array lengths to handle slight mismatches
+        // (e.g., stale data from previous analysis runs)
+        const iterationLimit = Math.min(baseHookCalls.length, importedExport.callVariableNames.length);
+        for (let i = 0; i < iterationLimit; i++) {
             const variableName = importedExport.callVariableNames[i];
             if (!variableName)
                 continue;
             // Calculate the occurrence index for this variable name
             const occurrence = variableNameCounts[variableName] ?? 0;
             variableNameCounts[variableName] = occurrence + 1;
-            // If this is a reused variable name (occurrence > 0), append index
-            // e.g., "fetcher[1] <- useFetcher" for the second usage of "fetcher"
+            // Build indexed variable name for function naming
             const indexedVariableName = occurrence > 0 ? `${variableName}[${occurrence}]` : variableName;
-            // Generate mock code for this specific call using variable-qualified name
-            // Format: "variableName <- functionName" (reads as "variableName receives from functionName")
-            const qualifiedName = `${indexedVariableName} <- ${importedExport.name}`;
-            const variableMockCode = constructMockCode(qualifiedName, dependencySchemas, importedExport.entityType);
+            // Use safe function name with underscores instead of brackets
+            // e.g., fetcher[1] -> fetcher_1
+            const safeFunctionName = indexedVariableName.replace(/\[(\d+)\]/g, '_$1');
+            // Compute unique mock function name for call site replacement
+            // e.g., useFetcher_entityDiffFetcher, useFetcher_reportFetcher
+            const mockFunctionName = `${importedExport.name}_${safeFunctionName}`;
+            // Use the call signature from baseHookCalls[i] as the data key
+            // This matches what's stored in dataForMocks
+            const callSignature = baseHookCalls[i];
+            // Generate mock code using the call signature directly
+            // This prevents "symbol already declared" errors when multiple calls exist
+            // Check if this is a package import that won't have scenario copies
+            const isPackageImportForMock = importPath?.startsWith('@');
+            const variableMockCode = constructMockCode(callSignature, // Use call signature format for data lookup
+            dependencySchemas, importedExport.entityType, undefined, // No need for separate canonical key
+            {
+                uniqueFunctionSuffix: safeFunctionName, // Use variable name for unique function naming
+                // For node_modules or package imports, skip spreading from __cyOriginal
+                // since those packages/files don't export *__cyOriginal variants
+                skipOriginalSpread: importedExport.isNodeModule || isPackageImportForMock,
+            });
             if (variableMockCode) {
                 variableMockCodes.push(variableMockCode);
                 // Replace the call site with the variable-specific mock function
                 // e.g., useFetcher<BranchEntityDiffResult>() -> useFetcher_entityDiffFetcher()
                 // e.g., useFetcher() -> useFetcher_reportFetcher()
-                // For indexed variables: useFetcher() -> useFetcher_fetcher_1()
-                const callSignature = importedExport.calls[i];
                 // Escape special regex characters in the call signature
                 const escapedCallSignature = callSignature.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
                 // Create regex that matches the call (with optional whitespace variations)
                 const callRegex = new RegExp(escapedCallSignature.replace(/\s+/g, '\\s*'), 'g');
-                // Use safe function name with underscores instead of brackets
-                // e.g., fetcher[1] -> fetcher_1
-                const safeFunctionName = indexedVariableName.replace(/\[(\d+)\]/g, '_$1');
-                const mockFunctionName = `${importedExport.name}_${safeFunctionName}`;
                 fileContent = fileContent.replace(callRegex, `${mockFunctionName}()`);
             }
         }
@@ -646,66 +701,104 @@ function addMockToContent(fileContent, importedExport, fileAnalyses, rootAnalysi
             ? importedExport.callVariableNames[0]
             : undefined;
         if (singleCallVariableName) {
-            // For single variable assignments, use the variable-qualified key for data lookup
-            // Use constructMockCode to generate proper dispatch functions for nested function calls
-            // (e.g., useTranslation returns { t } where t() needs to dispatch based on translation key)
-            const qualifiedKey = `${singleCallVariableName} <- ${importedExport.name}`;
-            // Keep the original function name since there's only one call - no need for unique names
-            mockCode = constructMockCode(qualifiedKey, dependencySchemas, importedExport.entityType, { keepOriginalFunctionName: true });
+            // For single variable assignments, use the call signature directly from dataForMocks
+            const dataForMocks = rootAnalysis.metadata?.scenariosDataStructure?.dataForMocks;
+            // Find matching call signature key in dataForMocks
+            const hookBaseName = importedExport.name.split(/[<(]/)[0];
+            const callSignatureKey = dataForMocks
+                ? Object.keys(dataForMocks).find((key) => {
+                    // Split on ., <, or ( to get the true base name
+                    // This handles both "useFlags()" -> "useFlags" and "trpc.useUtils()" -> "trpc"
+                    const keyBaseName = key.split(/[.<(]/)[0];
+                    return keyBaseName === hookBaseName;
+                })
+                : undefined;
+            // Use the call signature if found, otherwise construct it
+            const dataKey = callSignatureKey ??
+                importedExport.calls?.[0] ??
+                `${importedExport.name}()`;
+            // IMPORTANT: If the dataKey is a method chain (e.g., "trpc.useUtils()"), we should
+            // use the base name (e.g., "trpc") when calling constructMockCode. This ensures
+            // constructMockCode generates a complete nested mock from the schema without
+            // referencing __cyOriginal variables.
+            const dataKeyBaseName = dataKey.split(/[.<(]/)[0];
+            const isMethodChainDataKey = dataKeyBaseName === importedExport.name &&
+                dataKey !== importedExport.name &&
+                dataKey.includes('.');
+            const mockNameToUse = isMethodChainDataKey
+                ? importedExport.name
+                : dataKey;
+            // Keep the original function name since there's only one call
+            // Check if this is a package import that won't have scenario copies
+            const isPackageImportForSingleCall = importPath?.startsWith('@');
+            mockCode = constructMockCode(mockNameToUse, dependencySchemas, importedExport.entityType, undefined, {
+                keepOriginalFunctionName: true,
+                // For node_modules or package imports, skip spreading from __cyOriginal
+                // since those packages/files don't export *__cyOriginal variants
+                skipOriginalSpread: importedExport.isNodeModule || isPackageImportForSingleCall,
+            });
             // If constructMockCode didn't generate code, fall back to simple return
+            // IMPORTANT: We inline scenarios().data() inside the function rather than
+            // storing in a const - see comment in constructMockCode.ts for why.
             if (!mockCode) {
-                mockCode = `const ${importedExport.name}ReturnValue = scenarios().data()?.["${qualifiedKey}"];
-
-function ${importedExport.name}() {
-  return ${importedExport.name}ReturnValue;
+                mockCode = `function ${importedExport.name}(...args) {
+  return scenarios().data()?.["${dataKey}"];
 }`;
             }
         }
         else {
-            // Check if any analysis (fileAnalyses or rootAnalysis) has this function's data
-            // under a variable-qualified key. The entity that CALLS the function (e.g., FileTableRow)
-            // has the dataForMocks with the variable-qualified key, not the root analysis (e.g., GitView).
-            let variableQualifiedKey;
-            // First check fileAnalyses (the analyses for the entity being written)
-            for (const analysis of fileAnalyses) {
-                const dataForMocks = analysis.metadata?.scenariosDataStructure?.dataForMocks;
-                if (dataForMocks) {
-                    variableQualifiedKey = Object.keys(dataForMocks).find((key) => {
-                        const match = key.match(/^([a-zA-Z_][a-zA-Z0-9_]*)\s*<-\s*(.+)$/);
-                        return match && match[2] === importedExport.name;
-                    });
-                    if (variableQualifiedKey) {
+            // Helper to find matching call signature key from dataForMocks
+            const hookBaseName = importedExport.name.split(/[<(]/)[0];
+            const findMatchingKey = (dataForMocks) => {
+                if (!dataForMocks)
+                    return undefined;
+                return Object.keys(dataForMocks).find((key) => {
+                    // Split on ., <, or ( to get the true base name
+                    // This handles both "useFlags()" -> "useFlags" and "trpc.useUtils()" -> "trpc"
+                    const keyBaseName = key.split(/[.<(]/)[0];
+                    return keyBaseName === hookBaseName;
+                });
+            };
+            // Check rootAnalysis FIRST for matching keys.
+            // The mock DATA is generated from rootAnalysis, so the mock CODE must
+            // also use rootAnalysis keys to ensure the lookup succeeds.
+            let dataKey = findMatchingKey(rootAnalysis.metadata?.scenariosDataStructure?.dataForMocks);
+            // If not found in rootAnalysis, fall back to fileAnalyses
+            if (!dataKey) {
+                for (const analysis of fileAnalyses) {
+                    dataKey = findMatchingKey(analysis.metadata?.scenariosDataStructure?.dataForMocks);
+                    if (dataKey)
                         break;
-                    }
-                }
-            }
-            // If not found in fileAnalyses, fall back to rootAnalysis
-            if (!variableQualifiedKey) {
-                const dataForMocks = rootAnalysis.metadata?.scenariosDataStructure?.dataForMocks;
-                if (dataForMocks) {
-                    variableQualifiedKey = Object.keys(dataForMocks).find((key) => {
-                        const match = key.match(/^([a-zA-Z_][a-zA-Z0-9_]*)\s*<-\s*(.+)$/);
-                        return match && match[2] === importedExport.name;
-                    });
                 }
             }
-            if (variableQualifiedKey) {
-                // Use the variable-qualified key found in the analysis
-                // Use constructMockCode to generate proper dispatch functions for nested function calls
-                // Keep the original function name since there's only one call - no need for unique names
-                mockCode = constructMockCode(variableQualifiedKey, dependencySchemas, importedExport.entityType, { keepOriginalFunctionName: true });
-                // If constructMockCode didn't generate code, fall back to simple return
-                if (!mockCode) {
-                    mockCode = `const ${importedExport.name}ReturnValue = scenarios().data()?.["${variableQualifiedKey}"];
-
-function ${importedExport.name}() {
-  return ${importedExport.name}ReturnValue;
+            // Use the data key if found, otherwise use call signature or function name.
+            // IMPORTANT: If the dataKey is a method chain (e.g., "trpc.useUtils()"), we should
+            // use the base name (e.g., "trpc") when calling constructMockCode. This ensures
+            // constructMockCode generates a complete nested mock from the schema without
+            // referencing __cyOriginal variables. The __cyOriginal pattern is only needed
+            // for partial mocking where we preserve some original methods, not for complete
+            // method-chain mocks where we provide all implementations.
+            const dataKeyBaseName = dataKey?.split(/[.<(]/)[0];
+            const isMethodChainDataKey = dataKey &&
+                dataKeyBaseName === importedExport.name &&
+                dataKey !== importedExport.name &&
+                dataKey.includes('.');
+            const mockNameToUse = isMethodChainDataKey
+                ? importedExport.name
+                : (dataKey ?? importedExport.calls?.[0] ?? `${importedExport.name}()`);
+            mockCode = constructMockCode(mockNameToUse, dependencySchemas, importedExport.entityType, undefined, {
+                keepOriginalFunctionName: true,
+                // For node_modules or package imports, skip spreading from __cyOriginal
+                // since those packages/files don't export *__cyOriginal variants
+                skipOriginalSpread: importedExport.isNodeModule || importPath?.startsWith('@'),
+            });
+            // If constructMockCode didn't generate code, fall back to simple return
+            // IMPORTANT: We inline scenarios().data() inside the function rather than
+            // storing in a const - see comment in constructMockCode.ts for why.
+            if (!mockCode && dataKey) {
+                mockCode = `function ${importedExport.name}(...args) {
+  return scenarios().data()?.["${dataKey}"];
 }`;
-                }
-            }
-            else {
-                // Original behavior for calls without variable names
-                mockCode = constructMockCode(importedExport.name, dependencySchemas, importedExport.entityType);
             }
         }
     }
@@ -724,8 +817,31 @@ function ${importedExport.name}() {
         else {
             // Escape regex special characters in importPath (e.g., brackets in [environmentId])
             const escapedImportPath = importPath.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
-            const importRegExp = new RegExp(`(import(?:(?!${firstPart}|from|import)[\\s\\S])*?)${firstPart}(?:,\\s*)?((?:(?!import)[\\s\\S])*?from\\s+['"]${escapedImportPath}['"])`, 'm');
-            if (importedExportNameParts.length > 1) {
+            // Use a simpler, more robust regex pattern that matches the fallback path.
+            // Key improvements:
+            // 1. Uses escapeRegExp(firstPart) to handle special characters in function names
+            // 2. Uses word boundaries (\b) to prevent partial matches
+            // 3. Handles comma BEFORE or AFTER the name: (?:,\s*|\s*,)?
+            // 4. Matches specific import path (escapedImportPath)
+            const importRegExp = new RegExp(`(import\\s*\\{[^}]*?)\\b${escapeRegExp(firstPart)}\\b(?:,\\s*|\\s*,)?((?:[^}]*\\}\\s*from\\s*['"]${escapedImportPath}['"];?))`, 'm');
+            // Check if any call signature has multiple parts (e.g., "logger.error(error)")
+            // If so, the mock code will spread from __cyOriginal, so we need to rename the import
+            // EXCEPT:
+            // 1. For node_module imports, the __cyOriginal pattern doesn't work because
+            //    the original package doesn't export *__cyOriginal variants.
+            // 2. For package imports (starting with @), the __cyOriginal pattern doesn't work
+            //    because scenario copies aren't created for package files - they keep the
+            //    original import path which doesn't export *__cyOriginal.
+            const anyCallHasMultipleParts = importedExport.calls?.some((call) => {
+                const callParts = splitOutsideParenthesesAndArrays(call);
+                return callParts.length > 1;
+            });
+            // Package imports (starting with @) don't get scenario copies, so __cyOriginal won't exist
+            const isPackageImport = importPath.startsWith('@');
+            const shouldRenameToOriginal = !importedExport.isNodeModule &&
+                !isPackageImport &&
+                (importedExportNameParts.length > 1 || anyCallHasMultipleParts);
+            if (shouldRenameToOriginal) {
                 fileContent = fileContent.replace(importRegExp, `$1${firstPart}__cyOriginal$2`);
             }
             else {
@@ -746,7 +862,17 @@ function ${importedExport.name}() {
         // This handles imports like: import { useEnvironment, otherThing } from "any/path"
         // Removes useEnvironment but keeps otherThing
         const namedImportRegExp = new RegExp(`(import\\s*\\{[^}]*?)\\b${escapeRegExp(firstPart)}\\b(?:,\\s*|\\s*,)?((?:[^}]*\\}\\s*from\\s*['"][^'"]*['"];?))`, 'm');
-        if (importedExportNameParts.length > 1) {
+        // Check if any call signature has multiple parts (e.g., "logger.error(error)")
+        // If so, the mock code will spread from __cyOriginal, so we need to rename the import
+        // EXCEPT: For node_module imports, the __cyOriginal pattern doesn't work because
+        // the original package doesn't export *__cyOriginal variants.
+        const anyCallHasMultipleParts = importedExport.calls?.some((call) => {
+            const callParts = splitOutsideParenthesesAndArrays(call);
+            return callParts.length > 1;
+        });
+        const shouldRenameToOriginal = !importedExport.isNodeModule &&
+            (importedExportNameParts.length > 1 || anyCallHasMultipleParts);
+        if (shouldRenameToOriginal) {
             // Rename the import instead of removing (for destructured access patterns)
             fileContent = fileContent.replace(namedImportRegExp, `$1${firstPart}__cyOriginal$2`);
         }
@@ -1498,17 +1624,27 @@ ${exportKeyword}const ${functionName} = new Proxy(() => scenarios().data()?.["${
             }
         }
     }
+    // Collect universal mocks BEFORE processing nodeModuleImports
+    // This is needed to check if a node module import is handled by a universal mock
+    const universalMocks = project.metadata?.universalMocks ?? [];
+    const nodeModuleUniversalMocks = universalMocks.filter((mock) => mock.nodeModule && mock.content);
+    // Create a set of import paths that have universal mocks for quick lookup
+    const universalMockPaths = new Set(nodeModuleUniversalMocks.map((mock) => mock.filePath));
     for (const nodeModuleImport of nodeModuleImports) {
         if (!nodeModuleImport.isMocked)
             continue;
+        // Skip generating local mock functions for imports that have universal mocks.
+        // Universal mocks provide the exports via rewritten import paths (handled below).
+        // Generating a local mock function would cause "name defined multiple times" errors.
+        if (universalMockPaths.has(nodeModuleImport.filePath)) {
+            continue;
+        }
         fileContent = addMockToContent(fileContent, nodeModuleImport, fileAnalyses, rootAnalysis, relativeMocksDir, scenario.name, importMapping[nodeModuleImport.filePath] ?? nodeModuleImport.filePath);
     }
     // Rewrite node_module imports that have universal mocks
     // Universal mocks create mock files at __codeyamMocks__/{safeFileName}.tsx
     // We need to rewrite imports like `import { logger } from "@formbricks/logger"`
     // to `import { logger } from "../__codeyamMocks__/_formbricks_logger.js"`
-    const universalMocks = project.metadata?.universalMocks ?? [];
-    const nodeModuleUniversalMocks = universalMocks.filter((mock) => mock.nodeModule && mock.content);
     for (const universalMock of nodeModuleUniversalMocks) {
         const originalPath = universalMock.filePath;
         // Create the mock file name using the same safeFileName function as writeUniversalMocks