Phase 5.4-5.11: Playwright E2E test infrastructure with 7 spec files

- playwright.config.ts: chromium project, webServer, baseURL, trace/screenshot/video - e2e/helpers.ts: API mock setup, login/logout helpers, mock data for all entities - 7 E2E spec files (1164 lines total): - auth.spec.ts: login/logout workflow - contact-crud.spec.ts: create/edit/delete contacts, add persons - search.spec.ts: global search, filter, results - plugin-toggle.spec.ts: enable/disable plugins, UI changes - mail.spec.ts: mail account setup, folders, mail viewing - dms.spec.ts: folder creation, file upload, preview, share - calendar.spec.ts: appointment creation, calendar switch, kanban view - @playwright/test added as devDependency - e2e scripts added to package.json - TSC: 0 new errors (only pre-existing Dms.tsx)
2026-07-23 22:35:03 +02:00
parent 7a034b3124
commit 42b19040ce
11 changed files with 1256 additions and 2 deletions
@@ -0,0 +1,80 @@
+import { test, expect } from '@playwright/test';
+import { setupApiMocks, login, navigateTo, MOCK_MAILS } from './helpers';
+
+test.describe('Mail E2E', () => {
+  test.beforeEach(async ({ page }) => {
+    await setupApiMocks(page);
+    await login(page);
+  });
+
+  test('mail page renders with folder tree and list', async ({ page }) => {
+    await navigateTo(page, '/mail');
+
+    // Mail page should load - check for folder tree or loading state
+    await expect(page.locator('[data-testid="folder-tree-list"], [data-testid="folder-tree-loading"], [data-testid="folder-tree-empty"]')).toBeVisible({ timeout: 15_000 });
+  });
+
+  test('mail list shows emails when folder is selected', async ({ page }) => {
+    await navigateTo(page, '/mail');
+
+    // Wait for folder tree
+    await expect(page.locator('[data-testid="folder-tree-list"], [data-testid="folder-tree-loading"], [data-testid="folder-tree-empty"]')).toBeVisible({ timeout: 15_000 });
+
+    // Click on first folder if available
+    const folder = page.locator('[data-testid^="folder-"]').first();
+    if (await folder.isVisible({ timeout: 5_000 })) {
+      await folder.click();
+
+      // Mail list should appear
+      await expect(page.locator('[data-testid="mail-list"], [data-testid="mail-list-loading"], [data-testid="mail-list-empty"]')).toBeVisible({ timeout: 10_000 });
+    }
+  });
+
+  test('open a mail shows detail pane', async ({ page }) => {
+    await navigateTo(page, '/mail');
+
+    // Wait for folder tree and click first folder
+    await expect(page.locator('[data-testid="folder-tree-list"], [data-testid="folder-tree-loading"], [data-testid="folder-tree-empty"]')).toBeVisible({ timeout: 15_000 });
+
+    const folder = page.locator('[data-testid^="folder-"]').first();
+    if (await folder.isVisible({ timeout: 5_000 })) {
+      await folder.click();
+
+      // Wait for mail list
+      await expect(page.locator('[data-testid="mail-list"], [data-testid="mail-list-loading"], [data-testid="mail-list-empty"]')).toBeVisible({ timeout: 10_000 });
+
+      // Click first mail if available
+      const mailItem = page.locator('[data-testid^="mail-item-"]').first();
+      if (await mailItem.isVisible({ timeout: 5_000 })) {
+        await mailItem.click();
+
+        // Mail detail should appear
+        await expect(page.locator('[data-testid="mail-detail"], [data-testid="mail-detail-loading"], [data-testid="mail-detail-empty"]')).toBeVisible({ timeout: 10_000 });
+      }
+    }
+  });
+
+  test('mail settings page allows adding an account', async ({ page }) => {
+    await navigateTo(page, '/settings/mail');
+
+    // Wait for accounts tab
+    await expect(page.locator('[data-testid="tab-accounts"]')).toBeVisible({ timeout: 10_000 });
+
+    // Click add account button
+    await page.locator('[data-testid="add-account-btn"]').click();
+
+    // Add account form should appear
+    await expect(page.locator('[data-testid="add-account-form"]')).toBeVisible({ timeout: 10_000 });
+
+    // Fill in account details
+    await page.locator('[data-testid="add-account-form"] input').first().fill('testuser@test.test');
+    await page.locator('[data-testid="add-account-form"] input[type="password"]').fill('testpassword');
+
+    // Click save button
+    const saveBtn = page.locator('[data-testid="add-account-form"] button').filter({ hasText: /save|speichern/i }).first();
+    await saveBtn.click();
+
+    // Form should close after save
+    await expect(page.locator('[data-testid="add-account-form"]')).not.toBeVisible({ timeout: 10_000 });
+  });
+});