[BUG] [Android] Setting controls prop causes a crash: Null object reference in getPlayer()

[jakubjuraszek]

Describe the bug
Setting the controls prop to any value other than undefined causes an application crash on Android with the following error:

Error while updating property 'controls' of a view managed by: RNJWPlayerView

null

Attempt to invoke virtual method 'com.jwplayer.pub.api.JWPlayer 
com.jwplayer.rnjwplayer.RNJWPlayer.getPlayer()' on a null object reference

To Reproduce

1. Use the Example application as reference material to reproduce the issue.
2. Pass the controls prop with any value (e.g., false or true).
3. Run the application on an Android emulator or physical device.
4. The app crashes immediately with a null reference error.

Expected behavior
The application should not crash when the controls prop is set. The player should properly initialize and display controls accordingly.

Screenshots / Visual evidence

Device(s) affected
Any Android (Emulator or real device)

Additional context
This issue seems to be related to the player instance not being initialized when the controls prop is set. A possible fix could involve ensuring getPlayer() is called only after proper initialization.

[chaimPaneth]

You can change / patch RNJWPlayerViewManager.java setControls function with

  @ReactProp(name = "controls")
  public void setControls(RNJWPlayerView view, Boolean controls) {
    if (view == null || view.mPlayerView == null) {
      return;
    }
    view.mPlayerView.getPlayer().setControls(controls);
  }

this will fix your issue.

[jakubjuraszek]

@chaimPaneth Reopening the ticket because:

• After applying the patch, the controls prop still does not hide controls on Android.
• After applying the patch, fullscreen mode no longer works (black screen with audio playing in the background).
• Even if fullscreen worked after the patch (which is a strange issue, but reverting the patch made fullscreen work again), the patch does not provide any additional benefit beyond using controls={Platform.OS === 'ios' ? condition : undefined}.
  Please investigate further.

[Jmilham21]

@jakubjuraszek I'm unable to reproduce this issue. When I set controls: false as a prop, the expected behavior occurs for me. I have done this in this repo's SingleExample of the Example app.

I think the suggestion @chaimPaneth provided stops the crash, but whatever is causing this situation is blocking you from ever having the controls turned off. Another option is to hide all the UiGroups like below. This provides essentially the same effect and is a safer option, I believe.

"uiConfig": {
      "hasOverlay": false,
      "hasControlbar": false,
      "hasCenterControls": false,
      "hasNextUp": false,
      "hasSideSeek": false,
      "hasError": false,
      "hasPlaylist": false,
      "hasQualitySubMenu": false,
      "hasCaptionsSubMenu": false,
      "hasPlaybackRatesSubMenu": false,
      "hasAudiotracksSubMenu": false,
      "hasMenu": false,
      "hasPlayerControlsContainer": false,
      "hasCastingMenu": false,
      "hasChapters": false,
      "hasAds": false
    }

Can you provide the configuration you are using or more information on how to recreate the issue?

[jakubjuraszek]

@Jmilham21 code below. This is pure RN (0.73) app with JWPlayer 1.0.3. controls={false} causes a crash on Android.

import JWPlayer from '@jwplayer/jwplayer-react-native';
import React, {useRef} from 'react';
import {ScrollView, StyleSheet} from 'react-native';

function App(): React.JSX.Element {
  const jwplayer = useRef<JWPlayer | null>(null);

  const jwConfig = {
    license: 'YOUR_LICENSE_KEY',
    preload: 'auto',
    backgroundAudioEnabled: true,
    autostart: true,
    title: 'Single Inline Linear Preroll',
    fullScreenOnLandscape: true,
    exitFullScreenOnPortrait: true,
    landscapeOnFullScreen: true,
    portraitOnExitFullScreen: true,
    playerInModal: true,
    playlist: [
      {
        title: 'Single Inline Linear Preroll',
        file: 'https://content.bitsontherun.com/videos/q1fx20VZ-52qL9xLP.mp4',
      },
    ],
    advertising: {
      client: 'googima',
    },
  };

  return (
    <ScrollView contentContainerStyle={styles.container}>
      <JWPlayer
        style={styles.player}
        ref={jwplayer}
        config={jwConfig}
        controls={false} // Causes a crash on Android
      />
    </ScrollView>
  );
}

const styles = StyleSheet.create({
  container: {
    flexGrow: 1,
    justifyContent: 'center',
    alignItems: 'center',
    paddingVertical: 20,
  },
  player: {
    width: '100%',
    height: 428,
  },
});

export default App;

[Jmilham21]

I'll follow up when I get a chance to test. Thanks @jakubjuraszek