diff --git a/apps/web/src/components/CallModal.tsx b/apps/web/src/components/CallModal.tsx index cdf0fc5..338bc3b 100644 --- a/apps/web/src/components/CallModal.tsx +++ b/apps/web/src/components/CallModal.tsx @@ -237,9 +237,16 @@ export default function CallModal({ isOpen, onClose, targetUser, callType: initi // Helper to update video UI state const checkVideo = () => { + const stream = remoteStreamRef.current; + if (!stream) { + setHasRemoteVideo(false); + return; + } const videoTracks = stream.getVideoTracks(); + // Be more lenient: if track is 'live', trust it even if it reports 'muted' initially. + // Some browsers report muted while the buffer is filling. const hasVideo = videoTracks.length > 0 && videoTracks.some( - t => t.readyState === 'live' && t.enabled && !t.muted + t => t.readyState === 'live' && t.enabled ); console.log('[checkVideo] remote videoTracks:', videoTracks.map(t => @@ -1308,6 +1315,16 @@ export default function CallModal({ isOpen, onClose, targetUser, callType: initi if (data.from !== targetUserIdRef.current) return; console.log('[onCallTypeChanged] New call type:', data.callType); setCallType(data.callType); + + // If remote switched to video, nudge the video element + if (data.callType === 'video') { + setTimeout(() => { + if (remoteVideoRef.current && remoteStreamRef.current) { + remoteVideoRef.current.srcObject = remoteStreamRef.current; + remoteVideoRef.current.play().catch(() => {}); + } + }, 500); + } }; socket.on('call_answered', onCallAnswered);