Merge pull request #1744 from QAComet/QAComet/manage-users-roles-update

test: fix flakiness in manage roles and users tests

packages/e2e-tests/fixtures/admin/edit-user-page.js

@@ -9,7 +9,7 @@ export class AdminEditUserPage extends AuthenticatedPage {
   /**
    * @param {import('@playwright/test').Page} page
    */
-  constructor (page) {
+  constructor(page) {
     super(page);
     this.fullNameInput = page.getByTestId('full-name-input');
     this.emailInput = page.getByTestId('email-input');
@@ -18,10 +18,20 @@ export class AdminEditUserPage extends AuthenticatedPage {
     this.pageTitle = page.getByTestId('edit-user-title');
   }
 
-  generateUser () {
+  /**
+   * @param {string} fullName
+   */
+  async waitForLoad(fullName) {
+    return await this.page.waitForFunction((fullName) => {
+      const el = document.querySelector("[data-test='full-name-input']");
+      return el && el.value === fullName;
+    }, fullName);
+  }
+
+  generateUser() {
     return {
       fullName: faker.person.fullName(),
       email: faker.internet.email(),
-    }
+    };
   }
 }

packages/e2e-tests/fixtures/login-page.js

@@ -37,6 +37,7 @@ export class LoginPage extends BasePage {
     password = LoginPage.defaultPassword
   ) {
     await this.page.goto(this.path);
+    await this.emailTextField.waitFor({ state: 'visible' });
     await this.emailTextField.fill(email);
     await this.passwordTextField.fill(password);
 

packages/e2e-tests/tests/admin/manage-roles.spec.js

@@ -5,8 +5,7 @@ test.describe('Role management page', () => {
   test('Admin role is not deletable', async ({ adminRolesPage }) => {
     await adminRolesPage.navigateTo();
     const adminRow = await adminRolesPage.getRoleRowByName('Admin');
-    const rowCount = await adminRow.count();
+    await expect(adminRow).toHaveCount(1);
-    await expect(rowCount).toBe(1);
     const data = await adminRolesPage.getRowData(adminRow);
     await expect(data.role).toBe('Admin');
     await expect(data.canEdit).toBe(true);
@@ -42,8 +41,7 @@ test.describe('Role management page', () => {
         const roleRow = await adminRolesPage.getRoleRowByName(
           'Create Edit Test'
         );
-        const rowCount = await roleRow.count();
+        await expect(roleRow).toHaveCount(1);
-        await expect(rowCount).toBe(1);
         const roleData = await adminRolesPage.getRowData(roleRow);
         await expect(roleData.role).toBe('Create Edit Test');
         await expect(roleData.description).toBe('Test description');
@@ -76,8 +74,7 @@ test.describe('Role management page', () => {
         const roleRow = await adminRolesPage.getRoleRowByName(
           'Create Update Test'
         );
-        const rowCount = await roleRow.count();
+        await expect(roleRow).toHaveCount(1);
-        await expect(rowCount).toBe(1);
         const roleData = await adminRolesPage.getRowData(roleRow);
         await expect(roleData.role).toBe('Create Update Test');
         await expect(roleData.description).toBe('Update test description');
@@ -105,8 +102,7 @@ test.describe('Role management page', () => {
       await deleteModal.modal.waitFor({
         state: 'detached',
       });
-      const rowCount = await roleRow.count();
+      await expect(roleRow).toHaveCount(0);
-      await expect(rowCount).toBe(0);
     });
   });
 
@@ -468,7 +464,6 @@ test('Accessibility of role management page', async ({
     await deleteModal.modal.waitFor({
       state: 'detached',
     });
-    const rowCount = await roleRow.count();
+    await expect(roleRow).toHaveCount(0);
-    await expect(rowCount).toBe(0);
   });
 });

packages/e2e-tests/tests/admin/manage-users.spec.js

@@ -60,6 +60,7 @@ test.describe('User management page', () => {
           
           let userRow = await adminUsersPage.getUserRowByEmail(user.email);
           await adminUsersPage.clickEditUser(userRow);
+          await adminEditUserPage.waitForLoad(user.fullName);
           const newUserInfo = adminEditUserPage.generateUser();
           await adminEditUserPage.fullNameInput.fill(newUserInfo.fullName);
           await adminEditUserPage.updateButton.click();
@@ -269,7 +270,7 @@ test.describe('User management page', () => {
           await adminUsersPage.findUserPageWithEmail(user2.email);
           let userRow = await adminUsersPage.getUserRowByEmail(user2.email);
           await adminUsersPage.clickEditUser(userRow);
-          
+          await adminEditUserPage.waitForLoad(user2.fullName);
           await adminEditUserPage.emailInput.fill(user1.email);
           const editPageUrl = page.url();
           await adminEditUserPage.updateButton.click();