fixed build tests

autogpt_platform/frontend/src/components/agptui/CreatorCard.tsx

@@ -35,14 +35,18 @@ export const CreatorCard: React.FC<CreatorCardProps> = ({
     >
       <div className="relative h-[64px] w-[64px]">
         <div className="absolute inset-0 overflow-hidden rounded-full">
-          <Image
-            src={creatorImage}
-            alt={creatorName}
-            width={64}
-            height={64}
-            className="h-full w-full object-cover"
-            priority
-          />
+          {creatorImage ? (
+            <Image
+              src={creatorImage}
+              alt={creatorName}
+              width={64}
+              height={64}
+              className="h-full w-full object-cover"
+              priority
+            />
+          ) : (
+            <div className="h-full w-full bg-neutral-300 dark:bg-neutral-600" />
+          )}
         </div>
       </div>
 

autogpt_platform/frontend/src/components/edit/control/BlocksControl.tsx

@@ -122,8 +122,9 @@ export const BlocksControl: React.FC<BlocksControlProps> = ({
               variant="ghost"
               size="icon"
               data-id="blocks-control-popover-trigger"
-              data-testid="blocks-control-blocks-button dark:hover:bg-slate-800"
+              data-testid="blocks-control-blocks-button"
               name="Blocks"
+              className="dark:hover:bg-slate-800"
             >
               <IconToyBrick />
             </Button>

autogpt_platform/frontend/src/lib/autogpt-server-api/baseClient.ts

@@ -39,8 +39,8 @@ export default class BaseAutoGPTServerAPI {
   private wsMessageHandlers: Record<string, Set<(data: any) => void>> = {};
   private supabaseClient: SupabaseClient | null = null;
   heartbeatInterval: number | null = null;
-  readonly HEARTBEAT_INTERVAL = 30000; // 30 seconds
-  readonly HEARTBEAT_TIMEOUT = 10000; // 10 seconds
+  readonly HEARTBEAT_INTERVAL = 10_0000; // 30 seconds
+  readonly HEARTBEAT_TIMEOUT = 10_000; // 10 seconds
   heartbeatTimeoutId: number | null = null;
 
   constructor(

autogpt_platform/frontend/src/tests/build.spec.ts

@@ -26,8 +26,11 @@ test.describe("Build", () => { //(1)!
   // Reason Ignore: admonishment is in the wrong place visually with correct prettier rules
   // prettier-ignore
   test("user can add a block", async ({ page }) => { //(6)!
+    // workaround for #8788
+    await buildPage.navbar.clickBuildLink();
+    await test.expect(page).toHaveURL(new RegExp("/build"));
+    await buildPage.waitForPageLoad();
     await test.expect(buildPage.isLoaded()).resolves.toBeTruthy(); //(7)!
-    await test.expect(page).toHaveURL(new RegExp("/.*build")); //(8)!
 
     await buildPage.closeTutorial(); //(9)!
     await buildPage.openBlocksPanel(); //(10)!

autogpt_platform/frontend/src/tests/monitor.spec.ts

@@ -18,7 +18,7 @@ test.describe("Monitor", () => {
     // Start each test with login using worker auth
     await page.goto("/login");
     await loginPage.login(testUser.email, testUser.password);
-    await test.expect(page).toHaveURL("/");
+    await test.expect(page).toHaveURL("/store");
 
     // add a test agent
     const basicBlock = await buildPage.getBasicBlock();

autogpt_platform/frontend/src/tests/pages/base.page.ts

@@ -12,6 +12,6 @@ export class BasePage {
   async waitForPageLoad() {
     // Common page load waiting logic
     console.log(`waiting for page to load`);
-    await this.page.waitForLoadState("networkidle", { timeout: 10000 });
+    await this.page.waitForLoadState("domcontentloaded", { timeout: 10_000 });
   }
 }

autogpt_platform/frontend/src/tests/pages/build.page.ts

@@ -15,7 +15,7 @@ export class BuildPage extends BasePage {
   async closeTutorial(): Promise<void> {
     console.log(`closing tutorial`);
     try {
-      await this.page.getByRole("button", { name: "Skip Tutorial" }).click();
+      await this.page.getByRole("button", { name: "Skip Tutorial", exact: true }).click();
     } catch (error) {
       console.info("Error closing tutorial:", error);
     }
@@ -276,7 +276,7 @@ export class BuildPage extends BasePage {
   async isLoaded(): Promise<boolean> {
     console.log(`checking if build page is loaded`);
     try {
-      await this.page.waitForLoadState("networkidle", { timeout: 10_000 });
+      await this.page.waitForLoadState("domcontentloaded", { timeout: 10_000 });
       return true;
     } catch (error) {
       return false;

autogpt_platform/frontend/src/tests/pages/login.page.ts

@@ -36,7 +36,7 @@ export class LoginPage {
     await loginButton.waitFor({ state: "visible" });
 
     // Start waiting for navigation before clicking
-    const navigationPromise = this.page.waitForURL("/", { timeout: 60000 });
+    const navigationPromise = this.page.waitForURL("/", { timeout: 10_000 });
 
     console.log("About to click login button"); // Debug log
     await loginButton.click();
@@ -45,7 +45,7 @@ export class LoginPage {
     await navigationPromise;
 
     console.log("Navigation complete, waiting for network idle"); // Debug log
-    await this.page.waitForLoadState("load", { timeout: 60000 });
+    await this.page.waitForLoadState("load", { timeout: 10_000 });
     console.log("Login process complete"); // Debug log
   }
 }

autogpt_platform/frontend/src/tests/pages/monitor.page.ts

@@ -50,7 +50,7 @@ export class MonitorPage extends BasePage {
       // Wait for table headers to be visible (indicates table structure is ready)
       await this.page.locator("thead th").first().waitFor({
         state: "visible",
-        timeout: 5_000,
+        timeout: 10_000,
       });
 
       // Wait for either a table row or an empty tbody to be present
@@ -58,14 +58,14 @@ export class MonitorPage extends BasePage {
         // Wait for at least one row
         this.page.locator("tbody tr[data-testid]").first().waitFor({
           state: "visible",
-          timeout: 5_000,
+          timeout: 10_000,
         }),
         // OR wait for an empty tbody (indicating no agents but table is loaded)
         this.page
           .locator("tbody[data-testid='agent-flow-list-body']:empty")
           .waitFor({
             state: "visible",
-            timeout: 5_000,
+            timeout: 10_000,
           }),
       ]);
 

autogpt_platform/frontend/src/tests/pages/navbar.page.ts

@@ -4,44 +4,40 @@ export class NavBar {
   constructor(private page: Page) {}
 
   async clickProfileLink() {
-    // await this.page.getByTestId("profile-link").click();
-
-    await this.page.getByRole("button", { name: "CN" }).click();
-    await this.page.getByRole("menuitem", { name: "Profile" }).click();
+    await this.page.getByTestId("profile-popout-menu-trigger").click();
+    await this.page.getByText("Edit profile").click();
   }
 
   async clickMonitorLink() {
-    await this.page.getByTestId("monitor-nav-link").click();
+    await this.page.getByRole("link", { name: "Library" }).click();
   }
 
   async clickBuildLink() {
-    await this.page.getByTestId("build-nav-link").click();
+    await this.page.locator('a[href="/build"] div').click();
   }
 
   async clickMarketplaceLink() {
-    await this.page.getByTestId("marketplace-nav-link").click();
+    await this.page.locator('a[href="/store"]').click();
   }
 
   async getUserMenuButton() {
-    return this.page.getByRole("button", { name: "CN" });
+    return this.page.getByTestId("profile-popout-menu-trigger");
   }
 
   async clickUserMenu() {
-    await (await this.getUserMenuButton()).click();
+    await this.page.getByTestId("profile-popout-menu-trigger").click();
   }
 
   async logout() {
     await this.clickUserMenu();
-    await this.page.getByRole("menuitem", { name: "Log out" }).click();
+    await this.page.getByText("Log out").click();
   }
 
   async isLoggedIn(): Promise<boolean> {
     try {
-      await (
-        await this.getUserMenuButton()
-      ).waitFor({
+      await this.page.getByTestId("profile-popout-menu-trigger").waitFor({
         state: "visible",
-        timeout: 5000,
+        timeout: 10_000,
       });
       return true;
     } catch {

autogpt_platform/frontend/src/tests/pages/profile.page.ts

@@ -31,7 +31,7 @@ export class ProfilePage extends BasePage {
 
     await this.page.getByTestId("profile-email").waitFor({
       state: "visible",
-      timeout: 60_000,
+      timeout: 10_000,
     });
 
     await this.page.waitForLoadState("networkidle", { timeout: 60_000 });

autogpt_platform/frontend/src/tests/profile.spec.ts

@@ -20,7 +20,7 @@ test.describe("Profile", () => {
     await profilePage.navbar.clickProfileLink();
     // workaround for #8788
     // sleep for 10 seconds to allow page to load due to bug in our system
-    await page.waitForTimeout(10000);
+    await page.waitForTimeout(10_000);
     await page.reload();
     await page.reload();
     await test.expect(profilePage.isLoaded()).resolves.toBeTruthy();