Twilio-video.js: Local audio loss after phone call on iOS 14 Safari

[markbrouch]

• [x] I have verified that the issue occurs with the latest twilio-video.js release and is not marked as a known issue in the CHANGELOG.md.
• [x] I reviewed the Common Issues and open GitHub issues and verified that this report represents a potentially new issue.
• [x] I verified that the Quickstart application works in my environment.
• [x] I am not sharing any Personally Identifiable Information (PII)
  or sensitive account information (API keys, credentials, etc.) when reporting this issue.

When on Mobile Safari on iOS 14, if user receives a phone call the microphone audio track will no longer transmit audio upon returning to the Twilio video call.

This issue occurred previously on iOS 13 and below but was fixed in a recent version of twilio-video.js. It has since reemerged on iOS 14.

Software versions:

• [x] Browser(s): Mobile Safari
• [x] Operating System: iOS 14+
• [x] twilio-video.js: 2.7.2
• [x] Third-party libraries (e.g., Angular, React, etc.): Vue (probably others too)

[makarandp0]

Thank you for reporting this issue @markbrouch - Yes we did implement some workarounds for iOS 13.x - we added mechanism to reacquire and replace the local audio track if it ends or gets silent after safari gets background/foregrounded - but perhaps those workarounds are not working as well for iOS 14. We have open an internal ticket ( JSDK-3031 ) and started investigating this as a high priority. Will keep you updated with our findings.

if you have consistent repro steps please share. Does this require a phone call or other apps like messenger call also has the same effect? Does declining incoming call also ends up with the same issue?

Any room-sid that repro'ed the issue, and if possible any client side (ios) console logs would be very helpful too.

Thanks,
Makarand

[markbrouch]

Thanks @makarandp0! We discovered this bug as a result of a user receiving a phone call while in a room with an active LocalAudioTrack. After returning to the mobile safari browser tab with the video call, the microphone stopped working (similar to the issue that was fixed for iOS 13 previously).

Here is an example video room and resulting Safari logs from the issue:

Room SID: RMe5044dabb28370466fadd285c77c9011

[Info] 2020-09-30 – "22:27:56.109Z" – "|" – "INFO" – "in" – "[connect #1]:" – "Connecting to a Room" (application-d875219ee6720055104e.js, line 113133)
[Info] 2020-09-30 – "22:27:56.111Z" – "|" – "INFO" – "in" – "[connect #1]:" – "Getting LocalTracks" (application-d875219ee6720055104e.js, line 113133)
[Info] 2020-09-30 – "22:27:56.111Z" – "|" – "INFO" – "in" – "[createLocalTracks #1]:" – "Neither audio nor video requested, so returning empty LocalTracks" (application-d875219ee6720055104e.js, line 113133)
[Info] 2020-09-30 – "22:27:56.238Z" – "|" – "INFO" – "in" – "[LocalParticipant #1]:" – "Created a new Participant" (application-d875219ee6720055104e.js, line 113133)
[Info] 2020-09-30 – "22:28:00.551Z" – "|" – "INFO" – "in" – "[LocalParticipant #1: PAabadcdc7fa8cedf89547a84702269659]:" – "reconnected" (application-d875219ee6720055104e.js, line 113133)
[Info] 2020-09-30 – "22:28:00.561Z" – "|" – "INFO" – "in" – "[RemoteParticipant #2: PA74edbce88d597d7bf71551d3a425dbe5]:" – "Created a new Participant: User/v1/14" (application-d875219ee6720055104e.js, line 113133)
[Info] 2020-09-30 – "22:28:00.563Z" – "|" – "INFO" – "in" – "[RemoteParticipant #2: PA74edbce88d597d7bf71551d3a425dbe5]:" – "Added a new AudioTrackPublication:" – "MT2394ed252a63008aaad39846eb700cb5" (application-d875219ee6720055104e.js, line 113133)
[Info] 2020-09-30 – "22:28:00.564Z" – "|" – "INFO" – "in" – "[RemoteParticipant #2: PA74edbce88d597d7bf71551d3a425dbe5]:" – "Added a new VideoTrackPublication:" – "MT28d5290b24d35db6a85a6bb93c9a670e" (application-d875219ee6720055104e.js, line 113133)
[Info] 2020-09-30 – "22:28:00.564Z" – "|" – "INFO" – "in" – "[Room #1: RMe5044dabb28370466fadd285c77c9011]:" – "A new RemoteParticipant connected:" – RemoteParticipant {_events: Object, _eventsCount: 1, _maxListeners: undefined, …} (application-d875219ee6720055104e.js, line 113133)
RemoteParticipant {_events: Object, _eventsCount: 1, _maxListeners: undefined, _audioTracks: Map, _dataTracks: Map, …}RemoteParticipant
[Info] 2020-09-30 – "22:28:00.570Z" – "|" – "INFO" – "in" – "[Room #1: RMe5044dabb28370466fadd285c77c9011]:" – "Created a new Room:" – "WebVideoCall/v1/gin-4xo-bbu" (application-d875219ee6720055104e.js, line 113133)
[Info] 2020-09-30 – "22:28:00.571Z" – "|" – "INFO" – "in" – "[connect #1]:" – "Connected to Room:" – "[Room #1: RMe5044dabb28370466fadd285c77c9011]" (application-d875219ee6720055104e.js, line 113133)
[Info] 2020-09-30 – "22:28:00.571Z" – "|" – "INFO" – "in" – "[connect #1]:" – "Room name:" – "WebVideoCall/v1/gin-4xo-bbu" (application-d875219ee6720055104e.js, line 113133)
[Info] 2020-09-30 – "22:28:00.841Z" – "|" – "INFO" – "in" – "[RemoteParticipant #2: PA74edbce88d597d7bf71551d3a425dbe5]:" – "Added a new AudioTrack:" – "ccc387a8-be4a-4a03-9a10-677688153a82" (application-d875219ee6720055104e.js, line 113133)
[Info] 2020-09-30 – "22:28:01.391Z" – "|" – "INFO" – "in" – "[RemoteParticipant #2: PA74edbce88d597d7bf71551d3a425dbe5]:" – "Added a new VideoTrack:" – "9100a1d3-b581-42b0-b5a3-5136a4ad13ca" (application-d875219ee6720055104e.js, line 113133)

[Warning] 2020-09-30 – "22:28:17.485Z" – "|" – "WARN" – "in" – "[RemoteVideoTrack #4: MT28d5290b24d35db6a85a6bb93c9a670e]:" – "Unintentionally paused:" –  (application-d875219ee6720055104e.js, line 113133)
<video autoplay playsinline></video>

<video autoplay playsinline></video>
[Warning] 2020-09-30 – "22:28:17.515Z" – "|" – "WARN" – "in" – "[RemoteAudioTrack #3: MT2394ed252a63008aaad39846eb700cb5]:" – "Unintentionally paused:" –  (application-d875219ee6720055104e.js, line 113133)
<audio autoplay data-sid="MT2394ed252a63008aaad39846eb700cb5"></audio>

<audio autoplay data-sid="MT2394ed252a63008aaad39846eb700cb5"></audio>
[Warning] 2020-09-30 – "22:28:17.522Z" – "|" – "WARN" – "in" – "[LocalVideoTrack #2: a4d75508-ea4a-4dc8-a5aa-4b3146a0a9ed]:" – "Unintentionally paused:" –  (application-d875219ee6720055104e.js, line 113133)
<video autoplay playsinline></video>

<video autoplay playsinline></video>
[Info] 2020-09-30 – "22:28:18.528Z" – "|" – "INFO" – "in" – "[RemoteVideoTrack #4: MT28d5290b24d35db6a85a6bb93c9a670e]:" – "Playing unintentionally paused <video> element" (application-d875219ee6720055104e.js, line 113133)
[Info] 2020-09-30 – "22:28:18.573Z" – "|" – "INFO" – "in" – "[RemoteVideoTrack #4: MT28d5290b24d35db6a85a6bb93c9a670e]:" – "Successfully played unintentionally paused <video> element" (application-d875219ee6720055104e.js, line 113133)
[Info] 2020-09-30 – "22:28:21.261Z" – "|" – "INFO" – "in" – "[RemoteParticipant #3: PA862165f1f9924f6bd52a6185632f8db3]:" – "Created a new Participant: Voip/Unauthenticated/AdHoc/1d060be1-bd69-4929-9777-be1600d6c6ab" (application-d875219ee6720055104e.js, line 113133)
[Info] 2020-09-30 – "22:28:21.265Z" – "|" – "INFO" – "in" – "[RemoteParticipant #3: PA862165f1f9924f6bd52a6185632f8db3]:" – "Added a new AudioTrackPublication:" – "MT0718b8800dc26f9099f391fb44874a27" (application-d875219ee6720055104e.js, line 113133)
[Info] 2020-09-30 – "22:28:21.266Z" – "|" – "INFO" – "in" – "[Room #1: RMe5044dabb28370466fadd285c77c9011]:" – "A new RemoteParticipant connected:" – RemoteParticipant {_events: Object, _eventsCount: 1, _maxListeners: undefined, …} (application-d875219ee6720055104e.js, line 113133)
RemoteParticipant {_events: Object, _eventsCount: 1, _maxListeners: undefined, _audioTracks: Map, _dataTracks: Map, …}RemoteParticipant
[Error] Unhandled Promise Rejection: NotAllowedError: The request is not allowed by the user agent or the platform in the current context, possibly because the user denied permission.
(anonymous function) (application-d875219ee6720055104e.js:83973)
promiseReactionJob
[Info] 2020-09-30 – "22:28:21.455Z" – "|" – "INFO" – "in" – "[RemoteParticipant #3: PA862165f1f9924f6bd52a6185632f8db3]:" – "Added a new AudioTrack:" – "f437b142-05a4-4001-872d-5182433fadd1" (application-d875219ee6720055104e.js, line 113133)
[Info] 2020-09-30 – "22:28:30.594Z" – "|" – "INFO" – "in" – "[Room #1: RMe5044dabb28370466fadd285c77c9011]:" – "RemoteParticipant disconnected:" – RemoteParticipant {_events: Object, _eventsCount: 15, _maxListeners: undefined, …} (application-d875219ee6720055104e.js, line 113133)
RemoteParticipant {_events: Object, _eventsCount: 15, _maxListeners: undefined, _audioTracks: Map, _dataTracks: Map, …}RemoteParticipant

[manjeshbhargav]

@markbrouch ,

Since you let us know that your issue was fixed in twilio-video.[email protected], I'll close this issue.

Thanks,

Manjesh Malavalli
JSDK Team

[ascpeter]

I'm still experiencing this sporadically on iOS 14.4, on SDK version 2.10.0. Getting errors like this:

[makarandp0]

Hello @ascpeter,

Thank you for reporting this, Can you add some details on what leads to this condition - Does it involve a video room being interrupted by a phone call or another application switch - Any details that you can provide to narrow down the repro would help a lot,

Thanks,
Makarand

[ascpeter]

@makarandp0 , I included details here: https://github.com/twilio/twilio-video.js/issues/1387