Cannot set property 'hasRun' of undefined

[alexmiddeleer]

Hi there,

First, thanks for making this addon! I'm just getting started with it, and I'm seeing the following error after I initialize the app:

ember.debug.js:19155 TypeError: Cannot set property 'hasRun' of undefined
    at fb.js:37

My application/route.js file has the same code as in the README for calling FBInit().

It looks like on line 26 of the service, Ember.run(null, resolve); obliterates window.fbAsyncInit somehow. Any ideas on what might have gone wrong? I'm using ember 2.8

[bugant]

@alexmiddeleer that's really strange. The code is the following:

  if (original) {
    window.fbAsyncInit = original;
    window.fbAsyncInit();
    window.fbAsyncInit.hasRun = true;
  }

so I don't know how it could be that fbAsyncInit is undefined since we are setting it to original which is not undefined.

@alexmiddeleer can you please add a breakpoint in that code and see what's happening?

[alexmiddeleer]

@bugant I traced through it, and at line 26, Ember.run(null, resolve); executes and then window.fbAsyncInit is undefined.

    this.fbInitPromise = new Ember.RSVP.Promise(function(resolve){
      window.fbAsyncInit = function() {
        window.FB.init(initSettings);
        Ember.run(null, resolve);            // this is where window.fbAsyncInit becomes undefined
      };
      Ember.$.getScript('//connect.facebook.net/en_US/sdk.js', function() {
        // Do nothing here, wait for window.fbAsyncInit to be called.
      });
    }).then(function() {
      if (original) {
        window.fbAsyncInit = original;
        window.fbAsyncInit();
        window.fbAsyncInit.hasRun = true;
      }
    });

[bugant]

@alexmiddeleer OK, but can you confirm that the code that is generating the error is the one inside the if I mentioned above? Try to set a breakpoint inside the then clause, please. I'm just trying to figure out what's happening... sorry for the vagus response.

[alexmiddeleer]

Ah, I think I figured out what's going on. There's a namespace conflict with the torii (https://github.com/Vestorly/torii) facebook-connect provider, which happens to also set its own window.fbAsyncInit. When we get to line 34, it calls that facebook-connect provider instead of this one.

[alexmiddeleer]

I'm trying to find the actual repo for the facebook-connect provider itself and failing, but the code seems to be lifted from this project https://developers.facebook.com/docs/facebook-login/web

[alexmiddeleer]

Nevermind, I found it. https://github.com/Vestorly/torii/blob/master/addon/providers/facebook-connect.js#L29

So it looks like if we have torii set up we probably should not use ember-cli-facebook-js-sdk, since it already initializes FB.ui (although perhaps less elegantly from an ember standpoint).

[bugant]

@alexmiddeleer in that case you can configure ember-cli-facebook-js-sdk to skip initialization and you can enjoy the promise-style API anyway :) See https://github.com/pitchtarget/ember-cli-facebook-js-sdk#skipping-facebook-sdk-init.

Let me know if you need any more help.

[alexmiddeleer]

@bugant Thanks, I didn't even realize we were using torii until this issue came up 😅 . If you want I can start a troubleshooting section to your readme.