getting "Uncaught TypeError: Cannot call method 'replace' of undefined" when doing FB.init using Facebooker2

Question

I am using Facebooker2 to create a Facebook IFrame application, which is running as a tab inside a Facebook page.

My goal is to be able to use the social plugins, such as a like button and comments, etc. I tried to define them as follows

<div class="fb-like" data-href="http://www.myurl.com" data-send="false" data-layout="button_count" data-width="450" data-show-faces="false"></div>

and trying to initialize the FB JS SDK by calling

<%= fb_connect_async_js %>

which outputs

<div id="fb-root"><script async="" src="http://connect.facebook.net/en_US/all.js"></script></div>
      <script>
        window.fbAsyncInit = function() {
          FB.init({
            appId  : 'APP_ID',
            status : true, // check login status
            cookie : true, // enable cookies to allow the server to access the session
            oauth : true,
            xfbml  : true  // parse XFBML
          });

        };

        (function() {
          var e = document.createElement('script'); e.async = true;
          e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
          document.getElementById('fb-root').appendChild(e);
        }());
      </script>

This has worked before, and stopped working after Facebook pushed their last platform update about a month ago. Now the Like button is not being rendered at all. I also tried the XFBML approach, no luck.

note: I am able to publish feeds using FB.publish, and I am also able to create a like button using the IFrame method.

I looked at the documentation and didn't see anywhere where it was mentioned that Social plugins cannot be used inside IFrame apps.

any ideas anyone?

Answer 1

I've encountered the same issue, and the only workaround i could find is to set a timer to execute FB.XFBML.parse();

If anyone has a better solution, I'd be thanksfull to hear it !

window.fbAsyncInit = function() {    
setTimeout(function(){
    FB.XFBML.parse();
    FB.Event.subscribe('auth.login', function(response) {
        fbLogin();
    });

    FB.Event.subscribe('auth.logout', function(response) {
        fbLogout();
    });
    /* Additional initialization code here */
},
1000);
var params = {
    appId      : facebookAppId, 
    channelUrl : siteurl+'facebookChannelFile.php',
    status     : true, 
    cookie     : true, 
    oauth      : true,
    xfbml      : true
};
FB.init(params);
};