MLS-3707-3776

Per MLS legal guidelines on 6/28, all <iframe> and <embed> tags that are rendered in an article body as a result of an oEmbed must be categorized as all 4 optional cookie categories, not just functional.

This ticket is to further update oEmbed functionality to ensure cookie consent is respected on the front end.

Work Required

For when oEmbed renders iFrames on the front end:

  • In the opening <iframe> tag, replace "src=" in the <iframe> opening tag with "data-src="and add ‘class="optanon-category-C0002-C0003-C0004-C0005"’ right after the data-src url
  • Example of proper implementation:
    • <iframe data-src="https://www.youtube.com/embed/SUctAsOSnes?feature=oembed" class="optanon-category-C0002-C0003-C0004-C0005" allowfullscreen="" title="2024 Lamar Hunt U.S. Open Cup Rnd of 16: Sacramento Republic FC vs. SJ Earthquakes - 05/21/2024">

Work Required

When oEmbed renders <script> code on the front end:

  • In the opening <script> tag, add ‘type="text/plain"’ and ‘class=”optanon-category-C0002-C0003-C0004-C0005"’ right before the “src=” parameter
  • Example of proper implementation:
    • <script type="text/plain" class="optanon-category-C0002-C0003-C0004-C0005" src="https://platform.twitter.com/widgets.js" charset="utf-8">

oEmbed Facebook post

oEmbed Tiktok Post

@mls

LEO MESSI WINS IT FOR MIAMI. DEBUT GAME. DEBUT GOAL. 🐐 #mls #soccer #messi #miami #golazo

♬ original sound - Major League Soccer

InCrowd Embed test

Libsyn Audio Embed

VIDEO goes here

Video Above ^^^

Acceptance Criteria

  • Find an article with an <iframe> embedded in it via oEmbed (Youtube is one example)
    • Load page
    • Ensure that the <iframe> tag is rendered in HTML with "data-src=" and "class=" parameters set as defined above ON LOAD.
      • PLEASE NOTE: This functionality is related to the cookie banner, so when testing this output, you will see the following:
        • When the user has Accepted All cookies, the <iFrame> tag will be re-written by OneTrust to show "src=" instead of "data-src=", which will allow the iFrame to show. This is expected behavior.
        • When the user has Rejected All non-essential cookies, the <iFrame> tag will continue to render as "data-src=" in the page HTML, which will cause the iFrame to NOT show. This is expected behavior.
    • Repeat for all other oEmbeds that use <iframe> tags.
  • Find an article with a <script> embedded in it via oEmbed (Twitter/X is one example)
    • Load page
    • Ensure that the <script> tag is rendered in HTML with ‘type="text/plain"’ and ‘class=”optanon-category-C0002-C0003-C0004-C0005"' parameters set as defined above.
      • PLEASE NOTE: This functionality is related to the cookie banner, so when testing this output, you will see the following:
        • When the user has Accepted All cookies, the <script> tag will be re-written by OneTrust to replace 'type="text/plain"' with 'type="text/javascript"', which will allow the script to show. This is expected behavior.
        • When the user has Rejected All non-essential cookies, the <script> tag will continue to render as 'type="text/javascript"' in the page HTML, which will cause the script to NOT show. This is expected behavior.
    • Repeat for all other oEmbeds that use <script> tags