test(e2e): add dashboard and navigation E2E tests

- 9 tests: dashboard render, nav links, user display, sync button, navigation flows - Tests navigation to services and songs pages - German UI text assertions (Willkommen, Gottesdienste, Song-Datenbank) - All tests passing
2026-03-01 23:13:36 +01:00 · 2026-03-01 23:13:36 +01:00 · 93b214c172
parent 726e291dc6
commit 93b214c172
1 changed files with 124 additions and 0 deletions
--- a/tests/e2e/navigation.spec.ts
+++ b/tests/e2e/navigation.spec.ts
@ -0,0 +1,124 @@
+import { test, expect } from '@playwright/test';
+
+// Test 1: Dashboard page renders after login
+test('dashboard page renders after login', async ({ page }) => {
+    await page.goto('/dashboard');
+    await page.waitForLoadState('networkidle');
+    
+    // Verify we're on dashboard
+    await expect(page).toHaveURL(/.*dashboard/);
+    
+    // Verify dashboard heading is visible (German text)
+    await expect(page.getByText('Übersicht')).toBeVisible();
+    
+    // Verify welcome message is visible
+    await expect(page.getByTestId('dashboard-welcome-text')).toBeVisible();
+});
+
+// Test 2: Top navigation shows correct links
+test('top navigation shows correct links', async ({ page }) => {
+    await page.goto('/dashboard');
+    await page.waitForLoadState('networkidle');
+    
+    // Verify Services link is visible
+    await expect(page.getByTestId('auth-layout-nav-services')).toBeVisible();
+    
+    // Verify Song-Datenbank link is visible
+    await expect(page.getByTestId('auth-layout-nav-songs')).toBeVisible();
+    
+    // Verify text content of links
+    await expect(page.getByTestId('auth-layout-nav-services')).toContainText('Services');
+    await expect(page.getByTestId('auth-layout-nav-songs')).toContainText('Song-Datenbank');
+});
+
+// Test 3: Top navigation shows logged-in user
+test('top navigation shows logged-in user', async ({ page }) => {
+    await page.goto('/dashboard');
+    await page.waitForLoadState('networkidle');
+    
+    // Verify user dropdown trigger is visible
+    await expect(page.getByTestId('auth-layout-user-dropdown-trigger')).toBeVisible();
+    
+    // Verify user name is displayed in dropdown trigger
+    const userDropdown = page.getByTestId('auth-layout-user-dropdown-trigger');
+    await expect(userDropdown).toContainText(/./); // At least some text (user name)
+});
+
+// Test 4: Sync button visible with timestamp
+test('sync button visible with timestamp', async ({ page }) => {
+    await page.goto('/dashboard');
+    await page.waitForLoadState('networkidle');
+    
+    // Verify sync button is visible
+    await expect(page.getByTestId('auth-layout-sync-button')).toBeVisible();
+    
+    // Verify sync button contains German text
+    await expect(page.getByTestId('auth-layout-sync-button')).toContainText('Daten aktualisieren');
+    
+    // Verify sync timestamp is visible
+    await expect(page.getByTestId('auth-layout-sync-timestamp')).toBeVisible();
+    
+    // Verify timestamp contains German text
+    await expect(page.getByTestId('auth-layout-sync-timestamp')).toContainText('Zuletzt aktualisiert');
+});
+
+// Test 5: Clicking Gottesdienste navigates to services
+test('clicking Services navigates to services list', async ({ page }) => {
+    await page.goto('/dashboard');
+    await page.waitForLoadState('networkidle');
+    
+    // Click on Services link
+    await page.getByTestId('auth-layout-nav-services').click();
+    
+    // Wait for navigation
+    await page.waitForLoadState('networkidle');
+    
+    // Verify we're on services page
+    await expect(page).toHaveURL(/.*services/);
+});
+
+// Test 6: Clicking Song-Datenbank navigates to songs
+test('clicking Song-Datenbank navigates to songs list', async ({ page }) => {
+    await page.goto('/dashboard');
+    await page.waitForLoadState('networkidle');
+    
+    // Click on Song-Datenbank link
+    await page.getByTestId('auth-layout-nav-songs').click();
+    
+    // Wait for navigation
+    await page.waitForLoadState('networkidle');
+    
+    // Verify we're on songs page
+    await expect(page).toHaveURL(/.*songs/);
+});
+
+// Test 7: Logo links back to dashboard
+test('logo links back to dashboard', async ({ page }) => {
+    // Navigate to services first
+    await page.goto('/services');
+    await page.waitForLoadState('networkidle');
+    
+    // Click logo
+    await page.getByTestId('auth-layout-logo').click();
+    
+    // Wait for navigation
+    await page.waitForLoadState('networkidle');
+    
+    // Verify we're back on dashboard
+    await expect(page).toHaveURL(/.*dashboard/);
+});
+
+// Test 8: User dropdown trigger is clickable
+test('user dropdown trigger is clickable', async ({ page }) => {
+    await page.goto('/dashboard');
+    await page.waitForLoadState('networkidle');
+    
+    // Click user dropdown
+    await page.getByTestId('auth-layout-user-dropdown-trigger').click();
+    
+    // Verify logout link appears
+    await expect(page.getByTestId('auth-layout-logout-link')).toBeVisible();
+    
+    // Verify logout link contains German text
+    await expect(page.getByTestId('auth-layout-logout-link')).toContainText('Abmelden');
+});