justinribeiro / lite-youtube

The fastest little YouTube web component on this side of the internet. The shadow dom web component version of Paul's lite-youtube-embed.
https://www.npmjs.com/package/@justinribeiro/lite-youtube
MIT License
966 stars 70 forks source link

Mobile only: click does not auto-play youtube video #30

Closed wzzbzz closed 3 years ago

wzzbzz commented 3 years ago

Clicking play button causes Youtube video to load, but not play.

this occurs on cell phones, and in the Chrome emulators.

https://qat.btrtoday.com/read/featured/test-video-embed/

justinribeiro commented 3 years ago

This is an side effect of the autoplay policy on mobile which prevents the flag from automatically playing the video after the first tap. This component (or any component really) can't directly control this affect.

To reduce this, you can use the autoload attr which will trigger the intersection observer to inject+load, reducing the interaction to one tap.

Previously: #23

wzzbzz commented 3 years ago

Thanks for this help - solved them mobile click issue.

However, now the video auto-plays on Desktop as soon as it scrolls into view. This becomes an issue when there are multiple posts. (see reference link).

https://www.btrtoday.com/read/featured/our-week-in-music-thirst-trap-live-pop-star-drama-exclusive-live-music/

I'll solve this by being smarter about applying the autoload attr, but I'm wondering if there's anything better