aws/amazon-ivs-react-native-player

Player not visible when wrapped inside View

soemarko opened this issue · 4 comments

soemarko commented

Describe the bug
As titled. I still can hear the audio playing, and I have the live latency logs, and it seems like the streams ran just fine.

To reproduce

  1. $ npx create-expo-app ivs
  2. $ cd ivs
  3. $ npm i amazon-ivs-react-native-player
  4. $ expo run:ios

Run the basic example with a <IVSPlayer> wrapped inside a <View>

import IVSPlayer from 'amazon-ivs-react-native-player';

const URL =
  'https://fcc3ddae59ed.us-west-2.playback.live-video.net/api/video/v1/us-west-2.893648527354.channel.YtnrVcQbttF0.m3u8';

export default function App() {
  return (
    <View>
      <IVSPlayer
        streamUrl={URL}
        onLiveLatencyChange={(latency) => {
         console.log('live latency: ', latency);
        }}
      />
    </View>
  );
}

Expected behavior
Player still visible

Screenshots
image

Device (please complete the following information):

  • Simulator or Real Device: Just simulator atm, I'll update after tested on device.
  • Device: iPhone 13
  • OS: iOS 15

Debug logs
You can turn on debug logging using the logLevel prop.

Additional context
Built and run with expo.

soemarko commented

Figured it out by removing the advanced example bit by bit, so at the very least the wrapping View had to have flex: 1, justifyContent: 'center'

proformance commented

Hi @soemarko,

I'm trying to run this in expo but only get the following error:

ERROR  Invariant Violation: requireNativeComponent: "AmazonIvs" was not found in the UIManager.

This error is located at:
    in AmazonIvs
    in RCTView (created by View)
    in View
    in Unknown (created by Game)
    in RCTView (created by View)
    in View (created by Game)
    in RCTView (created by View)
    in View (created by Game)
    in RCTSafeAreaView (created by Game)
    in Game (created by App)
    in RCTView (created by View)
    in View (created by App)
    in App (created by withDevTools(App))
    in withDevTools(App)
    in RCTView (created by View)
    in View (created by AppContainer)
    in RCTView (created by View)
    in View (created by AppContainer)
    in AppContainer
    in main(RootComponent), js engine: hermes
 WARN  Possible Unhandled Promise Rejection (id: 0):
Invariant Violation: requireNativeComponent: "AmazonIvs" was not found in the UIManager.

I thought it was required to run "pod install", how is that done in an expo app?

Best regards

soemarko commented

You don't need pod install with expo. Although I personally have move away from expo, it's much harder to test on device with expo than without.

proformance commented

After reading about expo prebuild I got it working, thanks for the reply!