From c2169f7813d1c0d20ee261a2773764c38c77b782 Mon Sep 17 00:00:00 2001 From: Stanislav Dmitrenko <7953703+avently@users.noreply.github.com> Date: Tue, 16 Apr 2024 14:22:40 +0700 Subject: [PATCH] desktop: fix video calls in Firefox (#4034) * desktop: fix video calls in Firefox * one more play() --- .../common/src/commonMain/resources/assets/www/call.js | 10 ++++++++-- .../commonMain/resources/assets/www/desktop/call.html | 2 -- packages/simplex-chat-webrtc/src/call.ts | 8 +++++++- packages/simplex-chat-webrtc/src/desktop/call.html | 2 -- 4 files changed, 15 insertions(+), 7 deletions(-) diff --git a/apps/multiplatform/common/src/commonMain/resources/assets/www/call.js b/apps/multiplatform/common/src/commonMain/resources/assets/www/call.js index a2cc4a2f27..9d9782e90c 100644 --- a/apps/multiplatform/common/src/commonMain/resources/assets/www/call.js +++ b/apps/multiplatform/common/src/commonMain/resources/assets/www/call.js @@ -38,7 +38,7 @@ const processCommand = (function () { const defaultIceServers = [ { urls: ["stuns:stun.simplex.im:443"] }, { urls: ["stun:stun.simplex.im:443"] }, - //{ urls: ["turns:turn.simplex.im:443?transport=udp"], username: "private2", credential: "Hxuq2QxUjnhj96Zq2r4HjqHRj" }, + //{urls: ["turns:turn.simplex.im:443?transport=udp"], username: "private2", credential: "Hxuq2QxUjnhj96Zq2r4HjqHRj"}, { urls: ["turns:turn.simplex.im:443?transport=tcp"], username: "private2", credential: "Hxuq2QxUjnhj96Zq2r4HjqHRj" }, ]; function getCallConfig(encodedInsertableStreams, iceServers, relay) { @@ -376,6 +376,9 @@ const processCommand = (function () { // setupVideoElement(videos.remote) videos.local.srcObject = call.localStream; videos.remote.srcObject = call.remoteStream; + // Without doing it manually Firefox shows black screen but video can be played in Picture-in-Picture + videos.local.play(); + videos.remote.play(); } async function setupEncryptionWorker(call) { if (call.aesKey) { @@ -448,7 +451,9 @@ const processCommand = (function () { codecs.splice(selectedCodecIndex, 1); codecs.unshift(selectedCodec); for (const t of call.connection.getTransceivers()) { - if (((_a = t.sender.track) === null || _a === void 0 ? void 0 : _a.kind) === "video") { + // Firefox doesn't have this function implemented: + // https://bugzilla.mozilla.org/show_bug.cgi?id=1396922 + if (((_a = t.sender.track) === null || _a === void 0 ? void 0 : _a.kind) === "video" && t.setCodecPreferences) { t.setCodecPreferences(codecs); } } @@ -486,6 +491,7 @@ const processCommand = (function () { replaceTracks(pc, videoTracks); call.localStream = localStream; videos.local.srcObject = localStream; + videos.local.play(); } function replaceTracks(pc, tracks) { if (!tracks.length) diff --git a/apps/multiplatform/common/src/commonMain/resources/assets/www/desktop/call.html b/apps/multiplatform/common/src/commonMain/resources/assets/www/desktop/call.html index 59ca2b58b0..2600062b02 100644 --- a/apps/multiplatform/common/src/commonMain/resources/assets/www/desktop/call.html +++ b/apps/multiplatform/common/src/commonMain/resources/assets/www/desktop/call.html @@ -10,7 +10,6 @@ diff --git a/packages/simplex-chat-webrtc/src/call.ts b/packages/simplex-chat-webrtc/src/call.ts index f3b9af784b..1d68b83f73 100644 --- a/packages/simplex-chat-webrtc/src/call.ts +++ b/packages/simplex-chat-webrtc/src/call.ts @@ -577,6 +577,9 @@ const processCommand = (function () { // setupVideoElement(videos.remote) videos.local.srcObject = call.localStream videos.remote.srcObject = call.remoteStream + // Without doing it manually Firefox shows black screen but video can be played in Picture-in-Picture + videos.local.play() + videos.remote.play() } async function setupEncryptionWorker(call: Call) { @@ -652,7 +655,9 @@ const processCommand = (function () { codecs.splice(selectedCodecIndex, 1) codecs.unshift(selectedCodec) for (const t of call.connection.getTransceivers()) { - if (t.sender.track?.kind === "video") { + // Firefox doesn't have this function implemented: + // https://bugzilla.mozilla.org/show_bug.cgi?id=1396922 + if (t.sender.track?.kind === "video" && t.setCodecPreferences) { t.setCodecPreferences(codecs) } } @@ -690,6 +695,7 @@ const processCommand = (function () { replaceTracks(pc, videoTracks) call.localStream = localStream videos.local.srcObject = localStream + videos.local.play() } function replaceTracks(pc: RTCPeerConnection, tracks: MediaStreamTrack[]) { diff --git a/packages/simplex-chat-webrtc/src/desktop/call.html b/packages/simplex-chat-webrtc/src/desktop/call.html index 59ca2b58b0..2600062b02 100644 --- a/packages/simplex-chat-webrtc/src/desktop/call.html +++ b/packages/simplex-chat-webrtc/src/desktop/call.html @@ -10,7 +10,6 @@