Jetpack strips out the title attribute on iframes

  • Resolved abrightclearweb

    (@abrightclearweb)


    1 month, 3 weeks ago

    I have a few posts on my site with YouTube embeds. The YouTube block should include the title attribute, but when I have Jetpack active and connected the title attribute is stripped out.

    e.g.

    <figure class="wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper"><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="640" height="360" src="https://www.youtube.com/embed/Y9ufbb4mugo?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-GB&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></div></figure>

    when it should be 

    <figure class="wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
    <iframe loading="lazy" title="Smartphone-activated Pedestrian Crossing Test by Andrew and Chris" width="500" height="281" src="about:blank" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen data-rocket-lazyload="fitvidscompatible" data-lazy-src="https://www.youtube.com/embed/qdrYIjFCfrM?feature=oembed"></iframe><noscript><iframe loading="lazy" title="Smartphone-activated Pedestrian Crossing Test by Andrew and Chris" width="500" height="281" src="https://www.youtube.com/embed/qdrYIjFCfrM?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe></noscript>
    </div></figure>

    I only see the title text when Jetpack is deactivated or disconnected.

    This fails the accessibility guideline Frames must have an accessible name.

    It’s related to this GitHub issue: https://github.com/Automattic/jetpack/issues/7370. I tried adding the code snippet suggested by kospl but it didn’t work.

    Can you suggest a fix other than deactivating Jetpack or including YouTube embeds as HTML?

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Contributor Stef (a11n)

    (@erania-pinnera)

    1 month, 2 weeks ago

    Hi there @abrightclearweb! 👋 hope you’re doing well there 🙂

    We don’t have any updates to share besides the GitHub issue you linked, I’m afraid.

    You can avoid the problem you reported by deactivating the shortcodes module; you don’t need to deactivate Jetpack altogether.

    Can you give it a try and let me know if that works? Thanks a lot!

    Thread Starter abrightclearweb

    (@abrightclearweb)

    1 month, 1 week ago

    Yes, I worked out that I could deactivate the module. That makes the titles work as expected.

    I hope you have a fix for the issue soon!

    Plugin Support Ajay Kumar Jain (a11n)

    (@akumarjain)

    1 month ago

    Hi @abrightclearweb, Glad to hear your issue is sorted out now! As jeherve mentioned in the GH issue, we aren’t currently working on our legacy shortcode embeds, so we don’t have any ETA for the fix.

    I’ll mark this thread as resolved. Please open a new one if you need help with anything else.

Viewing 3 replies - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.