When using the core Media module and a remote video media type, an embedded video (such as YouTube) appears normally when viewing the page. But if you turn on Safari or Firefox's 'reader' mode, the video does not appear.
Here is the iframe embed code using Drupal Core Media/oembed. Note the /media/ombed?url= before the src URL:
<iframe src="/media/oembed?url=https%3A//www.youtube.com/watch%3Fv%3DkV-T0eotrfk&max_width=0&max_height=0&hash=U2BjybR7UaFoufcWsFloYoK5AuRHnm9xXQCY_ptCEvI" frameborder="0" allowtransparency="" width="200" height="113" class="media-oembed-content" title="Finding the Date in a Montréal Artwork's Sunrise"></iframe>
And here is a standard YouTube iframe embed code:
<iframe width="560" height="315" src="https://www.youtube.com/embed/kV-T0eotrfk" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
An example from my blog: https://www.plateauastro.com/blog/2022-10-21/sunrise-tells-us-when
1) Enable 'Media' module.
2) Ensure a 'remote video' media type is created.
3) On 'remote video' media media Manage Display, ensure Video URL format is 'oEmbed content'.
4) Add a new field, 'Reference' > 'Media' on a content type or paragraph. Select 'remote video'.
5) On new field's Manage Display, select 'Rendered Entity'.
6) Create new content using field, add YouTube URL.
7) View content, make sure YouTube video embeds correctly.
8) Turn on browser 'reader' mode and see that embedded video doesn't appear.
Is this being caused by the prepended /media/ombed?url= in the iframe src parameter?
| Comment | File | Size | Author |
|---|---|---|---|
| #7 | nnn-reader-youtube-embed.png | 1.55 MB | trevorkjorlien |
| #7 | firefox-reader-youtube-embed.png | 623.94 KB | trevorkjorlien |
| #7 | safari-reader-youtube-embed.png | 3.23 MB | trevorkjorlien |
| safari-reader-mode-oembed-fails.png | 784.11 KB | trevorkjorlien | |
| safari-normal-oembed-works.png | 2.52 MB | trevorkjorlien |
Comments
Comment #2
trevorkjorlien commentedThis related issue tries to solve it with a patch that gives an option to use the absolute URL of the video.
Comment #3
cilefen commentedI surrounded the code blocks with the proper
<code>tag.Comment #4
cilefen commentedI do not think #3311469: Absolute path for oembed iframe is in fact related as it is about replacing only `/media/oembed` with `https://hostname.of.the.site/media/oembed`.
And, providing that full URL does not make these videos visible in Reader. That's easy to verify with browser dev tools.
Comment #5
trevorkjorlien commentedThank you for formatting the code blocks, @cilefen.
And you could be right that the issue I linked to just prepends the hostname to /media/oembed. Thank you for looking into that.
Could there be another reason that the Reader doesn't display it? I've also noticed that my RSS Reader (NetNewsWire) also doesn't display the embedded videos.
Comment #6
cilefen commentedAssuredly there is a reason. But at least for Firefox (emphasis, mine):
https://support.mozilla.org/en-US/kb/firefox-reader-view-clutter-free-we...
That seems like it works as designed.
Comment #7
trevorkjorlien commentedGood find. I did some tests with this URL which has several "normal" YouTube embeds: https://kottke.org/23/01/how-roman-roads-were-made
Safari Reader Mode: embedded videos appear
NetNewsWire: embedded videos appear
Firefox Reader Mode: embedded do not videos appear
This obviously isn't the place to disagree on Firefox's choice to not show video as content. But at least for Safari, Drupal's oEmbed implementation seems to fall down for some reason.
Comment #8
larowlanYeah I think this is works as designed and definitely should be a feature request, reframed as such but kept the language neutral because this may not be possible
Comment #9
cilefen commentedMoved to the feature branch.
Comment #10
trevorkjorlien commentedFair enough to put it as a feature request.
I have recommended to some vision-reduced friends to use RSS readers for accessibility reasons as it makes for a much easier reading. Not sure if that crosses the bar for this to also be an accessibility issue but thought I'd mention that.
Thanks!
Comment #11
cilefen commentedDrupal doesn't have control over browser "reader" implementations so I don't know to what extent the Drupal accessibility team can even certify something like this as complying or not complying.
If at such time there is a proposed fix that someone feels needs accessibility review, we can request that.