Playlist won't work on mobile

kelsen commented 8 months ago

Hi, I've setup the code below and I noticed that it works only on desktop, I mean the second video won't play on mobile, only desktop.

<video id="my-video" class="video-js vjs-9-16" width="auto" height="934px" data-setup='{ "controls": true, "autoplay": true, "loop": true, "preload": "auto", "techOrder": ["youtube"], "sources": [{ "type": "video/youtube", "src": "<?= 'https://www.youtube.com/embed/' . MyHelpers::extractYouTubeId($video->conteudo) ?>"}], "youtube": { "playlist": "<?= MyHelpers::extractYouTubeId($video->conteudo) ?>,2jThTOt0IYY"}}'>
          <p class="vjs-no-js">
            To view this video please enable JavaScript, and consider upgrading to a
            web browser that
            <a href="https://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
          </p>
</video>

IOS 17.1.2 Chrome 120.0.6099.119

kelsen commented 8 months ago

Screenshot_2 I've noticed that the playlist icon does appear for a fraction of seconds.

mkoehlersg commented 7 months ago

+1

tik9 commented 5 months ago

Can you show what the result of <?= 'https://www.youtube.com/embed/' . MyHelpers::extractYouTubeId($video->conteudo) ?> is? Should the embedded video loaded first in the playlist and then "playlist": " <?= MyHelpers::extractYouTubeId($video->conteudo) ?>,2jThTOt0IYY"?

kelsen commented 5 months ago

This is the HTML result:

<video id="my-video" class="video-js vjs-9-16" width="auto" height="934px" data-setup='{ "controls": true, "autoplay": true, "muted": true, "loop": true, "preload": "auto", "responsive": true, "techOrder": ["youtube"], "sources": [{ "type": "video/youtube", "src": "https://www.youtube.com/embed/iW4YkWdsa6g"}], "youtube": { "playlist": "iW4YkWdsa6g,2jThTOt0IYY"}}'>

I can confirm it's working on Xiaomi Redmi Note 12 Pro 5G Android 14 Google Chrome 123.0.6312.80 but won't work with Google Chrome 123.0.6312.52 on Iphone 13 IOS 17.3.1

videojs / videojs-youtube

Playlist won't work on mobile #617