AbortError: The play() request was interrupted by a new load request.

[andreysamode]

Which API doesn't behave as documented, and how does it misbehave?
In Chrome on the web version, when switching to a new song while the first song is still loading, I get the following error that interrupts the debug process:
AbortError: The play() request was interrupted by a new load request. https://goo.gl/LdLk22

Minimal reproduction project
https://github.com/mrandrey/just_audio_bug_report/

To Reproduce (i.e. user steps, not code)

1. Launch in debug mode in Chrome
2. Quickly click on Song 1, Song 2, Song 3, Song 2, Song 1, etc.
3. The debug process should interrupt with the error.

Error messages

AbortError: The play() request was interrupted by a new load request. https://goo.gl/LdLk22

Expected behavior
I expect the loading/buffering to stop, then the new song to load.

Desktop (please complete the following information):

• OS: Mac OS Sonoma
• Browser: Chrome

Smartphone (please complete the following information):

• The problem is only on the web version.

Flutter SDK version

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.13.6, on macOS 14.0 23A344 darwin-x64, locale en-US)
[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
[✓] Xcode - develop for iOS and macOS (Xcode 14.3.1)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2022.3)
[✓] Connected device (2 available)
[✓] Network resources

• No issues found!

Additional context
The project is to have an album with preview songs and an ability to go to the "full view" on another screen to listen to the entire song if the user has purchased it. If the user clicks on preview, then quickly clicks on the full song button, then they'll get an error because the preview is still buffering while the full song on the next screen is already loading the next song. I need to stop the buffering/loading and load the next song. Ideally, I'd like to load only what the user clicks on, so I'd rather not use a playlist as the solution.

Thanks for looking into this!

[CooolWolf]

I had this problem too

[CooolWolf]

I think the js implementation should be modified

`

<script> button.addEventListener('click', onButtonClick); function onButtonClick() { // This will allow us to play video later... video.load(); fetchVideoAndPlay(); } function fetchVideoAndPlay() { fetch('https://example.com/file.mp4') .then(response => response.blob()) .then(blob => { video.srcObject = blob; return video.play(); }) .then(_ => { // Video playback started ;) }) .catch(e => { // Video playback failed ;( }) } </script>`

[linchen2chris]

same here

[max-anders]

same, in fact, the behavior of the play() future is strange to me, I remember I had another problem with the fact that it didn't complete, because it seems to me that a solution to this problem would be to simply wait for the future, no?