add playwright for sorted owners (#17600)

* add playwright for sorted owners

* fix minor test id

openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Entity.spec.ts

@@ -24,9 +24,11 @@ import { SearchIndexClass } from '../../support/entity/SearchIndexClass';
 import { StoredProcedureClass } from '../../support/entity/StoredProcedureClass';
 import { TableClass } from '../../support/entity/TableClass';
 import { TopicClass } from '../../support/entity/TopicClass';
+import { UserClass } from '../../support/user/UserClass';
 import {
   assignDomain,
   createNewPage,
+  generateRandomUsername,
   getApiContext,
   getAuthContext,
   getToken,
@@ -35,6 +37,11 @@ import {
   verifyDomainPropagation,
 } from '../../utils/common';
 import { CustomPropertyTypeByName } from '../../utils/customProperty';
+import {
+  addMultiOwner,
+  removeOwner,
+  removeOwnersFromList,
+} from '../../utils/entity';
 import { visitServiceDetailsPage } from '../../utils/service';
 
 const entities = [
@@ -125,6 +132,54 @@ entities.forEach((EntityClass) => {
       await entity.owner(page, [OWNER1], [OWNER2], 'Teams');
     });
 
+    test('User as Owner with unsorted list', async ({ page }) => {
+      const { afterAction, apiContext } = await getApiContext(page);
+      const owner1Data = generateRandomUsername('PW_A_');
+      const owner2Data = generateRandomUsername('PW_B_');
+      const OWNER1 = new UserClass(owner1Data);
+      const OWNER2 = new UserClass(owner2Data);
+      await OWNER1.create(apiContext);
+      await OWNER2.create(apiContext);
+
+      await addMultiOwner({
+        page,
+        ownerNames: [OWNER2.getUserName()],
+        activatorBtnDataTestId: 'edit-owner',
+        resultTestId: 'data-assets-header',
+        endpoint: entity.endpoint,
+        type: 'Users',
+      });
+
+      await addMultiOwner({
+        page,
+        ownerNames: [OWNER1.getUserName()],
+        activatorBtnDataTestId: 'edit-owner',
+        resultTestId: 'data-assets-header',
+        endpoint: entity.endpoint,
+        type: 'Users',
+        clearAll: false,
+      });
+
+      await removeOwnersFromList({
+        page,
+        ownerNames: [OWNER1.getUserName()],
+        endpoint: entity.endpoint,
+        dataTestId: 'data-assets-header',
+      });
+
+      await removeOwner({
+        page,
+        endpoint: entity.endpoint,
+        ownerName: OWNER2.getUserName(),
+        type: 'Users',
+        dataTestId: 'data-assets-header',
+      });
+
+      await OWNER1.delete(apiContext);
+      await OWNER2.delete(apiContext);
+      await afterAction();
+    });
+
     test('Tier Add, Update and Remove', async ({ page }) => {
       await entity.tier(
         page,

openmetadata-ui/src/main/resources/ui/playwright/support/user/UserClass.ts

@@ -22,11 +22,22 @@ type ResponseDataType = {
   fullyQualifiedName: string;
 };
 
+type UserData = {
+  email: string;
+  firstName: string;
+  lastName: string;
+  password: string;
+};
+
 export class UserClass {
-  data = generateRandomUsername();
+  data: UserData;
 
   responseData: ResponseDataType;
 
+  constructor(data?: UserData) {
+    this.data = data ? data : generateRandomUsername();
+  }
+
   async create(apiContext: APIRequestContext) {
     const response = await apiContext.post('/api/v1/users/signup', {
       data: this.data,

openmetadata-ui/src/main/resources/ui/playwright/utils/common.ts

@@ -207,9 +207,9 @@ export const getRandomLastName = () => {
   return `${nouns[Math.floor(Math.random() * nouns.length)]}${uuid()}`;
 };
 
-export const generateRandomUsername = () => {
-  const firstName = getRandomFirstName();
-  const lastName = getRandomLastName();
+export const generateRandomUsername = (prefix = '') => {
+  const firstName = `${prefix}${getRandomFirstName()}`;
+  const lastName = `${prefix}${getRandomLastName()}`;
 
   return {
     firstName,

openmetadata-ui/src/main/resources/ui/playwright/utils/entity.ts

@@ -141,6 +141,40 @@ export const updateOwner = async ({
   );
 };
 
+export const removeOwnersFromList = async ({
+  page,
+  endpoint,
+  ownerNames,
+  dataTestId,
+}: {
+  page: Page;
+  endpoint: EntityTypeEndpoint;
+  ownerNames: string[];
+  dataTestId?: string;
+}) => {
+  await page.getByTestId('edit-owner').click();
+  await page.waitForSelector('[data-testid="loader"]', { state: 'detached' });
+
+  for (const ownerName of ownerNames) {
+    const ownerItem = page.getByRole('listitem', {
+      name: ownerName,
+      exact: true,
+    });
+
+    await ownerItem.click();
+  }
+  const patchRequest = page.waitForResponse(`/api/v1/${endpoint}/*`);
+  await page.click('[data-testid="selectable-list-update-btn"]');
+  await patchRequest;
+
+  for (const ownerName of ownerNames) {
+    await expect(
+      page.getByTestId(dataTestId ?? 'owner-link')
+    ).not.toContainText(ownerName);
+  }
+};
+
+// Removes All Owners
 export const removeOwner = async ({
   page,
   endpoint,
@@ -182,6 +216,7 @@ export const addMultiOwner = async (data: {
   resultTestId?: string;
   isSelectableInsideForm?: boolean;
   type: 'Teams' | 'Users';
+  clearAll?: boolean;
 }) => {
   const {
     page,
@@ -191,6 +226,7 @@ export const addMultiOwner = async (data: {
     isSelectableInsideForm = false,
     endpoint,
     type,
+    clearAll = true,
   } = data;
   const isMultipleOwners = Array.isArray(ownerNames);
   const owners = isMultipleOwners ? ownerNames : [ownerNames];
@@ -205,7 +241,7 @@ export const addMultiOwner = async (data: {
 
   await page.waitForSelector('[data-testid="loader"]', { state: 'detached' });
 
-  if (isMultipleOwners) {
+  if (clearAll && isMultipleOwners) {
     await page.click('[data-testid="clear-all-button"]');
   }