add network idles

playwright/tests/collaboration-feature/goal-collaboration-feature.spec.ts

@@ -108,13 +108,20 @@ test.describe("Goal Sharing Feature", () => {
     });
 
     test(`initiate collaboration between User ${sharer} and User ${receiver}`, async () => {
+      await receiverPage().waitForLoadState("networkidle");
       await collaborateFlow(receiverPage(), currentGoalTitle);
     });
 
     test(`check if collaborated goal is visible in User ${receiver}'s MyGoal`, async () => {
       await receiverPage().goto("http://127.0.0.1:3000/");
       await receiverPage().getByRole("button", { name: "Goals" }).click();
-      await expect(receiverPage().locator(".goal-title").first().locator("span")).toContainText(currentGoalTitle);
+      const userGoalWithContact = receiverPage()
+        .locator(".user-goal-dark")
+        .filter({
+          has: receiverPage().locator(".contact-icon"),
+        });
+
+      await expect(userGoalWithContact.locator(".goal-title span")).toContainText(currentGoalTitle);
     });
   });
 
@@ -125,7 +132,14 @@ test.describe("Goal Sharing Feature", () => {
         await goalActionFlow(sharerPage(), "Edit", currentGoalTitle);
         await sharerPage().locator(".header-title").locator("input").fill(`${currentGoalTitle} edited by ${sharer}`);
         await sharerPage().locator(".action-btn-container").locator(".action-btn").click();
-        currentGoalTitle = await sharerPage().locator(".goal-title").first().locator("span").innerText();
+        // Locate the .goal-title span within the user-goal-dark div that also contains the .contact-icon
+        currentGoalTitle = await sharerPage()
+          .locator(".user-goal-dark")
+          .filter({
+            has: sharerPage().locator(".contact-icon"),
+          })
+          .locator(".goal-title span")
+          .innerText();
       });
 
       test(`goal update by ${sharer}: check if User ${receiverFirst} received updated goal from User ${sharer}`, async () => {

playwright/utils/collaboration-feature-utils.ts

@@ -10,15 +10,13 @@ export async function goalActionFlow(page: Page, action: string, goalTitle: stri
   const goalDiv = await page.locator(".user-goal-main").filter({ hasText: new RegExp(`^${goalTitle}$`) });
   console.log(goalDiv);
 
-  // Find the .goal-dd-outer associated with the goal title 'Test Goal'
   const goalDropdown = await page
     .locator(".user-goal-main")
     .filter({
       has: page.locator('.goal-title:has-text("Test Goal")'),
     })
     .locator(".goal-dd-outer");
 
-  // Click the specific .goal-dd-outer
   await goalDropdown.click();
 
   await page
@@ -53,7 +51,7 @@ export async function waitForResponseConfirmation(
       console.log(`Response status: ${response.status()}`);
       console.log(`Response body: ${responseBody}`);
 
-      return; // Exit after success
+      return;
     } catch (error) {
       console.warn(`Attempt ${attempt} failed. Retrying in ${retryDelay}ms...`);
       if (attempt === maxRetries) {
@@ -66,13 +64,7 @@ export async function waitForResponseConfirmation(
   }
 }
 
-export async function addContact(
-  page: Page,
-  contactName: string,
-  goalTitle: string,
-  expectedApiResponse1: string,
-  expectedApiResponse2: string,
-): Promise<string> {
+export async function addContact(page: Page, contactName: string, goalTitle: string): Promise<string> {
   const apiServerUrl = "https://sfk3sq5mfzgfjfy3hytp4tmon40bbjpu.lambda-url.eu-west-1.on.aws/";
   await goToShareGoalModalFlow(page, goalTitle);
 
@@ -120,7 +112,15 @@ export async function verifyUpdatedGoal(
         page.waitForResponse((res) => res.status() === 200 && res.url().includes(apiUrlGoal), { timeout: 10000 }),
       ]);
       await page.getByRole("button", { name: "Goals" }).click();
-      await page.locator(".goal-dd-outer").first().click();
+      await page.waitForLoadState("networkidle");
+      const goalDropdownWithContact = page
+        .locator(".user-goal-dark")
+        .filter({
+          has: page.locator(".contact-icon"),
+        })
+        .locator(".goal-dd-outer");
+
+      await goalDropdownWithContact.click();
 
       await page.waitForSelector(`text=${expectedGoalTitle}`, { timeout: 10000 });