101 lines
3.0 KiB
TypeScript
101 lines
3.0 KiB
TypeScript
import { test, expect } from '@playwright/test';
|
|
|
|
test('Debug WebSocket connection', async ({ page }) => {
|
|
const consoleMessages: string[] = [];
|
|
const wsMessages: string[] = [];
|
|
|
|
// Capture all console messages
|
|
page.on('console', msg => {
|
|
const text = `[${msg.type()}] ${msg.text()}`;
|
|
consoleMessages.push(text);
|
|
if (msg.text().includes('WebSocket')) {
|
|
console.log(text);
|
|
}
|
|
});
|
|
|
|
// Capture page errors
|
|
page.on('pageerror', error => {
|
|
console.log('Page error:', error.message);
|
|
});
|
|
|
|
// Navigate to event page
|
|
await page.goto('/events/1', { waitUntil: 'networkidle' });
|
|
await page.waitForTimeout(3000);
|
|
|
|
// Check console for WebSocket messages
|
|
console.log('\n=== All Console Messages ===');
|
|
consoleMessages.forEach(msg => console.log(msg));
|
|
|
|
// Take screenshot
|
|
await page.screenshot({ path: 'test-results/websocket-debug.png', fullPage: true });
|
|
|
|
// Check for WebSocket related logs
|
|
const wsLogs = consoleMessages.filter(m => m.toLowerCase().includes('websocket') || m.toLowerCase().includes('ws://') || m.toLowerCase().includes('wss://'));
|
|
console.log('\n=== WebSocket Related Logs ===');
|
|
wsLogs.forEach(msg => console.log(msg));
|
|
});
|
|
|
|
test('Check WebSocket URL configuration', async ({ page }) => {
|
|
// Navigate and check what WS_URL is being used
|
|
await page.goto('/events/1');
|
|
|
|
const wsUrl = await page.evaluate(() => {
|
|
// @ts-ignore
|
|
return window.__WS_URL__ || 'not exposed';
|
|
});
|
|
console.log('WS_URL from window:', wsUrl);
|
|
|
|
// Check environment variables
|
|
const envCheck = await page.evaluate(() => {
|
|
return {
|
|
// @ts-ignore
|
|
VITE_WS_URL: import.meta?.env?.VITE_WS_URL,
|
|
// @ts-ignore
|
|
VITE_API_URL: import.meta?.env?.VITE_API_URL,
|
|
};
|
|
});
|
|
console.log('Environment variables:', envCheck);
|
|
});
|
|
|
|
test('Test WebSocket endpoint directly', async ({ page, request }) => {
|
|
// First check if backend is running
|
|
try {
|
|
const healthCheck = await request.get('http://localhost:8000/api/v1/sport-events');
|
|
console.log('Backend health check status:', healthCheck.status());
|
|
} catch (e) {
|
|
console.log('Backend not reachable:', e);
|
|
}
|
|
|
|
// Try to connect to WebSocket from browser
|
|
await page.goto('/events/1');
|
|
|
|
const wsResult = await page.evaluate(async () => {
|
|
return new Promise((resolve) => {
|
|
const ws = new WebSocket('ws://localhost:8000/api/v1/ws?token=guest&event_id=1');
|
|
|
|
ws.onopen = () => {
|
|
resolve({ status: 'connected', readyState: ws.readyState });
|
|
ws.close();
|
|
};
|
|
|
|
ws.onerror = (e) => {
|
|
resolve({ status: 'error', error: 'Connection failed' });
|
|
};
|
|
|
|
ws.onclose = (e) => {
|
|
if (e.code !== 1000) {
|
|
resolve({ status: 'closed', code: e.code, reason: e.reason });
|
|
}
|
|
};
|
|
|
|
// Timeout after 5 seconds
|
|
setTimeout(() => {
|
|
resolve({ status: 'timeout', readyState: ws.readyState });
|
|
ws.close();
|
|
}, 5000);
|
|
});
|
|
});
|
|
|
|
console.log('WebSocket connection result:', wsResult);
|
|
});
|