iOS TrackPlayer keeps playing on fast refresh

[formula1]

trafficstars

Describe the Bug When I start playing a track and I reload the app by pressing r in the react-native start log, the TrackPlayer keeps playing

Then after the song finishes, the app crashes.

I don't believe the end user will be using fast refresh but it adds extra steps for my own development.

Steps To Reproduce

git clone [email protected]:DoubleSymmetry/react-native-track-player.git
cd react-native-track-player/example
yarn install
cd ios
pod install
cd ..

# in terminal 1
npx react-native start

# in terminal 2
npx react-native run-ios

# After load app in simulator
# press play

# in terminal 1
r

Environment Info:

react-native-track-player: 2.1.2

System:
    OS: macOS 11.6.2
    CPU: (8) x64 Intel(R) Core(TM) i7-6700HQ CPU @ 2.60GHz
    Memory: 854.81 MB / 16.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 16.11.1 - /usr/local/bin/node
    Yarn: 1.7.0 - /usr/local/bin/yarn
    npm: 8.0.0 - /usr/local/bin/npm
    Watchman: Not Found
  Managers:
    CocoaPods: 1.11.2 - /usr/local/bin/pod
  SDKs:
    iOS SDK:
      Platforms: DriverKit 21.2, iOS 15.2, macOS 12.1, tvOS 15.2, watchOS 8.3
    Android SDK: Not Found
  IDEs:
    Android Studio: Not Found
    Xcode: 13.2.1/13C100 - /usr/bin/xcodebuild
  Languages:
    Java: 10.0.2 - /usr/bin/javac
  npmPackages:
    @react-native-community/cli: Not Found
    react: 17.0.2 => 17.0.2 
    react-native: 0.65.1 => 0.65.1 
    react-native-macos: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

How I can Help

I tried

• destroying the TrackPlayer when a component mounts
• destroying the TrackPlayer when when the main component mounts
• Listening to the remote stop listener, doesn't trigger

I assume the app creates a second instance on refresh, I just don't understand how it works.

[bradfloodx]

Good catch, thanks.

[jspizziri]

I'm reclassifying this from a "bug" to an "enhancement" since it's more of an improvement to the developer experience rather than a bug that affects end-users.

[github-actions[bot]]

This issue is stale because it has been open 90 days with no activity. Remove stale label or comment or this will be closed in 7 days.

[jspizziri]

Since this has been open for so long and no one is going to champion it, I'm going to close it. It seems that it's not a significant enough issue for anyone to put in the effort to fix it. I'll add it to our Feature Backlog for review at some point in the future.

[pke]

Fast-Reload and the likes always struggle with singletons. So from what I undestand, the player needs to be reset on reload? Or just stopped?

This could be achieved like this:

module.hot?.dispose(() => {
  TrackPlayer.stop();
});

But I don't know which internal other states the player maintains as a singleton that are affected by hot-reload. I am also not sure, if the dispose method can be async and wait for the player to stop.

[jspizziri]

@pke I'd be happy to review a PR and do some testing. The only other internal state would be the queue itself.

[pke]

So I went right ahead and tried it out. But unlike in my other projects it does not work with current RN 0.7x. The bundler maybe changed some things. I will try to find out whats going on and then provide a PR.

I am not sure how to handle the queue though. Depending on when and where you add tracks to the queue a hot-reload might or might not have to clear the queue. I think that can only be left in the hands of the individual developers. Maybe we can add a section about hot reloading during development in the readme.