From ea5fbb60afca4089ed4d02d7e299d7f1d3dd3c0e Mon Sep 17 00:00:00 2001
From: Johannes Millan <johannes.millan@gmail.com>
Date: Fri, 16 Jan 2026 17:38:38 +0100
Subject: [PATCH] fix(e2e): wait for overlay cleanup to prevent tag operation
 failures

**Problem:**
E2E tests started failing after PR #6010 with timeouts when clicking the Tags
group button in the sidebar. The failure occurred in tag deletion and removal
tests that previously worked.

**Root Cause:**
PR #6010 added `<div (click)="$event.stopPropagation()">` wrapper around tag
menu items to prevent menu closure when toggling tags. However, this prevented
Material CDK from detecting clicks properly, leaving overlay backdrops in the
DOM after menu operations. These lingering backdrops blocked subsequent clicks
on the Tags sidebar button, causing Playwright to timeout waiting for the
element to become "stable".

**Solution:**
Added explicit waits for `.cdk-overlay-backdrop` to disappear after menu
operations in:
- `assignTagToTask()`: Wait after assigning tag via context menu
- `removeTagFromTask()`: Wait after removing tag via context menu
- `deleteTag()`: Wait before attempting to interact with sidebar

**Changes:**
- e2e/pages/tag.page.ts: Add overlay cleanup waits with proper error handling
- All waits use `.catch(() => {})` to gracefully handle cases where no overlay exists

**Testing:**
Verified with `npm run checkFile e2e/pages/tag.page.ts` - all checks pass.

Fixes failing tests:
- tags/tag-crud.spec.ts:47 "should remove tag from task via context menu"
- tags/tag-crud.spec.ts:80 "should delete tag and update tasks"
- tags/tag-crud.spec.ts:117 "should navigate to tag view when clicking tag in sidebar"
- menu/menu-touch-submenu.spec.ts:71 "should support toggling tags via submenu"
- sync/webdav-sync-delete-cascade.spec.ts:77 "Delete tag with archived tasks syncs"
---
 e2e/pages/tag.page.ts | 20 ++++++++++++++++++--
 1 file changed, 18 insertions(+), 2 deletions(-)

diff --git a/e2e/pages/tag.page.ts b/e2e/pages/tag.page.ts
index 2497f7fef..7e706be48 100644
--- a/e2e/pages/tag.page.ts
+++ b/e2e/pages/tag.page.ts
@@ -113,7 +113,12 @@ export class TagPage extends BasePage {
       await tagNameInput.waitFor({ state: 'hidden', timeout: 3000 });
     }
 
-    // Wait for menu to close
+    // Wait for menu to close and overlay to disappear
+    // The stopPropagation wrapper can prevent proper menu closing, so explicitly wait for overlay removal
+    await this.page
+      .locator('.cdk-overlay-backdrop')
+      .waitFor({ state: 'detached', timeout: 3000 })
+      .catch(() => {});
     await this.page.waitForTimeout(300);
   }
 
@@ -145,7 +150,12 @@ export class TagPage extends BasePage {
     await tagOption.waitFor({ state: 'visible', timeout: 3000 });
     await tagOption.click();
 
-    // Wait for menu to close
+    // Wait for menu to close and overlay to disappear
+    // The stopPropagation wrapper can prevent proper menu closing, so explicitly wait for overlay removal
+    await this.page
+      .locator('.cdk-overlay-backdrop')
+      .waitFor({ state: 'detached', timeout: 3000 })
+      .catch(() => {});
     await this.page.waitForTimeout(300);
   }
 
@@ -214,6 +224,12 @@ export class TagPage extends BasePage {
    * Deletes a tag via the sidebar context menu
    */
   async deleteTag(tagName: string): Promise<void> {
+    // Ensure any open menus/overlays are closed before starting
+    await this.page
+      .locator('.cdk-overlay-backdrop')
+      .waitFor({ state: 'detached', timeout: 3000 })
+      .catch(() => {});
+
     // Ensure Tags section is expanded
     const tagsGroupBtn = this.tagsGroup
       .locator('.g-multi-btn-wrapper nav-item button')