Fix flakiness in custom property playwrights (#25733)

aniketkatkar97 · web-flow · commit 450152642f7c · 2026-02-09T11:03:15.000+05:30
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Customproperties-part1.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Customproperties-part1.spec.ts
@@ -13,7 +13,7 @@
 import { CUSTOM_PROPERTIES_ENTITIES } from '../../constant/customProperty';
 import { TableClass } from '../../support/entity/TableClass';
 import { test } from '../../support/fixtures/userPages';
-import { createNewPage, redirectToHomePage, uuid } from '../../utils/common';
+import { createNewPage, redirectToHomePage } from '../../utils/common';
 import {
   addCustomPropertiesForEntity,
   deleteCreatedProperty,
@@ -57,7 +57,9 @@ test.describe('Custom properties without custom property config', () => {
   propertiesList.forEach((property) => {
     test.describe(`Add update and delete ${property} custom properties`, () => {
       Object.values(CUSTOM_PROPERTIES_ENTITIES).forEach(async (entity) => {
-        const propertyName = `pwcustomproperty${entity.name}test${uuid()}`;
+        // Using Date.now() to generate property names in a way that new property will always be
+        // added after existing properties to avoid conflicts due to parallel test executions
+        const propertyName = `pwcp${Date.now()}test${entity.name}`;
 
         test(`Add ${property} custom property for ${entity.name}`, async ({
           page,
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Customproperties-part2.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Customproperties-part2.spec.ts
@@ -13,7 +13,7 @@
 import { CUSTOM_PROPERTIES_ENTITIES } from '../../constant/customProperty';
 import { TableClass } from '../../support/entity/TableClass';
 import { test } from '../../support/fixtures/userPages';
-import { createNewPage, redirectToHomePage, uuid } from '../../utils/common';
+import { createNewPage, redirectToHomePage } from '../../utils/common';
 import {
   addCustomPropertiesForEntity,
   deleteCreatedProperty,
@@ -43,7 +43,7 @@ test.describe('Custom properties with custom property config', () => {
 
   test.describe('Add update and delete Enum custom properties', () => {
     Object.values(CUSTOM_PROPERTIES_ENTITIES).forEach(async (entity) => {
-      const propertyName = `pwcustomproperty${entity.name}test${uuid()}`;
+      const propertyName = `pwcp${Date.now()}test${entity.name}`;
 
       test(`Add Enum custom property for ${entity.name}`, async ({ page }) => {
         await settingClick(
@@ -100,7 +100,7 @@ test.describe('Custom properties with custom property config', () => {
 
   test.describe('Add update and delete Table custom properties', () => {
     Object.values(CUSTOM_PROPERTIES_ENTITIES).forEach(async (entity) => {
-      const propertyName = `pwcustomproperty${entity.name}test${uuid()}`;
+      const propertyName = `pwcp${Date.now()}test${entity.name}`;
 
       test(`Add Table custom property for ${entity.name}`, async ({ page }) => {
         await settingClick(
@@ -161,7 +161,7 @@ test.describe('Custom properties with custom property config', () => {
     'Add update and delete Entity Reference custom properties',
     () => {
       Object.values(CUSTOM_PROPERTIES_ENTITIES).forEach(async (entity) => {
-        const propertyName = `pwcustomproperty${entity.name}test${uuid()}`;
+        const propertyName = `pwcp${Date.now()}test${entity.name}`;
 
         test(`Add Entity Reference custom property for ${entity.name}`, async ({
           page,
@@ -223,7 +223,7 @@ test.describe('Custom properties with custom property config', () => {
     'Add update and delete Entity Reference List custom properties',
     () => {
       Object.values(CUSTOM_PROPERTIES_ENTITIES).forEach(async (entity) => {
-        const propertyName = `pwcustomproperty${entity.name}test${uuid()}`;
+        const propertyName = `pwcp${Date.now()}test${entity.name}`;
 
         test(`Add Entity Reference list custom property for ${entity.name}`, async ({
           page,
@@ -287,7 +287,7 @@ test.describe('Custom properties with custom property config', () => {
 
   test.describe('Add update and delete Date custom properties', () => {
     Object.values(CUSTOM_PROPERTIES_ENTITIES).forEach(async (entity) => {
-      const propertyName = `pwcustomproperty${entity.name}test${uuid()}`;
+      const propertyName = `pwcp${Date.now()}test${entity.name}`;
 
       test(`Add Date custom property for ${entity.name}`, async ({ page }) => {
         await settingClick(
@@ -338,7 +338,7 @@ test.describe('Custom properties with custom property config', () => {
 
   test.describe('Add update and delete Time custom properties', () => {
     Object.values(CUSTOM_PROPERTIES_ENTITIES).forEach(async (entity) => {
-      const propertyName = `pwcustomproperty${entity.name}test${uuid()}`;
+      const propertyName = `pwcp${Date.now()}test${entity.name}`;
 
       test(`Add Time custom property for ${entity.name}`, async ({ page }) => {
         await settingClick(
@@ -395,7 +395,7 @@ test.describe('Custom properties with custom property config', () => {
 
   test.describe('Add update and delete DateTime custom properties', () => {
     Object.values(CUSTOM_PROPERTIES_ENTITIES).forEach(async (entity) => {
-      const propertyName = `pwcustomproperty${entity.name}test${uuid()}`;
+      const propertyName = `pwcp${Date.now()}test${entity.name}`;
 
       test(`Add DateTime custom property for ${entity.name}`, async ({
         page,
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/utils/customProperty.ts b/openmetadata-ui/src/main/resources/ui/playwright/utils/customProperty.ts
@@ -1240,9 +1240,22 @@ export const verifyTableColumnCustomPropertyPersistence = async ({
   );
 
   // 5. Reload Page
+  const getColumnDetails = page.waitForResponse(
+    '/api/v1/tables/name/*/columns?*fields=*extension*'
+  );
+  const getTableColumnTypes = page.waitForResponse(
+    '/api/v1/metadata/types/name/tableColumn*'
+  );
   await page.reload();
-  await waitForAllLoadersToDisappear(page);
-  await expect(sidePanel).toBeVisible();
+  await getTableColumnTypes;
+  await getColumnDetails;
+
+  await page.waitForSelector(
+    '.column-detail-panel-container [data-testid="custom-properties-tab"]',
+    {
+      state: 'visible',
+    }
+  );
   await customPropertiesTab.click();
   await expect(searchbar).toBeVisible();
   await searchbar.fill(propertyName);
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/utils/customPropertyAdvancedSearchUtils.ts b/openmetadata-ui/src/main/resources/ui/playwright/utils/customPropertyAdvancedSearchUtils.ts
@@ -31,7 +31,11 @@ export interface CustomPropertyDetails {
     id: string;
   };
   customPropertyConfig?: {
-    config: string | string[] | { values: string[]; multiSelect: boolean };
+    config:
+      | string
+      | string[]
+      | { values: string[]; multiSelect: boolean }
+      | { columns: string[] };
   };
 }
 
@@ -289,34 +293,22 @@ export const setupCustomPropertyAdvancedSearchTest = async (
 
   // Map and prepare the data required for creating custom properties of different types
   const cpCreationData = getCustomPropertyCreationData(testData.types);
-  let metadataTypesData;
+  testData.createdCPData = Object.values(cpCreationData);
 
   // The API calls need to be sequential as the server replaces some types with others
   // due to simultaneous requests causing conflicts.
   for (const type of testData.types) {
     const typeData = cpCreationData[type.name as keyof typeof cpCreationData];
 
     if (!isUndefined(typeData)) {
-      metadataTypesData = await apiContext.put(
+      await apiContext.put(
         `/api/v1/metadata/types/${testData.cpMetadataType.id}`,
         {
           data: typeData,
         }
       );
     }
   }
-  const metadataTypesJson = await metadataTypesData?.json();
-
-  // Get the created custom properties names list
-  const createdCustomPropertyNamesList = new Set(
-    Object.values(cpCreationData).map((cp) => cp.name)
-  );
-  // Filter out the created custom properties from the metadata type response
-  // to only take the properties data created in this test setup
-  testData.createdCPData =
-    metadataTypesJson?.customProperties.filter((cp: CustomPropertyDetails) =>
-      createdCustomPropertyNamesList.has(cp.name)
-    ) || [];
 
   // Get the custom property to values mapping to add to the dashboard entity
   const cpValuesData = getCustomPropertyValues(
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/utils/entityPanel.ts b/openmetadata-ui/src/main/resources/ui/playwright/utils/entityPanel.ts
@@ -14,6 +14,7 @@ import { expect, Page } from '@playwright/test';
 import { redirectToExplorePage } from './common';
 
 import { ENDPOINT_TO_FILTER_MAP } from '../constant/explore';
+import { waitForAllLoadersToDisappear } from './entity';
 
 export const openEntitySummaryPanel = async (
   page: Page,
@@ -52,9 +53,7 @@ export const openEntitySummaryPanel = async (
   expect(searchResponse.status()).toBe(200);
 
   await page.getByTestId('searchBox').press('Enter');
-  await page.waitForSelector('[data-testid="loader"]', {
-    state: 'detached',
-  });
+  await waitForAllLoadersToDisappear(page);
 
   const entityCard = page
     .locator('[data-testid="table-data-card"]')
@@ -76,9 +75,7 @@ export async function navigateToExploreAndSelectTable(
 ) {
   await redirectToExplorePage(page);
 
-  await page.waitForSelector('[data-testid="loader"]', {
-    state: 'detached',
-  });
+  await waitForAllLoadersToDisappear(page);
 
   const permissionsResponsePromise = page.waitForResponse((response) =>
     response.url().includes('/permissions')
