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"
This commit is contained in:
Johannes Millan 2026-01-16 17:38:38 +01:00
parent 2d6955011c
commit ea5fbb60af

View file

@ -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')