Audio file timestamp doesn't stop counting at the end of playback

[luixxiul]

Steps to reproduce

1. Create an encrypted new room
2. Upload you favorite 4-5 minute song
3. Listen to the song
4. After the song finished, check the player

Outcome

What did you expect?

Either (a) the audio file should be replayed or (b) the counter should stop at the end of the audio file. I am not sure which one is expected.

What happened instead?

The counter was reset and started from zero, without replaying the audio file.

Also, unless the page is reloaded, the audio file cannot be replayed on the player.

Operating system

Debian

Browser information

Firefox

URL for webapp

localhost

Application version

develop

Homeserver

No response

Will you send logs?

No

[dbkr]

I suspect the correct behaviour is for the playhead & time to reset to zero and stay there once playback has reached the end (instead of going back to zero and then counting up again which is what it sounds like it happening). Perhaps this could be a good issue for a relatively new person to help with. src/components/views/messages/MAudioBody.tsx / src/components/views/audio_messages/AudioPlayerBase.tsx in react-sdk are probably the files to start with.

[luixxiul]

I suspect the correct behaviour is for the playhead & time to reset to zero and stay there once playback has reached the end.

Also, the file should be able to be replayed, of course :wink:

[htmlHxcker]

I noticed something else while drafting a PR for this issue. If you let the player keep counting after the song's finished, switch to another room and switch back it works as normal i.e Stoppping at zero and when the play button is clicked, it plays normally so this may be something to look out for.

[htmlHxcker]

I'd also like for this issue to be assigned to me but given the information at https://github.com/vector-im/element-meta/wiki/Guidance-on-assigning-issues I'll hold that off until I submit my draft PR. Thought I'd mention this here in case anyone else wants to work on this issue.

[luixxiul]

The issue here is that the counter does not only stop at the end of playback, but also the audio cannot be replayed unless the page is manually reloaded.

[htmlHxcker]

After digging around for a while, it seems this is a bit above me and I will not be able to continue working on this, anyone who wants to work on it can pick it up.

[chandra1899]

can anyone please explain the problem clearly, i'm unable to get the issue.

[Sanket-777]

I am unable to find this files in the source code src/components/views/messages/MAudioBody.tsx ? Would you guide a little more about it ?

[yoda-76]

I want to work on it. Please assign me this issue.

[weeman1337]

Thank you for your interest in this issue @yoda-76 . We will normally not assign the issue to an external contributor until they have provided at least a draft PR which is taking the right direction. For further details, see our guidance on assigning issues.

If you have any technical questions about this issue, you can ask for help in #element-dev:matrix.org .

[ABHIXIT2]

I am working on this issue and what i've noticed that the counter goes to zero but you want it to stay at the end right?! And also I didn't find any problrm in playing it again.....Could anyone please confirm. @dbkr @luixxiul

[luixxiul]

@chandra1899 I edited the explanation for you so that you can understand the issue.

[luixxiul]

@ABHIXIT2 Do you mean that the issue is no longer reproduced?

I confirmed the issue still could be reproduced on my side.

[ABHIXIT2]

I think it has something to do with the app because it wasn't happening but after installing app and playing audio there it started happening. I will try to solve the problem and if there anything i need to know just lemme know... @luixxiul

Edit : This is happening for above 5 min clips

[farhan-momin]

I am unable to find this file in the source code src/components/views/messages/MAudioBody.tsx Where can i find it?

[t3chguy]

@farhan-momin https://github.com/matrix-org/matrix-react-sdk/blob/develop/src/components/views/messages/MAudioBody.tsx

[farhan-momin]

@t3chguy I looked at https://github.com/matrix-org/matrix-react-sdk/blob/develop/src/components/views/messages/MAudioBody.tsx. Can a reset Function be added to this react component? I think this is a bit too complicated for my current level.

[vishalsingh2972]

would like to work on this, but new so would love to collaborate and work together on this issue if anyone is interested!

[Axxi3]

is the issue still open or is anyone working in it?

[rashmitpankhania]

is the issue still open

yes i can still reproduce the same

[rashmitpankhania]

Hi @t3chguy @luixxiul I found the issue it related to "ended" event after the audio (size greater than 5mb as mentioned in desc) gets completed the ended event callback doesnt get fired even though the attribute ended says true I think the issue might be related to HTML5 cause I have tested on firefox, chrome & brave..its there

so a dirty work around would be comparing the currentTime and duration and firing the ended callback any thoughts?

[nallapaneni-sreehari]

Is this issue still there, because I cannot reproduce this, I tried to reproduce in the Chrome, Brave, Firefox but I wasn't able to do so. Can anybody confirm ? Attaching the POC video for reference.

https://github.com/element-hq/element-web/assets/45209359/aee999f9-e9fe-4737-bad7-492860c70bfe

[rashmitpankhania]

i am still able to reproduce @nallapaneni-sreehari

https://github.com/element-hq/element-web/assets/24410731/378c1935-6a97-4ee0-8f2c-9edb1c80a586