Video Shortcode with Youtube source broken in some browsers

[brokenflipside]

The video player layout is broken when using the video shortcode with youtube as the source. I have tested this on a default twenty fourteen theme with no plugins installed.

You can see a full break down here: ​http://wp.me/p4VyKf-C

[ocean90]

Hello brokenflipside , thanks for the report.

There are two related tickets, #28190 and #29110. Both are fixed in 4.0 so I tried your video with current beta and I can't reproduce the issue as visible on your site anymore. Can you confirm this?

[brokenflipside]

Still a bit buggy, but better.

​http://marcgratch.com/youtube-video-shortcode-css/#bleedingNightlies I have provided updated screenshots when running 4.0.

[Jayjdk]

I can reproduce this in Safari and Firefox on Mac (haven't tried Windows). It works in Chrome. Tested on latest trunk (revision 29351).

And it's not just in TwentyFourteen. Every theme I've tried has the same problem.

Screenshots:

• Normal: ​http://imgur.com/IoiLxlt.png
• On play: ​http://imgur.com/KuqbYFy.png

The console in Firefox gives these errors:

• Specified "type" attribute of "video/youtube" is not supported. Load of media resource https://www.youtube.com/watch?v=[...] failed.
• All candidate resources failed to load. Media load paused.

The console in Safari gives this error:

• Blocked a frame with origin "https://www.youtube.com" from accessing a frame with origin "http://theme.dev". The frame requesting access has a protocol of "about", the frame being accessed has a protocol of "http". Protocols must match.

[wonderboymusic]

This should be looked at

[morganestes]

I tested today on trunk revision 4.1-alpha-30000-src running Twenty Fourteen in Firefox 33, Safari 8, and Opera 25 on Mac, iOS 8 on iPhone 6 (emulator), and emulated iPhone 4, and emulated Nexus 5 (both emulated in Opera) and couldn't reproduce on any of them. Everything renders as expected and no errors are sent to the console.

I tried with the Youtube video (​https://www.youtube.com/watch?feature=player_embedded&v=K7VmOZ4Ppj8) wrapped inside the video shortcode and by itself with oEmbed and couldn't reproduce.

@brokenflipside, can you test again to see if you're still experiencing this issue and maybe I just missed something?

[janhenckens]

I was able to reproduce this too a couple of weeks ago, will have another look!

[wonderboymusic]

This appears to be fine since [30082]

[Jayjdk]

It's still not working for me. Same errors in Firefox as I got before but a new one in Safari:

I've tried both a local and live installation running the latest trunk. Here's a link ​http://jayj.dk/videobug/

The example on MediaElement's site gives the same errors but works with some display issues (​http://mediaelementjs.com/examples/?name=youtube):
​http://i.imgur.com/2QxBtNo.png

[wonderboymusic]

These work for me... if there is a brower security setting issue, that needs to be addressed upstream:
​https://github.com/johndyer/mediaelement