update(test): fix chats tests on CI (#131)

playwright.config.ts

@@ -17,7 +17,7 @@ export default defineConfig({
   /* Fail the build on CI if you accidentally left test.only in the source code. */
   forbidOnly: !!process.env.CI,
   /* Retry on CI only */
-  retries: process.env.CI ? 2 : 0,
+  retries: process.env.CI ? 2 : 1,
   /* Opt out of parallel tests on CI. */
   workers: process.env.CI ? 1 : undefined,
   /* Reporter to use. See https://playwright.dev/docs/test-reporters */

playwright/PageObjects/FriendsScreen.ts

@@ -246,15 +246,15 @@ export class FriendsScreen extends MainPage {
   }
 
   async validateBlockedUserExists() {
-    await this.textNoBlockedUsers.waitFor({
-      state: "detached",
-    });
+    await this.page
+      .getByTestId("button-friend-unblock")
+      .waitFor({ state: "visible" });
   }
 
   async validateIncomingRequestExists() {
-    await this.textNoIncomingRequests.waitFor({
-      state: "detached",
-    });
+    await this.page
+      .getByTestId("button-friend-accept")
+      .waitFor({ state: "visible" });
   }
 
   async validateNoBlockedUsersExist() {
@@ -286,9 +286,9 @@ export class FriendsScreen extends MainPage {
   }
 
   async validateOutgoingRequestExists() {
-    await this.textNoOutgoingRequests.waitFor({
-      state: "detached",
-    });
+    await this.page
+      .getByTestId("button-friend-cancel")
+      .waitFor({ state: "visible" });
   }
 
   async validateToastCannotAddYourself() {

playwright/fixtures/setup.ts

@@ -1,9 +1,9 @@
 import {
   test as base,
-  BrowserContext,
   chromium,
-  Page,
-  Browser,
+  firefox,
+  type BrowserContext,
+  type Page,
 } from "@playwright/test";
 import { faker } from "@faker-js/faker";
 import { AuthNewAccount } from "../PageObjects/AuthNewAccount";
@@ -33,28 +33,18 @@ import { SettingsRealms } from "playwright/PageObjects/Settings/SettingsRealms";
 type MyFixtures = {
   authNewAccount: AuthNewAccount;
   firstUserContext: {
-    browser: Browser;
     context: BrowserContext;
     page: Page;
-    authNewAccount: AuthNewAccount;
-    createOrImport: CreateOrImportPage;
-    loginPinPage: LoginPinPage;
-    saveRecoverySeed: SaveRecoverySeedPage;
-    chatsMainPage: ChatsMainPage;
-    username: string;
-    status: string;
   };
   secondUserContext: {
-    browser: Browser;
     context: BrowserContext;
     page: Page;
-    authNewAccount: AuthNewAccount;
-    createOrImport: CreateOrImportPage;
-    loginPinPage: LoginPinPage;
-    saveRecoverySeed: SaveRecoverySeedPage;
-    chatsMainPage: ChatsMainPage;
-    username: string;
-    status: string;
+  };
+  chatUserContexts: {
+    contextOne: BrowserContext;
+    pageOne: Page;
+    contextTwo: BrowserContext;
+    pageTwo: Page;
   };
   chatsMainPage: ChatsMainPage;
   createOrImport: CreateOrImportPage;
@@ -99,7 +89,6 @@ export const test = base.extend<MyFixtures>({
     const authNewAccount = new AuthNewAccount(page);
     const loginPinPage = new LoginPinPage(page);
     const saveRecoverySeed = new SaveRecoverySeedPage(page);
-    const chatsMainPage = new ChatsMainPage(page);
     const username: string = "ChatUserA";
     const status: string = faker.lorem.sentence(3);
 
@@ -124,26 +113,16 @@ export const test = base.extend<MyFixtures>({
     // Click on I Saved It
     await saveRecoverySeed.clickOnSavedIt();
 
-    // Go to Friends
-    await chatsMainPage.goToFriends();
-
     // Pass the context, browser, and page to the test
     await use({
-      browser,
       context,
       page,
-      authNewAccount,
-      createOrImport,
-      loginPinPage,
-      saveRecoverySeed,
-      chatsMainPage,
-      username,
-      status,
     });
 
     // Close the context and browser after the test is done
+    await context.clearCookies();
+    await context.clearPermissions();
     await context.close();
-    await browser.close();
   },
 
   secondUserContext: async ({}, use) => {
@@ -155,7 +134,6 @@ export const test = base.extend<MyFixtures>({
     const authNewAccount = new AuthNewAccount(page);
     const loginPinPage = new LoginPinPage(page);
     const saveRecoverySeed = new SaveRecoverySeedPage(page);
-    const chatsMainPage = new ChatsMainPage(page);
     const username: string = "ChatUserB";
     const status: string = faker.lorem.sentence(3);
 
@@ -180,26 +158,125 @@ export const test = base.extend<MyFixtures>({
     // Click on I Saved It
     await saveRecoverySeed.clickOnSavedIt();
 
-    // Go to Friends
-    await chatsMainPage.goToFriends();
-
     // Pass the context, browser, and page to the test
     await use({
-      browser,
       context,
       page,
-      authNewAccount,
-      createOrImport,
-      loginPinPage,
-      saveRecoverySeed,
-      chatsMainPage,
-      username,
-      status,
     });
 
     // Close the context and browser after the test is done
+    await context.clearCookies();
+    await context.clearPermissions();
     await context.close();
-    await browser.close();
+  },
+
+  chatUserContexts: async ({}, use) => {
+    // Declare all constants required for the precondition steps
+    const browserOne = await chromium.launch();
+    const browserTwo = await firefox.launch();
+    const contextOne = await browserOne.newContext();
+    const contextTwo = await browserTwo.newContext();
+    const pageOne = await contextOne.newPage();
+    const pageTwo = await contextOne.newPage();
+    const authNewAccountFirst = new AuthNewAccount(pageOne);
+    const authNewAccountSecond = new AuthNewAccount(pageTwo);
+    const chatsMainPageFirst = new ChatsMainPage(pageOne);
+    const chatsMainPageSecond = new ChatsMainPage(pageTwo);
+    const createOrImportFirst = new CreateOrImportPage(pageOne);
+    const createOrImportSecond = new CreateOrImportPage(pageTwo);
+    const friendsScreenFirst = new FriendsScreen(pageOne);
+    const friendsScreenSecond = new FriendsScreen(pageTwo);
+    const loginPinPageFirst = new LoginPinPage(pageOne);
+    const loginPinPageSecond = new LoginPinPage(pageTwo);
+    const saveRecoverySeedFirst = new SaveRecoverySeedPage(pageOne);
+    const saveRecoverySeedSecond = new SaveRecoverySeedPage(pageTwo);
+    const username: string = "ChatUserA";
+    const usernameTwo: string = "ChatUserB";
+    const status: string = faker.lorem.sentence(3);
+
+    // Grant clipboard permissions to context one
+    await contextOne.grantPermissions(["clipboard-read", "clipboard-write"]);
+
+    // Start browsers
+    await createOrImportFirst.navigateTo();
+    await createOrImportSecond.navigateTo();
+
+    // Click on Create New Account
+    await createOrImportFirst.clickCreateNewAccount();
+    await createOrImportSecond.clickCreateNewAccount();
+
+    // Enter username and Status and click on create account
+    await authNewAccountFirst.validateLoadingHeader();
+    await authNewAccountFirst.typeOnUsername(username);
+    await authNewAccountFirst.typeOnStatus(status);
+    await authNewAccountFirst.clickOnCreateAccount();
+    await authNewAccountSecond.validateLoadingHeader();
+    await authNewAccountSecond.typeOnUsername(usernameTwo);
+    await authNewAccountSecond.typeOnStatus(status);
+    await authNewAccountSecond.clickOnCreateAccount();
+
+    // Enter Pin
+    await loginPinPageFirst.waitUntilPageIsLoaded();
+    await loginPinPageFirst.enterDefaultPin();
+    await loginPinPageSecond.waitUntilPageIsLoaded();
+    await loginPinPageSecond.enterDefaultPin();
+
+    // Click on I Saved It
+    await saveRecoverySeedFirst.clickOnSavedIt();
+    await saveRecoverySeedSecond.clickOnSavedIt();
+
+    // Go to Friends Screen
+    await chatsMainPageFirst.goToFriends();
+    await chatsMainPageSecond.goToFriends();
+
+    // Copy DID and save it into a constant
+    await friendsScreenFirst.copyDIDFromContextMenu();
+    const handle = await pageOne.evaluateHandle(() =>
+      navigator.clipboard.readText(),
+    );
+    const didKeyFirstUser = await handle.jsonValue();
+
+    // Copy DID and save it into a constant
+    await friendsScreenSecond.copyDIDFromContextMenu();
+
+    // Now, add the first user as a friend
+    await friendsScreenSecond.addFriend(didKeyFirstUser);
+
+    // H6 - Toast Notification with Your request is making it's way! should appear after sending a friend request
+    await friendsScreenSecond.validateToastRequestSent();
+
+    // With First User, go to requests list and accept friend request
+    await friendsScreenFirst.goToChat();
+    await chatsMainPageFirst.addSomeone.waitFor({ state: "visible" });
+    await friendsScreenFirst.goToFriends();
+    await friendsScreenFirst.goToRequestList();
+    await friendsScreenFirst.validateIncomingRequestExists();
+    await friendsScreenFirst.acceptFriendRequest(usernameTwo);
+
+    // With First User, go to All Friends and click on Chat Button
+    await friendsScreenFirst.goToAllFriendsList();
+    await friendsScreenFirst.chatWithFriend(usernameTwo);
+
+    // With Second User, go to All Friends and click on Chat Button
+    await friendsScreenSecond.goToRequestList();
+    await friendsScreenSecond.goToAllFriendsList();
+    await friendsScreenSecond.chatWithFriend(username);
+
+    // Pass the context, browser, and page to the test
+    await use({
+      contextOne,
+      pageOne,
+      contextTwo,
+      pageTwo,
+    });
+
+    // Close the context and browser after the test is done
+    await contextOne.clearCookies();
+    await contextOne.clearPermissions();
+    await contextOne.close();
+    await contextTwo.clearCookies();
+    await contextTwo.clearPermissions();
+    await contextTwo.close();
   },
 
   createOrImport: async ({ page }, use) => {
@@ -222,7 +299,9 @@ export const test = base.extend<MyFixtures>({
     // Declare all constants required for the precondition steps
     const page = await context.newPage();
     await use(page);
-    await page.close();
+    await context.clearCookies();
+    await context.clearPermissions();
+    await context.close();
   },
 
   saveRecoverySeed: async ({ page }, use) => {