LonelyCpp / react-native-youtube-iframe

A wrapper of the Youtube-iframe API built for react native.
https://lonelycpp.github.io/react-native-youtube-iframe/
MIT License
613 stars 155 forks source link

seekTo messes up playerRef and causing video keep playing #273

Open bayramn opened 2 years ago

bayramn commented 2 years ago

Describe the bug Calling seekTo while video is playing messes the playerRef and video keep playing regardless of being stopped. It took few hours to figure out this exact point of issue, but it only happens when you seekTo without stopping video while playing. If you stop the video and seekTo and play, everything fine. So for workaround: I stop the video before calling seekTo and play video right after done seeking, works fine and doesn't slow the video down, but it's bit weird.

To Reproduce Steps to reproduce the behavior:

  const playerRef = useRef();

<YoutubePlayer
    initialPlayerParams={{
      start: video && video.timestamp,
      //  controls: false
    }}
    playbackRate={videoSpeed}
    ref={playerRef}
    height={250}
    videoId={videoId}
    //play={true}
    play={videoPlaying}
    onChangeState={(state) => {
      handlePlayerStateChange(state);
    }}
    webViewProps={{ androidLayerType: "software" }}
  />

const forward = async () => {
  try {
    const currentTime = await playerRef.current.getCurrentTime();
    //console.log(await playerRef.current);
    await playerRef.current.seekTo(currentTime + 15, true);
  } catch (err) {
    console.log(err);
  }
};

Expected behavior When seekTo called while video is playing, it shouldn't mess the playerRef and it should stop when stopped.

Smartphone (please complete the following information):

Additional context Workaround:

const forward = async () => {
  setVideoPlaying(false);
  try {
    const currentTime = await playerRef.current.getCurrentTime();
    //console.log(await playerRef.current);
    await playerRef.current.seekTo(currentTime + 15, true);
    setVideoPlaying(true);
  } catch (err) {
    console.log(err);
  }
};
darias08 commented 1 year ago

Could you please show your full code? I am confused as to where the forward function is being used in your youtube component.