React-native-track-player: running TrackPlayer.add twice gives warning

Created on 26 Sep 2019  路  10Comments  路  Source: react-native-kit/react-native-track-player

Configuration

System:
OS: Linux 5.0 Ubuntu 18.04.3 LTS (Bionic Beaver)
CPU: (8) x64 Intel(R) Core(TM) i5-8265U CPU @ 1.60GHz
Memory: 666.30 MB / 15.51 GB
Shell: 4.4.20 - /bin/bash
Binaries:
Node: 9.11.2 - /usr/bin/node
npm: 6.11.3 - /usr/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
npmPackages:
react: 16.9.0 => 16.9.0
react-native: 0.61.0 => 0.61.0
npmGlobalPackages:
react-native-cli: 2.0.1

using master react-native-track-player

Issue

Not sure if Issue or intended, haven't found anything on the docs.

In my app I have different playlists to play depend on argument, when I enter the same screen with TrackPlayer and load playlist I get an warning:

Error: You attempted to set the key 0 with the value {...} on an object that is meant to be immutable and has been frozen.

I expected that after running TrackPlayer.reset() I will be able to add another list of tracks.
To make sure I just tried to reset, add, reset and add again as you will see in the code below, this gives the same warning.

I run on emulation of android 9.0

Code

TrackPlayer.setupPlayer().then(async () => {
  // Adds a track to the queue
  await TrackPlayer.reset();
  await TrackPlayer.add(TRACKS);
  await TrackPlayer.reset();
  await TrackPlayer.add(TRACKS);
});

Most helpful comment

What worked for me was creating a copy of the tracks array when adding.

TrackPlayer.add([...tracks]);

I haven't had the time to determine why this would be necessary.

All 10 comments

I had the same problem and i fixed it this way

TrackPlayer.setupPlayer().then(async () => { // Adds a track to the queue await TrackPlayer.reset(); await TrackPlayer.add(tracks); await TrackPlayer.reset(); tracks.foreach((track) => { TrackPlayer.add(track) }) });

I hope this can help you.

Yeah I also found that adding the tracks one by one helps. Thanks for the comment!

TrackPlayer.setupPlayer().then(async () => { // Adds a track to the queue await TrackPlayer.reset(); await TrackPlayer.add(tracks); await TrackPlayer.reset(); tracks.foreach((track) => { TrackPlayer.add(track) }) })

using this solution we can not skip song immediately please give another solution

@Guichaguri Thank you for this amazing library. In android, it seems not allow to add tracks twice. What is the right solution for this case?

I just ran to this issue too.... solution anyone?

What worked for me was creating a copy of the tracks array when adding.

TrackPlayer.add([...tracks]);

I haven't had the time to determine why this would be necessary.

TrackPlayer.setupPlayer().then(async () => { // Adds a track to the queue await TrackPlayer.reset(); await TrackPlayer.add(tracks); await TrackPlayer.reset(); tracks.foreach((track) => { TrackPlayer.add(track) }) })

using this solution we can not skip song immediately please give another solution

I also had this problem, maybe related to this? If I added tracks then reset (to clear queue) and added more tracks, I couldn't "skip" to change tracks.

My workaround for now was to not reset but remove tracks individually before adding more:

// await TrackPlayer.reset(); // Bug with just resetting, the player doesn't skip after that.
const tracks = await TrackPlayer.getQueue();
tracks.forEach((track) => {
  TrackPlayer.remove(track.id);
});
await TrackPlayer.add(newTracks);
await TrackPlayer.skip(newTracks[4].id); // skip to any track that's not the first

:tada:

Anyone managed to get this working? Facing the same issue.

Fix released in 1.2.4

Was this page helpful?
0 / 5 - 0 ratings

Related issues

mckmarc picture mckmarc  路  4Comments

ManrickCapotolan picture ManrickCapotolan  路  4Comments

KalebPortillo picture KalebPortillo  路  4Comments

moduval picture moduval  路  3Comments

tarahiw picture tarahiw  路  3Comments