search

leoasis / react-sound

Sound component to play audio in your web apps
ISC License
486 stars 80 forks source link

Re-render causes audio to jump to static 'playFromPosition' prop. #62

Closed dallinja closed 5 years ago

dallinja commented 6 years ago

I upgraded from react-sound@0.6.2 to react-sound@1.2.0 (I'm also on react@16.3.2), and now I'm experiencing this issue. I've got a simplified Sound component in MyComponent's render() like this...

<Sound url={audio.url} playStatus={Sound.status.PLAYING} playFromPosition={0} />

But every time it re-renders due to MyComponent receiving new props, the audio jumps to whatever value playFromPosition has. My understanding is this is only suppose to happen when playFromPosition changes, and as you can see, the value is static (just to test this). I've also made sure that MyComponent is not unmounting and remounting, as well as making sure the audio file is not reloading/remounting/changing.

For an immediate workaround I'll probably move to a controlled component using the position prop, but I would love to just use playFromPosition instead.

I'd be shocked if this was an issue for everyone due to a recent release, so perhaps I'm missing something obvious?

jbierfeldt commented 6 years ago

Dallinja, I am having this same issue. I am also moving to a controlled component using position for now, as well.

react-sound@1.2.0 react@16.3.2

leoasis commented 6 years ago

Sorry for the late response. This seems a bit weird, are you sure you're on the last version? There was a similar issue in a previous version and it was fixed: https://github.com/leoasis/react-sound/issues/56

If you're sure it is an issue, can you provide a simple repo, or modify the example in this repo to show the issue?

Thank you very much, and again sorry for the long time to answer

Pushplaybang commented 5 years ago

I can confirm this is happening with react sound 1.2.0 with react 16.4.2

dhmk083 commented 5 years ago

There is a bug at this line.

It should be this.updateSound(this.sound, prevProps);

Otherwise this comparison is always true which causes audio to jump.

leoasis commented 5 years ago

Good catch @dhmk083! Mind sending a PR with the fix?

dhmk083 commented 5 years ago

finally did it