expo: [expo-av] NullPointerException at VideoView.java

🐛 Bug Report

Summary of Issue

I have an app that uses expo-av to show videos from users gallery. I am getting crash reports from play console.

Environment - output of `expo diagnostics` & the platform(s) you’re targeting

I am using expo-av on bare react native project.

react-native : 0.62.2 expo-av: 8.2.1 expo-image-picker: 8.3.0 react-native-unimodules: 0.10.1

buildToolsVersion = “29.0.0” minSdkVersion = 21 compileSdkVersion = 29 targetSdkVersion = 29

Reproducible Demo

I don’t have a reproducible demo because i don’t know what causes this issue.

Steps to Reproduce

I don’t have steps to reproduce the error because i don’t know what causes this issue.

Expected Behavior vs Actual Behavior

Expected behavior is that the application does not crash. Actual behavior is app crashing.

Stack Trace

java.lang.NullPointerException: 
  at expo.modules.av.video.VideoView$5.a (VideoView.java:111)
  at expo.modules.av.player.SimpleExoPlayerData.a (SimpleExoPlayerData.java:14)
  at com.google.android.exoplayer2.ExoPlayerImpl$PlaybackInfoUpdate.notifyListeners (ExoPlayerImpl.java:169)
  at com.google.android.exoplayer2.ExoPlayerImpl.a (ExoPlayerImpl.java:63)
  at com.google.android.exoplayer2.ExoPlayerImpl.a (ExoPlayerImpl.java:79)
  at com.google.android.exoplayer2.ExoPlayerImpl.a (ExoPlayerImpl.java:93)
  at com.google.android.exoplayer2.ExoPlayerImpl$1.handleMessage (ExoPlayerImpl.java:2)
  at android.os.Handler.dispatchMessage (Handler.java:112)
  at android.os.Looper.loop (Looper.java:216)
  at android.app.ActivityThread.main (ActivityThread.java:7625)
  at java.lang.reflect.Method.invoke (Method.java)
  at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run (RuntimeInit.java:524)
  at com.android.internal.os.ZygoteInit.main (ZygoteInit.java:987)

My Code

<Video
    source={{ uri: this.state.videoPath }}
    ref={ (ref) => this.player = ref }
    shouldPlay={this.state.pauseVideo}
    isLooping
    useNativeControls={true}
    style={{ width: Dimensions.get("window").width, height: "100%" }}
    resizeMode={Video.RESIZE_MODE_CONTAIN}
/>

VideoView.java:111 points to this which is a function that throws an error and this function called in this and this function.

The first one is setSource and other one is onLoadError so my guess is when loading the video something happens. Maybe unsupported video format? How can i solve or debug this problem? Thank you so much.

About this issue

Original URL
State: closed
Created 4 years ago
Comments: 22 (6 by maintainers)

Most upvoted comments

I’ve actually been able to reproduce the problem using the information provided by @ahmetbicer There is an issue with how the error-handler cleans up the media-player controls when an error occurs when loading the video source. I’m working on a solution.

IjzerenHein on Aug 6, 2020

Thank you so much for everything! I am closing this issue as it resolved with PR.

ahmetbicer on Aug 7, 2020

@IjzerenHein I do the changes in #9596 pr in my local expo-av package and it is not crashes the app anymore. It is now showing blank screen for video but i can handle this with onError method on component. I would like to ask one more question. Is my implementation in this comment of showing a video is correct? How can i improve it? Thank you so much for the effort!

I’d probably do it like this:

  openGallery = async () => {
    const { status } = await ImagePicker.requestCameraRollPermissionsAsync();
    if (status == "granted") {
      try {
        const result = await ImagePicker.launchImageLibraryAsync({
          mediaTypes: ImagePicker.MediaTypeOptions.Videos,
        });
        if (!result.cancelled && typeof result.uri === 'string') ) {
          this.setState({ videoPath: result.uri, showVideo: true });
        }
      } catch (err) {
        console.log(err)
        crashlytics().recordError(err);
      }
    }
  }

IjzerenHein on Aug 7, 2020

@IjzerenHein Thank you so much for the help! I am glad that you could reproduce the error!

ahmetbicer on Aug 6, 2020

it is not best practice to trust what is coming from a user’s device directly into your logic.

then(result => {
        if (!result.cancelled) {
          this.setState({ videoPath: result.uri });
        }
      })

Add some validation around result.uri if anything, that most likely is the source of your NPE

Bug-Generator on Aug 4, 2020

I am closing this issue to get more information and better stack traces from users. When i reproduce the error i will re-open and we can discuss about it more. Thank you for all the help!

ahmetbicer on Aug 1, 2020

I am listing the devices that affected: Huawei -> Nova 5T, P30 PRO, P10, P30 Lite, P20, HONOR 10i, P10 Plus Xiaomi -> Redmi Note 8 pro Samsung -> S20+, S10e, S10+, S8 Oneplus -> 8 5G

Affected android api versions -> 10 (68%), 9 (25%), 8 (7%)

I am trying to reproduce the problem but there is no chance for now.

Thank you for the help btw!

ahmetbicer on Jul 30, 2020