This was a lot to hold in your head at once.
Start by reproducing the bugs and tracing the data flow from frontend to backend to WebSocket. Prioritize critical path issues (video sync, chat) and fix them incrementally, testing each fix with multiple clients. Use logging and browser dev tools to isolate whether the problem is in the client, server, or socket layer.
Pro tip: Demonstrate a systematic debugging process: form a hypothesis, test it with minimal changes, and verify with multiple clients. Also, mention that you'd add automated tests for the sync logic to prevent regressions.
Run the app with multiple clients to reproduce bugs. List issues by severity: video sync, chat, room management.
For each bug, trace the data flow: frontend event -> API call -> backend processing -> WebSocket broadcast -> client update. Use logging and dev tools to pinpoint failures.
Check backend endpoints for room creation/joining, message handling, and video state persistence. Ensure proper error handling and data validation.
Verify WebSocket connection, event names, and payloads. Ensure server broadcasts video events (play, pause, seek) to all clients in the room and handles reconnection.
Update frontend to emit correct events, handle incoming WebSocket messages, and update UI. Test with multiple clients to confirm sync and chat work.
AI-generated suggestions, not part of the candidate's original notes. May be inaccurate — verify before relying on them.