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
836 stars 63 forks source link

enablejsapi param not working #70

Closed martinsilha closed 1 year ago

martinsilha commented 2 years ago

I just switched to lite-youtube from the original YouTube embed once I got all my params working with the original.

I noticed that after the switch Google Analytics stopped reporting on any video events at all. All of the other params I've changed have worked like: cc_lang_pref, color, hl, playsinline, rel.

Any ideas what could be going on here? I absolutely love this package and want to use it but getting the events is critical in my case.

justinribeiro commented 1 year ago

Testing with the JSAPI example, I'm not seeing any issue getting events https://github.com/justinribeiro/lite-youtube/blob/main/demo/jsapi.html

Based on your description, I suspect that if you're coming from previous code, the reference to be able to see this events is slightly different in the above example due to the nature of the way lite-youtube works. You can take a look at the example to see how to use the JSAPI with lite-youtube in the above, but basically, it comes down to listening to the custom event and grabbing a reference:

      document.addEventListener('liteYoutubeIframeLoaded', () => {
        player = new YT.Player(document.querySelector('#test-jsapi').shadowRoot.querySelector('iframe'), {
            events: {
              'onReady': onPlayerReady,
              'onStateChange': onPlayerStateChange
            }
        });
      }, false);
martinsilha commented 1 year ago

I have since switched back to the original YouTube embed, but I'm sure it is just something that is my fault that I will figure out in due time. Thank you for your time, I'm sorry to have wasted it!