test(teams): stop the add-team click from landing in a toast (#31734)

* test(teams): stop the add-team click from landing in a toast

addTeamHierarchy clicked the add button with `force: true`, which skips the
hit-target check. The backend fans delete/job notifications out to every
socket of the logged-in admin, so a parallel worker's success toast can sit
over that button — and with force the click was dispatched into the toast.
The click "succeeded", the modal never opened, and the failure surfaced 15s
later on the modal assertion.

Success toasts carry no close button and self-dismiss after 3.5s, so
clicking without force is the fix: the hit-target check waits the toast out.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

* test(teams): retry the add-team open when a toast eats the click

Dropping `force` was not enough. Playwright checks the hit target and then
dispatches, so a socket-fanned success toast landing in that window still
swallows the click — the trace shows the click "succeeding" in 16ms with a
delete toast on screen and the modal never opening.

Route every add-team trigger through openAddTeamModal: let a pending toast
expire, click, and retry until the modal is up.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

---------

Co-authored-by: Claude Opus 5 (1M context) <noreply@anthropic.com>
(cherry picked from commit af609a6)

Author: 2 people

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

@@ -58,6 +58,7 @@ import {
   executionOnOwnerTeam,
   getNewTeamDetails,
   hardDeleteTeam,
+  openAddTeamModal,
   searchTeam,
   softDeleteTeam,
   verifyAssetsInTeamsPage,
@@ -192,9 +193,7 @@ test.describe('Teams Page', () => {
     await test.step('Create a new team', async () => {
       await checkTeamTabCount(page);
 
-      await page.getByTestId('add-team').waitFor();
-
-      await page.getByTestId('add-team').click();
+      await openAddTeamModal(page);
 
       const newTeamData = await createTeam(page, true);
 
@@ -427,9 +426,7 @@ test.describe('Teams Page', () => {
   test('Create a new public team', async ({ page }) => {
     await settingClick(page, GlobalSettingOptions.TEAMS);
 
-    await page.getByTestId('add-team').waitFor();
-
-    await page.getByTestId('add-team').click();
+    await openAddTeamModal(page);
     const { apiContext, afterAction } = await getApiContext(page);
 
     try {

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

@@ -33,6 +33,47 @@ import { settingClick } from './sidebar';
 
 const TEAM_TYPES = ['Department', 'Division', 'Group'];
 
+const ADD_TEAM_MODAL = '[role="dialog"].ant-modal';
+// A success toast self-dismisses after 3.5s; give it a beat past that.
+const TOAST_DISMISS_TIMEOUT = 6_000;
+const MODAL_OPEN_TIMEOUT = 10_000;
+const MODAL_RETRY_TIMEOUT = 60_000;
+
+type AddTeamTrigger = 'add-team' | 'add-placeholder-button';
+
+/**
+ * Click an add-team trigger and return the modal it opens.
+ *
+ * The backend fans async-delete/job notifications out to every socket of the
+ * logged-in user, so a parallel worker's toast can drop over the button in the
+ * window between Playwright's hit-target check and the dispatched click — the
+ * toast swallows the click and the modal never opens. Success toasts carry no
+ * close button, so let them expire and click again; clicking with `force` only
+ * dispatches INTO the toast.
+ */
+export const openAddTeamModal = async (
+  page: Page,
+  trigger: AddTeamTrigger = 'add-team'
+) => {
+  const addButton = page.getByTestId(trigger);
+  const addTeamModal = page.locator(ADD_TEAM_MODAL).last();
+
+  await expect(async () => {
+    await page
+      .getByTestId('alert-bar')
+      .first()
+      .waitFor({ state: 'detached', timeout: TOAST_DISMISS_TIMEOUT })
+      .catch(() => undefined);
+
+    await expect(addButton).toBeEnabled();
+    await addButton.click();
+
+    await expect(addTeamModal).toBeVisible({ timeout: MODAL_OPEN_TIMEOUT });
+  }).toPass({ timeout: MODAL_RETRY_TIMEOUT, intervals: [1_000] });
+
+  return addTeamModal;
+};
+
 interface SearchTeamOptions {
   expectEmptyResults?: boolean;
   expectNotFound?: boolean;
@@ -252,16 +293,11 @@ export const addTeamHierarchy = async (
   index?: number,
   isHierarchy = false
 ) => {
-  const addTeamModal = page.locator('[role="dialog"].ant-modal').last();
-
-  // Fetching the add button and clicking on it
-  if (index && index > 0) {
-    await page.click('[data-testid="add-placeholder-button"]', { force: true });
-  } else {
-    await page.click('[data-testid="add-team"]', { force: true });
-  }
+  const addTeamModal = await openAddTeamModal(
+    page,
+    index && index > 0 ? 'add-placeholder-button' : 'add-team'
+  );
 
-  await expect(addTeamModal).toBeVisible();
   await expect(page.locator('[data-testid="name"]')).toBeVisible();
 
   // Entering team details
@@ -621,7 +657,7 @@ export const executionOnOwnerTeam = async (
 
   await addEmailTeam(page, data.email);
 
-  await page.getByTestId('add-placeholder-button').click();
+  await openAddTeamModal(page, 'add-placeholder-button');
 
   const newTeamData = await createTeam(page);