@codeyam/codeyam-cli 0.1.0-staging.e38f7bd → 0.1.0-staging.f777668

package/analyzer-template/playwright/captureFromUrl.ts

@@ -22,6 +22,7 @@ interface CaptureArgs {
   projectId: string;
   projectRoot: string;
   viewportWidth?: number;
+  captureCurrentUrl?: boolean;
 }
 
 async function main() {
@@ -100,71 +101,6 @@ async function main() {
   }
   const projectSlug = project.slug;
 
-  // Regenerate MockData.tsx to ensure dev server has the latest scenario data
-  // This is critical for recapture to show updated data
-  console.log(
-    `[Capture] Regenerating MockData.tsx for scenario: ${scenario.name}`,
-  );
-
-  try {
-    // Load config to find which webapp this analysis belongs to
-    const configPath = path.join(projectRoot, '.codeyam', 'config.json');
-    const configData = await fs.readFile(configPath, 'utf-8');
-    const projectConfig = JSON.parse(configData);
-
-    const filePath = analysis.file.path;
-    console.log(`[Capture] Analysis file path: ${filePath}`);
-
-    // Find which webapp this file belongs to
-    const webapp = projectConfig.webapps?.find((w: { path: string }) =>
-      filePath.startsWith(w.path),
-    );
-
-    if (webapp) {
-      console.log(`[Capture] Found webapp: ${webapp.path}`);
-
-      // Construct the mocksDir path in the local dev environment
-      const localDevProjectPath = `/tmp/codeyam/local-dev/${projectSlug}/project`;
-      const mocksDir = path.join(
-        localDevProjectPath,
-        webapp.path,
-        webapp.appDirectory || 'app',
-        '__codeyamMocks__',
-      );
-
-      console.log(`[Capture] MockData.tsx directory: ${mocksDir}`);
-
-      // Ensure the analysis has its scenarios attached
-      const analysisWithScenarios = {
-        ...analysis,
-        scenarios: analysis.scenarios || [scenario],
-      };
-
-      // If the current scenario isn't in the scenarios array, add it
-      if (!analysisWithScenarios.scenarios.find((s) => s.id === scenario.id)) {
-        analysisWithScenarios.scenarios.push(scenario);
-      }
-
-      await writeMockDataTsx(analysisWithScenarios, scenario, mocksDir);
-      console.log(`[Capture] MockData.tsx regenerated successfully`);
-
-      // Give the dev server time to hot-reload the updated MockData.tsx
-      console.log(`[Capture] Waiting for dev server to reload...`);
-      await new Promise((resolve) => setTimeout(resolve, 2000));
-      console.log(`[Capture] Proceeding with screenshot capture`);
-    } else {
-      console.log(
-        `[Capture] WARNING: Could not find webapp for file ${filePath}, skipping MockData.tsx regeneration`,
-      );
-    }
-  } catch (mockError) {
-    console.error(
-      `[Capture] WARNING: Failed to regenerate MockData.tsx:`,
-      mockError,
-    );
-    // Continue with screenshot capture even if MockData regeneration fails
-  }
-
   // Screenshot path convention: {slug}/{fileId}/{analysisId}/{scenarioName}.png
   // This matches the original capture system in capture.ts
   const sanitizedName = scenario.name
@@ -186,27 +122,98 @@ async function main() {
 
   await fs.mkdir(capturesDir, { recursive: true });
 
-  // Take screenshot
-  console.log(`[Capture] Taking screenshot of: ${url}`);
+  // Helper: take screenshot and verify
+  const captureScreenshot = async () => {
+    console.log(`[Capture] Taking screenshot of: ${url}`);
+
+    const result = await takeElementScreenshot({
+      url,
+      selector: '#component',
+      screenshotPath,
+      viewportWidth,
+      blockPatterns: ['fonts.googleapis.com', 'fonts.gstatic.com'],
+    });
+
+    if (!result.screenshotTaken) {
+      console.error(`[Capture] ERROR: Screenshot was not taken`);
+      process.exit(1);
+    }
 
-  const result = await takeElementScreenshot({
-    url,
-    selector: '#component',
-    screenshotPath,
-    viewportWidth,
-    blockPatterns: ['fonts.googleapis.com', 'fonts.gstatic.com'],
-  });
+    console.log(`[Capture] Screenshot taken successfully`);
 
-  if (!result.screenshotTaken) {
-    console.error(`[Capture] ERROR: Screenshot was not taken`);
-    process.exit(1);
-  }
+    const stats = await fs.stat(screenshotPath);
+    console.log(`[Capture] File saved: ${stats.size} bytes`);
+  };
+
+  // Helper: regenerate MockData.tsx
+  const regenerateMockData = async () => {
+    console.log(
+      `[Capture] Regenerating MockData.tsx for scenario: ${scenario.name}`,
+    );
 
-  console.log(`[Capture] Screenshot taken successfully`);
+    try {
+      const configPath = path.join(projectRoot, '.codeyam', 'config.json');
+      const configData = await fs.readFile(configPath, 'utf-8');
+      const projectConfig = JSON.parse(configData);
 
-  // Verify file was written
-  const stats = await fs.stat(screenshotPath);
-  console.log(`[Capture] File saved: ${stats.size} bytes`);
+      const filePath = analysis.file!.path;
+      console.log(`[Capture] Analysis file path: ${filePath}`);
+
+      const webapp = projectConfig.webapps?.find((w: { path: string }) =>
+        filePath.startsWith(w.path),
+      );
+
+      if (webapp) {
+        console.log(`[Capture] Found webapp: ${webapp.path}`);
+
+        const localDevProjectPath = `/tmp/codeyam/local-dev/${projectSlug}/project`;
+        const mocksDir = path.join(
+          localDevProjectPath,
+          webapp.path,
+          webapp.appDirectory || 'app',
+          '__codeyamMocks__',
+        );
+
+        console.log(`[Capture] MockData.tsx directory: ${mocksDir}`);
+
+        const analysisWithScenarios = {
+          ...analysis,
+          scenarios: analysis.scenarios || [scenario],
+        };
+
+        if (
+          !analysisWithScenarios.scenarios.find((s) => s.id === scenario.id)
+        ) {
+          analysisWithScenarios.scenarios.push(scenario);
+        }
+
+        await writeMockDataTsx(analysisWithScenarios, scenario, mocksDir);
+        console.log(`[Capture] MockData.tsx regenerated successfully`);
+      } else {
+        console.log(
+          `[Capture] WARNING: Could not find webapp for file ${filePath}, skipping MockData.tsx regeneration`,
+        );
+      }
+    } catch (mockError) {
+      console.error(
+        `[Capture] WARNING: Failed to regenerate MockData.tsx:`,
+        mockError,
+      );
+    }
+  };
+
+  if (config.captureCurrentUrl) {
+    // Capture what's currently displayed first, then create MockData for future use
+    await captureScreenshot();
+    await regenerateMockData();
+  } else {
+    // Default: regenerate first, wait for HMR, then capture
+    await regenerateMockData();
+    console.log(`[Capture] Waiting for dev server to reload...`);
+    await new Promise((resolve) => setTimeout(resolve, 2000));
+    console.log(`[Capture] Proceeding with screenshot capture`);
+    await captureScreenshot();
+  }
 
   // Update scenario metadata with new screenshot path
   const updatedMetadata = {

package/analyzer-template/playwright/captureStatic.ts

@@ -40,7 +40,7 @@ export default async function captureStatic({
       const now = new Date().toISOString();
       await updateCommitMetadata({
         commitId: analysis.commitId,
-        updateCallback: (metadata, commit) => {
+        updateCallback: (metadata) => {
           if (metadata.currentRun) {
             metadata.currentRun.firstCaptureAt ??= now;
             metadata.currentRun.lastCaptureAt = now;

package/analyzer-template/playwright/getCodeYamInfo.ts

@@ -1,5 +1,3 @@
-/* eslint-disable */
-
 import { ProjectFramework } from '~codeyam/types';
 
 export interface CodeYamInfo {
@@ -41,7 +39,9 @@ export default async function getCodeYamInfo(
 
       // if controller signals complete, tell capture to shut down
       if (phase === 'COMPLETE') {
-        console.log(`CodeYam DEBUG: getCodeYamInfo received COMPLETE phase, signaling shutdown`);
+        console.log(
+          `CodeYam DEBUG: getCodeYamInfo received COMPLETE phase, signaling shutdown`,
+        );
         if (options?.returnShutdown) {
           return { info: null, shutdown: true };
         }
@@ -57,7 +57,6 @@ export default async function getCodeYamInfo(
       }
 
       // all other cases mean 'keep waiting'
-      console.log(`CodeYam DEBUG: getCodeYamInfo phase=${phase}, info=${info ? 'present' : 'null'}, returning null`);
       if (options?.returnShutdown) {
         return { info: null, shutdown: false };
       }
@@ -74,7 +73,9 @@ export default async function getCodeYamInfo(
     const errorMessage = error.message || '';
     const causeMessage = error.cause?.message || '';
 
-    console.log(`CodeYam DEBUG: getCodeYamInfo caught error - code=${errorCode}, message=${errorMessage}, causeMessage=${causeMessage}`);
+    console.log(
+      `CodeYam DEBUG: getCodeYamInfo caught error - code=${errorCode}, message=${errorMessage}, causeMessage=${causeMessage}`,
+    );
 
     const isConnectionError =
       errorCode === 'ECONNREFUSED' ||
@@ -85,11 +86,15 @@ export default async function getCodeYamInfo(
       causeMessage.includes('ECONNREFUSED');
 
     if (!isConnectionError) {
-      console.log(`CodeYam DEBUG: getCodeYamInfo error is NOT a connection error, rethrowing`);
+      console.log(
+        `CodeYam DEBUG: getCodeYamInfo error is NOT a connection error, rethrowing`,
+      );
       throw error;
     }
     // let caller know the server just isn't up yet (or has shut down)
-    console.log(`CodeYam DEBUG: getCodeYamInfo connection error detected, returning connectionFailed=true`);
+    console.log(
+      `CodeYam DEBUG: getCodeYamInfo connection error detected, returning connectionFailed=true`,
+    );
     if (options?.returnShutdown) {
       return { info: null, shutdown: false, connectionFailed: true };
     }

package/analyzer-template/playwright/takeElementScreenshot.ts

@@ -36,28 +36,43 @@ async function safeAwaitWithReturn<T>(
   }
 }
 
-/** Wait until DOM mutations stop for `quietMs` (default 500 ms). */
-async function waitForDomIdle(page: Page, quietMs = 500) {
+/** Wait until DOM mutations stop for `quietMs` (default 500 ms), or until `maxWaitMs` elapsed. */
+async function waitForDomIdle(page: Page, quietMs = 500, maxWaitMs = 5000) {
   await page.evaluate(
-    ({ quietMs }) =>
+    ({ quietMs, maxWaitMs }) =>
       new Promise<void>((resolve) => {
         let timer: NodeJS.Timeout;
+        const startTime = Date.now();
+
+        const finish = () => {
+          clearTimeout(timer);
+          observer.disconnect();
+          resolve();
+        };
+
         const reset = () => {
           clearTimeout(timer);
-          timer = setTimeout(() => {
-            observer.disconnect();
-            resolve();
-          }, quietMs);
+          // Check if we've exceeded max wait time
+          if (Date.now() - startTime >= maxWaitMs) {
+            finish();
+            return;
+          }
+          timer = setTimeout(finish, quietMs);
         };
+
         const observer = new MutationObserver(reset);
         observer.observe(document, {
           childList: true,
           subtree: true,
           attributes: true,
         });
+
+        // Set up the max wait timeout as a fallback
+        setTimeout(finish, maxWaitMs);
+
         reset();
       }),
-    { quietMs },
+    { quietMs, maxWaitMs },
   );
 }
 
@@ -226,10 +241,10 @@ export default async function takeElementScreenshot({
       `[${screenshotId}] Step 1 complete: Page loaded (success=${gotoResult}), elapsed: ${Date.now() - startTime}ms`,
     );
     awsLog(
-      `[${screenshotId}] Step 2: Waiting for DOM idle (timeout=${domIdle}ms)...`,
+      `[${screenshotId}] Step 2: Waiting for DOM idle (quietMs=500, maxWait=${domIdle}ms)...`,
     );
     const domIdleResult = await safeAwait('dom-idle', () =>
-      waitForDomIdle(page, domIdle),
+      waitForDomIdle(page, 500, domIdle),
     );
     awsLog(
       `[${screenshotId}] Step 2 complete: DOM idle (success=${domIdleResult}), elapsed: ${Date.now() - startTime}ms`,
@@ -262,7 +277,7 @@ export default async function takeElementScreenshot({
         page.waitForLoadState('networkidle', { timeout: pageIdle }),
       );
       await safeAwait('post-script-dom-idle', () =>
-        waitForDomIdle(page, domIdle),
+        waitForDomIdle(page, 500, domIdle),
       );
       awsLog(
         `[${screenshotId}] Step 4 complete: Instructions executed, elapsed: ${Date.now() - startTime}ms`,

package/analyzer-template/playwright/takeScreenshot.ts

@@ -194,12 +194,6 @@ export default async function takeScreenshot({
         const freshScenario = freshScenarios.find(
           (s) => s.name === scenario.name,
         );
-        freshScenario.metadata.screenshotPaths ||= [];
-        if (
-          !freshScenario.metadata.screenshotPaths.includes(screenshotFileName)
-        ) {
-          freshScenario.metadata.screenshotPaths.unshift(screenshotFileName);
-        }
 
         const statusScenario = freshStatus.scenarios.find(
           (s) => s.name === scenario.name,
@@ -208,14 +202,26 @@ export default async function takeScreenshot({
           statusScenario.screenshotFinishedAt = new Date().toISOString();
         }
 
-        if (!screenshotTaken) {
+        // Only add to screenshotPaths if the screenshot was actually taken
+        if (screenshotTaken) {
+          freshScenario.metadata.screenshotPaths ||= [];
+          if (
+            !freshScenario.metadata.screenshotPaths.includes(screenshotFileName)
+          ) {
+            freshScenario.metadata.screenshotPaths.unshift(screenshotFileName);
+          }
+        } else {
           freshScenario.metadata.noScreenshotSaved = true;
-          statusScenario.error = 'Screenshot not taken properly';
+          if (!statusScenario.error) {
+            statusScenario.error = 'Screenshot not taken properly';
+          }
         }
 
         if (isUniform) {
           freshScenario.metadata.isUniformScreenshot = true;
-          statusScenario.error = 'Screenshot is uniform';
+          if (!statusScenario.error) {
+            statusScenario.error = 'Screenshot is uniform';
+          }
         }
       },
     );

package/analyzer-template/playwright/waitForServer.ts

@@ -17,10 +17,18 @@ export interface WaitForServerResult {
   shutdown: boolean;
 }
 
+export interface WaitForServerOptions {
+  // In local CLI mode, treat connection failures as shutdown signal (server should be running)
+  // In cloud mode, connection failures are normal between work items
+  isLocalMode?: boolean;
+}
+
 export default async function waitForServer(
   url: string,
   shouldStop: () => boolean,
+  options?: WaitForServerOptions,
 ): Promise<WaitForServerResult> {
+  const isLocalMode = options?.isLocalMode ?? false;
   let retryDelay = INITIAL_RETRY_DELAY;
   const startTime = Date.now();
   let consecutiveConnectionFailures = 0;
@@ -49,14 +57,21 @@ export default async function waitForServer(
         return { shutdown: true };
       }
 
-      // Check if connection failed (server exited)
+      // Check if connection failed (server exited or not started yet)
       if (result.connectionFailed) {
-        consecutiveConnectionFailures++;
-        // If we've had many consecutive connection failures, the controller has likely exited
-        if (consecutiveConnectionFailures >= MAX_CONNECTION_FAILURES_FOR_SHUTDOWN) {
-          awsLog('CodeYam: Controller connection lost, treating as shutdown');
-          return { shutdown: true };
+        // Only treat connection failures as shutdown in local mode
+        // In cloud mode, connection failures are expected between work items
+        if (isLocalMode) {
+          consecutiveConnectionFailures++;
+          if (
+            consecutiveConnectionFailures >=
+            MAX_CONNECTION_FAILURES_FOR_SHUTDOWN
+          ) {
+            awsLog('CodeYam: Controller connection lost, treating as shutdown');
+            return { shutdown: true };
+          }
         }
+        // In cloud mode, just continue waiting (don't count failures)
       } else {
         consecutiveConnectionFailures = 0;
       }

package/analyzer-template/project/TESTING.md

@@ -0,0 +1,83 @@
+# Testing writeScenarioComponents
+
+This document describes how to test changes to `writeScenarioComponents.ts`.
+
+## 1. Run the specific test
+
+```bash
+npx jest background/src/lib/virtualized/project/__tests__/writeScenarioComponents.test.ts -t "test name here" --no-coverage
+```
+
+## 2. Run all tests in the file
+
+```bash
+npx jest background/src/lib/virtualized/project/__tests__/writeScenarioComponents.test.ts --no-coverage -w 2
+```
+
+## 3. Rebuild and reinstall the CLI
+
+The globally installed CLI must be reinstalled to pick up changes:
+
+```bash
+# Remove the globally installed CLI and rebuild
+rm -rf /Users/jaredcosulich/.nvm/versions/node/v20.16.0/lib/node_modules/@codeyam/codeyam-cli && pnpm cli
+```
+
+## 4. Restart the server in the client project
+
+After rebuilding the CLI, restart the codeyam server in the client project:
+
+```bash
+cd /Users/jaredcosulich/workspace/codeyam/formbricks && codeyam stop & codeyam
+```
+
+## 5. Force analyzer update and run debug
+
+The analyzer is cached in `/tmp/codeyam/local-dev/{project-slug}/codeyam/analyzer`.
+To force it to use the new code:
+
+```bash
+# Remove cached analyzer
+rm -rf /tmp/codeyam/local-dev/formbricks-formbricks/codeyam/analyzer
+
+# Run debug (from the project directory)
+cd /Users/jaredcosulich/workspace/codeyam/formbricks && codeyam debug <analysis-id>
+```
+
+## 6. Verify the fix
+
+```bash
+# Check version in logs (should match version in writeScenarioComponents.ts)
+grep "CodeYam \[v" /tmp/codeyam/local-dev/formbricks-formbricks/codeyam/log.txt | tail -3
+
+# Check generated files
+head -30 /tmp/codeyam/local-dev/formbricks-formbricks/project/path/to/generated/file.tsx
+
+# List data scenario files
+ls -la /tmp/codeyam/local-dev/formbricks-formbricks/project/apps/web/lib/*_data_Default_Scenario*
+```
+
+## 7. Start dev server and test in browser
+
+```bash
+cd /tmp/codeyam/local-dev/formbricks-formbricks/project/apps/web && pnpm next dev --turbopack -p 3112
+```
+
+Test the actual simulation page (not just codeyam-sample):
+
+```bash
+# Format: /static/{project-slug}/{analysis-id}/{entity-name}/{scenario-name}/default
+curl http://localhost:3112/static/formbricks-formbricks/7925cfe4-7789-470d-bddc-2a85e48ef356/SurveysPage/Default_Scenario/default
+```
+
+Visit in browser: http://localhost:3112/static/formbricks-formbricks/7925cfe4-7789-470d-bddc-2a85e48ef356/SurveysPage/Default_Scenario/default
+
+## Version Tracking
+
+The version is defined in `writeScenarioComponents.ts`:
+
+```typescript
+const WRITE_SCENARIO_COMPONENTS_VERSION = '2.5.13-strip-use-server-directive';
+```
+
+Increment this when making changes to help track which version is running.

package/analyzer-template/project/analyzeBaselineCommit.ts

@@ -21,6 +21,8 @@ export interface AnalyzeBaselineCommitArgs {
   desiredAnalyses?: Analysis[];
   force?: boolean;
   fileStore?: LazyFileStore;
+  /** Called after data structures are prepared, signaling orchestration can begin */
+  onAnalysisProducing?: () => void;
 }
 
 export interface AnalyzeBaselineCommitResult {
@@ -40,6 +42,7 @@ export default async function analyzeBaselineCommit({
   desiredAnalyses = [],
   force = false,
   fileStore,
+  onAnalysisProducing,
 }: AnalyzeBaselineCommitArgs): Promise<AnalyzeBaselineCommitResult> {
   awsLog('CodeYam: Analyze - branchCommit (baseline) path', {
     analysisIds,
@@ -64,6 +67,7 @@ export default async function analyzeBaselineCommit({
     context,
     steps,
     fileStore,
+    onAnalysisProducing,
   });
 
   let analysisBranches = Object.values(context.getAnalysisMap())
@@ -99,6 +103,11 @@ export default async function analyzeBaselineCommit({
       entitiesAnalyzedAt: now,
     },
     archiveCurrentRun: true,
+    updateCallback(metadata) {
+      if (metadata.currentRun?.captureCompletedAt) {
+        metadata.currentRun.completedAt = now;
+      }
+    },
   });
 
   awsLog(`CodeYam: Marking baseline completed for project ${project.slug}`);

package/analyzer-template/project/analyzeBranchCommit.ts

@@ -24,6 +24,8 @@ interface AnalyzeBranchCommitArgs {
   context: AnalysisContext;
   steps: string[];
   fileStore?: LazyFileStore;
+  /** Called after data structures are prepared, signaling orchestration can begin */
+  onAnalysisProducing?: () => void;
 }
 
 export default async function analyzeBranchCommit({
@@ -34,6 +36,7 @@ export default async function analyzeBranchCommit({
   context,
   steps,
   fileStore,
+  onAnalysisProducing,
 }: AnalyzeBranchCommitArgs) {
   console.log('CodeYam: Starting Branch Commit Analysis', branchCommit.sha, {
     analysisIds,
@@ -231,6 +234,7 @@ export default async function analyzeBranchCommit({
           steps,
           force: !!process.env.FORCE,
           forceAll: !!process.env.FORCE_ALL,
+          onAnalysisProducing,
         },
       });
     } catch (error) {

package/analyzer-template/project/analyzeFileEntities.ts

@@ -27,6 +27,8 @@ interface AnalyzeFileEntitiesArgs {
   steps: string[];
   context: AnalysisContext;
   fileStore?: LazyFileStore;
+  /** Called after data structures are prepared, signaling orchestration can begin */
+  onAnalysisProducing?: () => void;
 }
 
 export default async function analyzeFileEntities({
@@ -40,6 +42,7 @@ export default async function analyzeFileEntities({
   steps,
   context,
   fileStore,
+  onAnalysisProducing,
 }: AnalyzeFileEntitiesArgs) {
   // Enable baseline mode for E2E tests to skip expensive importedBy tracking
   // This eliminates thousands of DB operations that aren't needed for simulation/capture
@@ -263,6 +266,7 @@ export default async function analyzeFileEntities({
         fresh: !!process.env.FRESH,
         force: !!process.env.FORCE,
         forceAll: !!process.env.FORCE_ALL,
+        onAnalysisProducing,
       },
     });
   }

package/analyzer-template/project/analyzeRegularCommit.ts

@@ -36,6 +36,8 @@ export interface AnalyzeRegularCommitArgs {
   backgroundJob?: BackgroundJob;
   desiredAnalyses?: Analysis[];
   fileStore?: LazyFileStore;
+  /** Called after data structures are prepared, signaling orchestration can begin */
+  onAnalysisProducing?: () => void;
 }
 
 export interface AnalyzeRegularCommitResult {
@@ -97,6 +99,7 @@ export default async function analyzeRegularCommit({
   backgroundJob,
   desiredAnalyses = [],
   fileStore,
+  onAnalysisProducing,
 }: AnalyzeRegularCommitArgs): Promise<AnalyzeRegularCommitResult> {
   awsLog('CodeYam: Analyze - commit path');
 
@@ -174,6 +177,7 @@ export default async function analyzeRegularCommit({
     steps,
     context,
     fileStore,
+    onAnalysisProducing,
   });
   let entities = fileEntities;
 
@@ -249,6 +253,11 @@ export default async function analyzeRegularCommit({
       // In local mode (CLI), let job.js handle archiving after BOTH analysis AND capture complete
       // In cloud mode (Docker), archive immediately after analysis completes
       archiveCurrentRun: !isLocalMode,
+      updateCallback(metadata) {
+        if (metadata.currentRun?.captureCompletedAt) {
+          metadata.currentRun.completedAt = now;
+        }
+      },
     });
   }