React-native-track-player: ( Bug ) Require second Press to play audio from Stream URL

[shiroze]

Configuration

react: 16.8.3
react-native: 0.59.8
react-native-track-player:1.1.4

Issue

Test on iOS

Streaming URL, no Audio when first press.
The audio play when we press play twice.

Step :

1. Press play and state playing become true
2. Pause and play again then audio is playing

it work fine on build v1.0.0 and URL File

Code

import React, {Component} from 'react';
import { 
  Platform,
  StyleSheet,
  Text,
  View,
  TouchableOpacity,
  YellowBox
} from 'react-native';
import TrackPlayer from 'react-native-track-player';


const instructions = Platform.select({
  ios: 'Press Cmd+R to reload,\n' + 'Cmd+D or shake for dev menu',
  android:
    'Double tap R on your keyboard to reload,\n' +
    'Shake or press menu button for dev menu',
});

export default class App extends Component {
  constructor() {
    super();
    this.state = {
      isplaying: false
    };

    YellowBox.ignoreWarnings(['Setting a timer']);
    }

  componentWillMount () {
    TrackPlayer.setupPlayer();
  }

  componentDidMount() {
    TrackPlayer.updateOptions({
      stopWithApp: true,
      capabilities: [
        TrackPlayer.CAPABILITY_PLAY,
        TrackPlayer.CAPABILITY_STOP
      ],
      compactCapabilities: [
        TrackPlayer.CAPABILITY_PLAY,
      ]
    });
  }

  onPlay = async () => {
    const currentTrack = await TrackPlayer.getCurrentTrack();
    this.setState({
      isplaying: !this.state.isplaying
    });

    if (currentTrack == null && this.state.isplaying) {
      await TrackPlayer.reset();
      await TrackPlayer.add({
        id: "1",
        url: "https://live.hunter.fm/country",
        title: "Track Title",
        artist: "Track Artist",
        artwork: "https://www.playradio.rs/images/play_button.png"
      });
      await TrackPlayer.setVolume(1);

      await TrackPlayer.play();
    } else {
      await TrackPlayer.stop();
    }
    // { 
    //   "id": "1111",
    //   "url": "https://drive.google.com/uc?export=download&id=1AjPwylDJgR8DOnmJWeRgZzjsohi-7ekj",
    //   "title": "Longing",
    //   "artist": "David Chavez",
    //   "artwork": "https://picsum.photos/200"
    // },
  }

  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>Welcome to React Native!</Text>
        <Text style={styles.instructions}>To get started, edit App.js</Text>
        <Text style={styles.instructions}>{instructions}</Text>
        <TouchableOpacity
          style={{ 
            marginTop: 30,
            height: 70, width: 100,
            backgroundColor: '#7FB3D5',
            borderRadius: 10,
            borderWidth: 2,
            alignItems: 'center',
            justifyContent: 'center'
          }}
          onPress={ () => this.onPlay() }
        >
          <Text
          >{ this.state.isplaying ? "Pause" : "Play" }</Text>
        </TouchableOpacity>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
  },
});

[shiroze]

Problem Solved Using :

TrackPlayer.setupPlayer({
       waitForBuffer: true
});