CDATA tag being added after <script> tags about facebook-instant-articles-sdk-php HOT 8 CLOSED

@CalvinWong I am trying to reproduce this and looking into whether we can rely on DOMDocument::saveHTML for the output. Could you share the code that you are using to construct the Facebook\InstantArticles\Elements\SocialEmbed instance?

from facebook-instant-articles-sdk-php.

To give you some insight, we are using WordPress and the plugin 'Instant Articles for WP'. I first tracked the issue there (https://wordpress.org/support/topic/cdata-after-script-tags), before discovering it was within the Facebook Instant Articles SDK. In our WordPress instance, we have a shortcode that generates a Facebook embed. The generated embed is looks something like this:

<iframe><script>window.fbAsyncInit = function() {
  FB.init({ xfbml: true, version: 'v2.4'});
  }; (function(d, s, id){
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) {return;}
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/sdk.js";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));
  document.write(decodeURI('%3C') + 'div class="fb-post" data-href="https://www.facebook.com/NewDanceStudios/videos/10154149796675625/" data-width="500"' + decodeURI('%3E')
    + decodeURI('%3C') + '/div' + decodeURI('%3E'));</script></iframe>

When the filters get applied, the iframe is wrapped within the social embed figure. But in the final step, the saveXML generates a CDATA wrapper around the script tags.

from facebook-instant-articles-sdk-php.

@CalvinWong It does seem that CDATA is injected in a scenario as yours with the current behavior. Unfortunately, simply swapping with DOMDocument::saveHTML would lead to other issues (essentially since the HTML format support in DOMDocument is not really compliant with HTML5).

We will find a way to work around this.

In the meantime, if you are able to modify the output from the shortcode to use an iframe embed (instead of a script), that should work fine. You can find the iframe embed code by simply clicking "Embed" on a Facebook video or post (iframe is the default embed format).

For the video in your example, the code would be:

<iframe src="https://www.facebook.com/plugins/video.php?href=https%3A%2F%2Fwww.facebook.com%2FNewDanceStudios%2Fvideos%2Fvb.238625180624%2F10154149796675625%2F%3Ftype%3D3&show_text=0&width=560" width="560" height="315" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" allowFullScreen="true"></iframe>

from facebook-instant-articles-sdk-php.

@simonengelhardt Did you get a chance to check this issue?
CC @scottrigby

from facebook-instant-articles-sdk-php.

We are using embed script for all the social media embed like Instagram, Twitter and facebook as we seen issues with Iframe to make it responsive on our site. So we are waiting to get this issue solved.

from facebook-instant-articles-sdk-php.

@CalvinWong @anbarasan1985 @scottrigby Sorry about the long wait on this, but a fix is now implemented in #126. We expect to merge this in and release a new version of the SDK early next week. Feel free to test the PR in the meantime.

from facebook-instant-articles-sdk-php.

Thanks @simonengelhardt

from facebook-instant-articles-sdk-php.

I left a comment on the PR after my testing.

from facebook-instant-articles-sdk-php.