make it easy to write multiple e2e tests (#280)

src/app/TitleBar.tsx

@@ -72,6 +72,7 @@ export const TitleBar = () => {
         <div className="pl-20"></div>
         <img src={logo} alt="Dyad Logo" className="w-6 h-6 mr-2" />
         <Button
+          data-testid="title-bar-app-name-button"
           variant="outline"
           size="sm"
           className={`hidden @md:block no-app-region-drag text-sm font-medium ${
@@ -83,6 +84,7 @@ export const TitleBar = () => {
         </Button>
         {isDyadPro && (
           <Button
+            data-testid="title-bar-dyad-pro-button"
             onClick={() => {
               navigate({
                 to: providerSettingsRoute.id,

src/lib/schemas.ts

@@ -122,6 +122,11 @@ export const UserSettingsSchema = z.object({
   enableProSmartFilesContextMode: z.boolean().optional(),
   selectedTemplateId: z.string().optional(),
 
+  ////////////////////////////////
+  // E2E TESTING ONLY.
+  ////////////////////////////////
+  isTestMode: z.boolean().optional(),
+
   ////////////////////////////////
   // DEPRECATED.
   ////////////////////////////////

src/main.ts

@@ -58,6 +58,11 @@ export async function onFirstRunMaybe() {
       hasRunBefore: true,
     });
   }
+  if (process.env.E2E_TEST_BUILD) {
+    writeSettings({
+      isTestMode: true,
+    });
+  }
 }
 
 /**

src/pages/app-details.tsx

@@ -161,7 +161,10 @@ export default function AppDetailsPage() {
   const fullAppPath = appBasePath.replace("$APP_BASE_PATH", selectedApp.path);
 
   return (
-    <div className="relative min-h-screen p-4 w-full">
+    <div
+      className="relative min-h-screen p-4 w-full"
+      data-testid="app-details-page"
+    >
       <Button
         onClick={() => router.history.back()}
         variant="outline"

src/pages/home.tsx

@@ -124,7 +124,9 @@ export default function HomePage() {
         chatId: result.chatId,
         attachments,
       });
-      await new Promise((resolve) => setTimeout(resolve, 2000));
+      await new Promise((resolve) =>
+        setTimeout(resolve, settings?.isTestMode ? 0 : 2000),
+      );
 
       setInputValue("");
       setSelectedAppId(result.app.id);

src/paths/paths.ts

@@ -2,6 +2,9 @@ import path from "node:path";
 import os from "node:os";
 
 export function getDyadAppPath(appPath: string): string {
+  if (process.env.E2E_TEST_BUILD) {
+    return path.join("/tmp", "dyad-apps-test", appPath);
+  }
   return path.join(os.homedir(), "dyad-apps", appPath);
 }