update tests

Author: MarkoIvanetic

.github/workflows/playwright.yml

@@ -44,8 +44,18 @@ jobs:
 
       - name: 🚀 Start Frontend App (Background)
         run: |
+          echo "🔧 Environment variables:"
+          echo "NODE_ENV: $NODE_ENV"
+          echo "NEXTAUTH_SECRET: ${NEXTAUTH_SECRET:0:10}..."
+          echo ""
+          echo "🚀 Starting server..."
           node apps/frontend/.next/standalone/apps/frontend/server.js &
-          echo "FRONTEND_PID=$!" >> $GITHUB_ENV
+          SERVER_PID=$!
+          echo "FRONTEND_PID=$SERVER_PID" >> $GITHUB_ENV
+          echo "✅ Server started with PID: $SERVER_PID"
+          sleep 2
+          echo "📊 Server process status:"
+          ps aux | grep $SERVER_PID || echo "❌ Server process not found"
         shell: bash
         env:
           NODE_ENV: production
@@ -55,19 +65,42 @@ jobs:
 
       - name: ⏳ Wait for Frontend to be Ready
         run: |
-          echo "Waiting for frontend to start on http://localhost:3000..."
-          timeout 20s bash -c 'until curl -f http://localhost:3000 > /dev/null 2>&1; do
-            echo "Waiting for frontend..."
+          echo "⏳ Waiting for frontend to start on http://localhost:3000..."
+          ATTEMPT=0
+          MAX_ATTEMPTS=20
+
+          until curl -f http://localhost:3000 > /dev/null 2>&1; do
+            ATTEMPT=$((ATTEMPT + 1))
+            echo "🔄 Attempt $ATTEMPT/$MAX_ATTEMPTS - waiting for frontend..."
+
+            if [ $ATTEMPT -eq $MAX_ATTEMPTS ]; then
+              echo "❌ Frontend failed to start after $MAX_ATTEMPTS attempts"
+              echo "📊 Current processes:"
+              ps aux | grep -E "(node|next)" | grep -v grep
+              echo "🔍 Checking port 3000:"
+              netstat -tulpn | grep 3000 || echo "No process on port 3000"
+              exit 1
+            fi
+
             sleep 3
-          done'
-          echo "Frontend is ready!"
+          done
+
+          echo "✅ Frontend is ready!"
         shell: bash
 
-      - name: 🔍 Health Check
+      - name: 🔍 Detailed Health Check
         run: |
-          echo "Running health check..."
-          curl -f http://localhost:3000 -I | head -5
-          echo "Health check passed!"
+          echo "🏥 Running detailed health check..."
+          echo "📡 HTTP response:"
+          curl -f http://localhost:3000 -I | head -10
+          echo ""
+          echo "📄 Basic page content:"
+          curl -s http://localhost:3000 | head -20
+          echo ""
+          echo "🔗 Testing login page:"
+          curl -s http://localhost:3000/login | head -10 || echo "❌ Login page not accessible"
+          echo ""
+          echo "✅ Health check completed!"
         shell: bash
 
       - name: 🧪 Run Playwright E2E Tests

packages/e2e-frontend/multi-device.spec.ts

@@ -7,18 +7,44 @@ async function createContext(
 	password: string,
 	viewport: { width: number; height: number }
 ) {
+	console.log(`🖥️ Creating context for ${email} with viewport ${viewport.width}x${viewport.height}`);
+
 	const context = await browser.newContext({ viewport });
 	const page = await context.newPage();
 
+	// Test basic connectivity
+	console.log('🌐 Testing basic connectivity...');
+	try {
+		await page.goto('/', { waitUntil: 'networkidle', timeout: 30000 });
+		console.log('🔗 Root page URL:', page.url());
+
+		// Check if page loaded successfully
+		const title = await page.title();
+		console.log('📄 Page title:', title);
+	} catch (error) {
+		console.log('❌ Failed to load root page:', error instanceof Error ? error.message : String(error));
+	}
+
 	const login = new LoginPage(page);
 	await login.goto();
 	console.log('🔗 URL after login.goto():', page.url());
 
 	await login.login(email, password);
 	console.log('🔗 URL after login.login():', page.url());
 
-	await page.waitForURL('/en');
-	console.log("🔗 URL after waitForURL('/en'):", page.url());
+	console.log('⏳ Waiting for URL to change to /en...');
+	try {
+		await page.waitForURL('/en', { timeout: 30000 });
+		console.log("✅ URL after waitForURL('/en'):", page.url());
+	} catch (error) {
+		console.log('❌ waitForURL failed:', error instanceof Error ? error.message : String(error));
+		console.log('🔗 Current URL:', page.url());
+
+		// Take screenshot for debugging
+		await page.screenshot({ path: `debug-${email}-failed.png` });
+		throw error;
+	}
+
 	await expect(page.locator('text=Logged in')).toBeVisible();
 	return { context, page };
 }

packages/e2e-frontend/pages/login.ts

@@ -18,12 +18,43 @@ export class LoginPage {
 	}
 
 	async goto() {
+		console.log('🔗 Navigating to login page...');
 		await this.page.goto('/en/login');
+		console.log('🔗 Current URL after goto:', this.page.url());
+
+		// Wait for page to be fully loaded
+		await this.page.waitForLoadState('networkidle');
+		console.log('✅ Login page loaded successfully');
 	}
 
 	async login(email: string, password: string) {
+		console.log('📝 Starting login process...');
+		console.log('🔗 Current URL before login:', this.page.url());
+
+		// Check if form elements are available
+		await this.emailInput.waitFor({ state: 'visible', timeout: 10000 });
+		await this.passwordInput.waitFor({ state: 'visible', timeout: 10000 });
+		await this.submitButton.waitFor({ state: 'visible', timeout: 10000 });
+
+		console.log('📧 Filling email field...');
 		await this.emailInput.fill(email);
+
+		console.log('🔒 Filling password field...');
 		await this.passwordInput.fill(password);
+
+		console.log('🔗 URL before submit:', this.page.url());
+		console.log('🖱️ Clicking submit button...');
 		await this.submitButton.click();
+
+		console.log('🔗 URL immediately after submit:', this.page.url());
+
+		// Wait for navigation to complete
+		try {
+			await this.page.waitForLoadState('networkidle', { timeout: 15000 });
+			console.log('🔗 URL after navigation:', this.page.url());
+		} catch (error) {
+			console.log('⚠️ Navigation timeout or error:', error instanceof Error ? error.message : String(error));
+			console.log('🔗 Final URL:', this.page.url());
+		}
 	}
 }