Embeds unload when scrolling outside of viewport

[98mux]

Describe the bug
Everyone of my embeds unloads when the user scrolls outside of the viewport. Not sure why. My embeds are positioned using absolute positioning, maybe that could effect something

Expected behavior
The embed not unloading when scrolling out of view (so that music and videos keep on playing)

Desktop (please complete the following information):

• OS: linux
• Browser chrome

Btw, awesome library!

[spences10]

Hey @98mux this is the expected behavior for all components except Tweet and Toot

All components are wrapped in a <GeneralObserver> component meaning they unload once scrolled out of the viewport. It says that on the second line of the readme.

I'll convert this to a discussion, to see if this can be added as an additional prop to ignoreObserver or something to that effect.

Thanks

[98mux]

It seems to unload on your website https://scottspence.com/ and is creating a really wanky user experience as the document height keep changing as the user scrolls through it. (On mobile for the last two embeds) I really like that it loads when the user scroll to it, but why unload it when the user scrolls past it?

[spences10]

It is interesting tho cuz on the demo site im able to play music, scroll away, and still have the music playing while it is not in the viewport

Yeah, yikes! Just went though and played all the embeds on there! 😂

but why unload it when the user scrolls past it?

Something I didn't consider...

Open to suggestions if you have any.

Also, if you take a look at the component you want to use, it's an iframe embed so, jack the code from there and you don't need to use the package.

[spences10]

@98mux I've just pushed this: #474

You can pass a prop to the general observer to disable it

[98mux]

@spences10 Awesome!!! :D Thank you

[spences10]

I hope the user experience is less 'wanky' 😅