react-native-twilio-video-webrtc icon indicating copy to clipboard operation
react-native-twilio-video-webrtc copied to clipboard

setLocalAudioEnabled() has to be explicitly set to true for iOS to transfer local audio

Open DanielMenke opened this issue 4 years ago • 3 comments

Steps to reproduce

  1. Run example code on iOS 14 phone
  2. Try to use local microphone

Expected behaviour

Audio is transferred to peers.

Actual behaviour

No audio is received by the peers. twilioRef.current.setLocalAudioEnabled(true) has to be explicitly called on sender side, before any audio gets transferred. This is not mentioned in the example application and should be fixed.

Environment

  • Node.js version: 14.4.0
  • React Native version: 5.0.1
  • React Native platform + platform version: iOS 14.0

react-native-twilio-video-webrtc

Version: 2.0.0

DanielMenke avatar Apr 09 '21 13:04 DanielMenke

Hm, that should definitely not be the case. When the component is mounted, the local audio track is set up here:

https://github.com/blackuy/react-native-twilio-video-webrtc/blob/master/src/TwilioVideo.ios.js#L166

That calls into the location where the track is enabled:

https://github.com/blackuy/react-native-twilio-video-webrtc/blob/master/ios/RCTTWVideoModule.m#L196

Can you verify that these steps are happening in your build? I wonder if there's a race condition somewhere...

slycoder avatar Apr 10 '21 18:04 slycoder

Yeah can confirm these steps are getting called.

The only difference of my code to the one in the example is that I have an extra component that wraps the TwilioVideo component, so I can exchange it with a mocked component in certain scenarios:

import React, { forwardRef, useRef } from 'react';
import {
  RoomErrorEventCb,
  RoomEventCb,
  TrackEventCb,
  TwilioVideo,
} from 'react-native-twilio-video-webrtc';

interface Props {
  onRoomDidConnect: RoomEventCb;
  onRoomDidDisconnect: RoomErrorEventCb;
  onRoomDidFailToConnect: RoomErrorEventCb;
  onParticipantAddedVideoTrack: TrackEventCb | any;
  onParticipantRemovedVideoTrack: TrackEventCb | any;
}

const TwilioWrapper = forwardRef((props: Props, ref: any) => {
  return (
    <TwilioVideo
      ref={ref}
      onRoomDidConnect={props.onRoomDidConnect}
      onRoomDidDisconnect={props.onRoomDidDisconnect}
      onRoomDidFailToConnect={props.onRoomDidFailToConnect}
      onParticipantAddedVideoTrack={props.onParticipantAddedVideoTrack}
      onParticipantRemovedVideoTrack={props.onParticipantRemovedVideoTrack}
    />
  );
});

export default TwilioWrapper;

The ref is forwarded from a component which handles the rest of the video session UI. On android everything works fine btw.

DanielMenke avatar Apr 12 '21 09:04 DanielMenke

Can you try the branch in #479 and see if that solves the issue?

slycoder avatar Apr 26 '21 01:04 slycoder