Setting Twitch Player autoplay to false causes permanent loading state

[shahrodkh]

I am running into a bug that occurs when the Twitch SDK is initialized as such

new Twitch.Player(this.playerId, {
  ...
  autoplay: false,
}

The symptom is that, after the player is rendered initially with a URL, then once again with a different URL, from this point forward no new URLs will cause a rerender of the player. You can reproduce this in the demo:

1. in demo/App.js edit initial state:

  state = {
    url: null,
    playing: false,
    ...

2. follow the instructions to run the demo in your browser
3. click Twitch Test A
4. click play
5. click Twitch Test B

Now you are in a broken state. Try to click any of the Twitch test videos and they will not render.

I have stepped through the code and can provide these details on the flow:

1. Player is rendered with a URL prop
2. Player emits Twitch.Player.READY
3. Player emits Twitch.Player.PAUSE
4. User presses play to start the video
5. Player emits Twitch.Player.PLAY
6. User clicks on Twitch Test B
7. Player rerendered with a new url prop
8. componentWillReceiveProps hook sets this.isLoading to true
9. Player starts playing nextProps.url but DOES NOT emit Twitch.Player.PLAY
10. Now Player internal state isLoading is stuck at true, meaning any further URLs passed will not make it to load()

I am not sure if this is something you can handle in your library, since I can only assume the Twitch SDK should emit the PLAY event.

I also feel that using the playing prop to control autoplay in the Twitch SDK is misleading. This prop should be used to play or pause the player. In fact, once the getSDK method is called on the Twitch Player, it is never called again unless you tear down the parent. Maybe you should expose a way to force call getSDK again.

Thanks for your time