refactor(tests): enhance E2E run page tests for comprehensive flow validation

- Update run-page.spec.ts to verify complete run flow, including landing page load, run initiation, timeline heading visibility, and screenshot capture within 20 seconds.
- Remove obsolete tests and consolidate steps for clarity and efficiency.
- Delete unused agent communication and development scripts to streamline the codebase.

Author: nirukk52

frontend/tests/e2e/run-page.spec.ts

@@ -4,14 +4,15 @@ import { TEST_PACKAGE_NAME, TEST_APP_CONFIG } from "./helpers";
 /**
  * /run page E2E regression suite
  * 
- * Verifies core functionality:
- * - Run page loads after starting a run
- * - Run Timeline header is visible
+ * Verifies complete run flow:
+ * - Landing page loads correctly
+ * - Run can be started successfully
+ * - Run page displays timeline heading
+ * - Screenshots appear within 20 seconds
  * 
  * Prerequisites:
  * - Backend and frontend services running
  * - Test package from .env: ${TEST_PACKAGE_NAME}
- * - All tests use the same package for consistency
  */
 test.describe("/run page smoke tests", () => {
 	test.beforeAll(() => {
@@ -23,70 +24,57 @@ test.describe("/run page smoke tests", () => {
 	});
 
 	/**
-	 * Verify run page opens and displays Run Timeline header.
-	 * This is the baseline test for detecting UI regressions.
+	 * Complete run flow test: validates entire user journey from landing to screenshot discovery.
+	 * 
+	 * Steps:
+	 * 1. Load landing page and verify it's healthy
+	 * 2. Start a new run
+	 * 3. Verify run page loads with timeline heading
+	 * 4. Wait 20 seconds for agent to explore app
+	 * 5. Verify at least one screenshot appears in gallery
 	 * 
 	 * NOTE: Requires backend to be running and able to start runs.
 	 * Uses package from .env: ${TEST_PACKAGE_NAME}
 	 */
-	test("should open run page and show Run Timeline text", async ({ page }) => {
-		// Navigate to landing page
+	test("should load page, start run, show heading, wait 20s, and verify screenshots", async ({ page }) => {
+		// STEP 1: Navigate to landing page and verify it loads
 		await page.goto("/");
-		
-		// Wait for page to fully load
 		await expect(page).toHaveTitle(/ScreenGraph/i);
 
-		// Find and click the "Detect My First Drift" button
-		// Using getByRole for accessibility-friendly selection
+		// Verify the main CTA button exists
 		const runButton = page.getByRole("button", { name: /detect.*drift/i });
 		await expect(runButton).toBeVisible();
 
-		// Click the button - this will call the backend API and navigate
+		// STEP 2: Click button to start run
 		await runButton.click();
 
-		// Wait for navigation to /run page (increased timeout for API call + navigation)
+		// STEP 3: Wait for navigation to /run page
 		await page.waitForURL(/\/run\/[a-f0-9-]+/i, { 
 			waitUntil: "domcontentloaded",
 			timeout: 30000 
 		});
 
-		// Verify Run Timeline text is visible in the H1 heading
-		// This is the key regression check - if timeline UI breaks, this will fail
-		// Use getByRole to be specific and avoid strict mode violations
+		// STEP 4: Verify Run Timeline heading is visible
 		const timelineHeading = page.getByRole("heading", { name: /run timeline/i });
 		await expect(timelineHeading).toBeVisible({ timeout: 10000 });
 
 		// Verify Cancel Run button exists (indicates page fully loaded)
 		const cancelButton = page.getByRole("button", { name: /cancel run/i });
 		await expect(cancelButton).toBeVisible();
-	});
-
-	/**
-	 * Verify landing page loads correctly before testing run flow.
-	 * This is a sanity check to ensure frontend is healthy.
-	 */
-	test("should load landing page successfully", async ({ page }) => {
-		await page.goto("/");
 
-		// Verify page title
-		await expect(page).toHaveTitle(/ScreenGraph/i);
+		// STEP 5: Wait 20 seconds for agent to explore and capture screens
+		await page.waitForTimeout(20000);
 
-		// Verify the main CTA button exists
-		const runButton = page.getByRole("button", { name: /detect.*drift/i });
-		await expect(runButton).toBeVisible();
-		
-		// Verify no console errors on load
-		const consoleErrors: string[] = [];
-		page.on("console", (msg) => {
-			if (msg.type() === "error") {
-				consoleErrors.push(msg.text());
-			}
-		});
+		// STEP 6: Verify at least one screenshot appeared in the gallery
+		// Look for "Discovered Screens" heading which indicates screens have loaded
+		const discoveredHeading = page.getByRole("heading", { name: /discovered screens/i });
+		await expect(discoveredHeading).toBeVisible({ timeout: 5000 });
 
-		await page.waitForTimeout(1000);
+		// Verify at least one screenshot image is rendered
+		const screenshots = page.locator('img[alt^="Screen"]');
+		const screenshotCount = await screenshots.count();
 
-		// Assert no console errors
-		expect(consoleErrors).toHaveLength(0);
+		expect(screenshotCount).toBeGreaterThan(0);
 	});
 });