test: Flaky admin search users (#37501)

Author: dougfabris

apps/meteor/tests/e2e/admin-users-custom-fields.spec.ts

@@ -61,9 +61,7 @@ test.describe('Admin users custom fields', () => {
 
 	test('should allow admin to add user custom fields', async () => {
 		await test.step('should find and click on add test user', async () => {
-			await poAdmin.inputSearchUsers.fill(addTestUser.data.username);
-
-			await expect(poAdmin.getUserRowByUsername(addTestUser.data.username)).toBeVisible();
+			await poAdmin.searchUser(addTestUser.data.username);
 			await poAdmin.getUserRowByUsername(addTestUser.data.username).click();
 		});
 
@@ -93,9 +91,7 @@ test.describe('Admin users custom fields', () => {
 
 	test('should allow admin to update existing user custom fields', async () => {
 		await test.step('should find and click on update test user', async () => {
-			await poAdmin.inputSearchUsers.fill(updateTestUser.data.username);
-
-			await expect(poAdmin.getUserRowByUsername(updateTestUser.data.username)).toBeVisible();
+			await poAdmin.searchUser(updateTestUser.data.username);
 			await poAdmin.getUserRowByUsername(updateTestUser.data.username).click();
 		});
 
@@ -144,9 +140,7 @@ test.describe('Admin users custom fields', () => {
 
 		test('should not render fields with invalid custom field type', async () => {
 			await test.step('should find and click on add test user', async () => {
-				await poAdmin.inputSearchUsers.fill(addTestUser.data.username);
-
-				await expect(poAdmin.getUserRowByUsername(addTestUser.data.username)).toBeVisible();
+				await poAdmin.searchUser(addTestUser.data.username);
 				await poAdmin.getUserRowByUsername(addTestUser.data.username).click();
 			});
 

apps/meteor/tests/e2e/admin-users-role-management.spec.ts

@@ -28,12 +28,9 @@ test.describe('Admin > Users Role Management', () => {
 		});
 
 		test('Make a newly created user as admin', async () => {
-			await admin.inputSearchUsers.fill(userWithoutAdminAccess.data.username);
-
 			await test.step('should be visible in the All tab', async () => {
 				await admin.getTabByName().click();
-				await expect(admin.getUserRowByUsername(userWithoutAdminAccess.data.username)).toBeVisible();
-				await expect(admin.getUserRowByUsername(userWithoutAdminAccess.data.username)).toHaveCount(1);
+				await admin.searchUser(userWithoutAdminAccess.data.username);
 			});
 
 			await test.step('make a user admin', async () => {
@@ -49,10 +46,9 @@ test.describe('Admin > Users Role Management', () => {
 		});
 
 		test('Remove role as admin', async () => {
-			await admin.inputSearchUsers.fill(userWithAdminAccess.data.username);
 			await test.step('User should be visible in the All tab', async () => {
 				await admin.getTabByName().click();
-				await expect(admin.getUserRowByUsername(userWithAdminAccess.data.username)).toBeVisible();
+				await admin.searchUser(userWithAdminAccess.data.username);
 			});
 
 			await test.step('remove admin role', async () => {

apps/meteor/tests/e2e/admin-users-status-management.spec.ts

@@ -58,11 +58,9 @@ test.describe.serial('Admin > Users', () => {
 		});
 
 		test('After the first login, the user gets listed under the Active tab', async () => {
-			await adminUsers.inputSearchUsers.fill(user.data.username);
-
 			await test.step('should be visible in the All tab', async () => {
-				await adminUsers.getTabByName('Active').click();
-				await expect(adminUsers.getUserRowByUsername(user.data.username)).toBeVisible();
+				await adminUsers.getTabByName().click();
+				await adminUsers.searchUser(user.data.username);
 			});
 
 			await test.step('should not be visible in the Pending tab', async () => {

apps/meteor/tests/e2e/admin-users.spec.ts

@@ -24,11 +24,9 @@ test.describe('Admin > Users', () => {
 	});
 
 	test('New user shows in correct tabs when deactivated', async () => {
-		await admin.inputSearchUsers.fill(user.data.username);
-
 		await test.step('should be visible in the All tab', async () => {
 			await admin.getTabByName().click();
-			await expect(admin.getUserRowByUsername(user.data.username)).toBeVisible();
+			await admin.searchUser(user.data.username);
 		});
 
 		await test.step('should be visible in the Pending tab', async () => {

apps/meteor/tests/e2e/administration.spec.ts

@@ -65,10 +65,8 @@ test.describe.parallel('administration', () => {
 			await page.goto('/admin/users');
 		});
 
-		test('expect find "user1" user', async ({ page }) => {
-			await poAdminUsers.inputSearchUsers.fill('user1');
-
-			await expect(page.locator('table tr[qa-user-id="user1"]')).toBeVisible();
+		test('expect find "user1" user', async () => {
+			await poAdminUsers.searchUser('user1');
 		});
 
 		test('expect create a user', async () => {
@@ -103,7 +101,7 @@ test.describe.parallel('administration', () => {
 			await expect(poAdminUsers.editUser.joinDefaultChannels).toBeVisible();
 			await poAdminUsers.editUser.btnAddUser.click();
 
-			await poAdminUsers.inputSearchUsers.fill(username);
+			await poAdminUsers.searchUser(username);
 			await poAdminUsers.getUserRowByUsername(username).click();
 			await poAdminUsers.userInfo.btnEdit.click();
 			await expect(poAdminUsers.editUser.inputUserName).toHaveValue(username);

apps/meteor/tests/e2e/page-objects/admin-users.ts

@@ -2,6 +2,7 @@ import type { Locator, Page } from '@playwright/test';
 
 import { Admin } from './admin';
 import { MenuMoreActions, UserInfoFlexTab, EditUserFlexTab } from './fragments';
+import { expect } from '../utils/test';
 
 type UserActions = 'Make Admin' | 'Remove Admin' | 'Activate' | 'Deactivate';
 
@@ -27,7 +28,7 @@ export class AdminUsers extends Admin {
 		return this.page.getByRole('button', { name: 'Invite', exact: true });
 	}
 
-	get inputSearchUsers(): Locator {
+	private get inputSearchUsers(): Locator {
 		return this.page.getByRole('textbox', { name: 'Search Users' });
 	}
 
@@ -36,7 +37,7 @@ export class AdminUsers extends Admin {
 	}
 
 	getUserRowByUsername(username: string): Locator {
-		return this.page.locator('tr', { hasText: username });
+		return this.page.locator('tr', { hasText: username }).first();
 	}
 
 	getTabByName(name: 'All' | 'Pending' | 'Active' | 'Deactivated' = 'All'): Locator {
@@ -53,9 +54,14 @@ export class AdminUsers extends Admin {
 	}
 
 	async deleteUser(username: string): Promise<void> {
-		await this.inputSearchUsers.fill(username);
+		await this.searchUser(username);
 		await this.getUserRowByUsername(username).click();
 		await this.userInfo.btnMoreActions.click();
 		await this.userInfo.menuItemDeleteUser.click();
 	}
+
+	async searchUser(username: string): Promise<void> {
+		await this.inputSearchUsers.fill(username);
+		await expect(this.getUserRowByUsername(username)).toHaveCount(1);
+	}
 }