Error on Facebook Login: provider.getAuthType is not a function

[mbifulco]

I'm getting an error when I try to login to my ParseReact app using facebook:

_linkWith   @   ParseUser.js:133
_linkWith   @   ParsePatches.js:78
success @   ParseUser.js:153
exports.default.init._ParseUser2.default._registerAuthenticationProvider.authenticate.FB.login.scope    @   FacebookUtils.js:81
window.FB.v.__wrapper   @   sdk.js:98
(anonymous function)    @   sdk.js:94
window.FB.ia._xdRecv    @   sdk.js:118
(anonymous function)    @   sdk.js:118
qa  @   sdk.js:93
(anonymous function)    @   sdk.js:91
window.FB.i.setWrapper.k    @   sdk.js:53
window.FB.i.setWrapper.k    @   sdk.js:53

This was working previously - I had logged my user out and back in to test something, and have been unable to log back in. From my limited digging through the call stack, it looks like the variable provider is being populated with the Window object.

I'm using the following versions:

    "react": "^0.13.0",
    "parse": "1.6.3",
    "parse-react": "0.5.0",

[andrewimm]

Can you describe how you're logging in with FB? I've posted some ways in the past, but because there is no standard method, it'd be helpful to know what the login code looks like.

[mbifulco]

I'll do my best with code snippets - for the most part, my code is adapted from the parse javascript SDK documentation and the AnyBudget demo.

App.js

global.jQuery = require('jquery');
var React = require('react');
var Parse = require('parse').Parse;

// Insert your app's keys here:
Parse.initialize('[myKeysHere]', '[myKeysHere]');

window.fbAsyncInit = function() {
  Parse.FacebookUtils.init({ // this line replaces FB.init({
    appId      : '[myAppIdHere]', // Facebook App ID
    cookie     : true,  // enable cookies to allow Parse to access the session
    xfbml      : true,  // initialize Facebook social plugins on the page
    version    : 'v2.3' // point to the latest Facebook Graph API version
  });

  // Run code after the Facebook SDK is loaded.

  React.render(
    <div>
      <LoginWrapper />
    </div>,
    document.getElementById('app')
  );

};

(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'));

var LoginWrapper = require('./LoginWrapper.react.js');

LoginWrapper.react.js has a login button with a submit function that looks like this:

  submit: function() {
    var self = this;
    Parse.FacebookUtils.logIn(null, {
      success: function(user) {

        var fbid = user.get('facebookId');
        if(!fbid)
        {
          user.set('facebookId',user.attributes.authData.facebook.id);
          user.save(null, function(){
            //callback on save function
          })
        }
        if (!user.existed()) {
          //console.log("User signed up and logged in through Facebook!");
        } else {
          //console.log("User logged in through Facebook!", user);
        }
      },
      error: function(user, error) {
        console.log("User cancelled the Facebook login or did not fully authorize.");
      }
    });
  },

If there's a better way to do this, I'd love to see it. It was certainly tricky to figure out with react in the first place - some of that has to do with my relative newness to React itself, I'm sure.

_Worth noting: this totally still works if I back down to these versions:_

    "react": "^0.13.0",
    "parse": "1.5.0",
    "parse-react": "0.4.3",

[golombFW]

I have this same problem. I wrote about it in this thread https://github.com/ParsePlatform/ParseReact/issues/108 If I can help with investigation, it's my code: LoginWrapper.react.js This code works on parse 1.5.0 and parse-react 0.4.3. Error appears on parse 1.6.3 and parse-react 0.5.0.