firebase-auth element fires 'login' event twice on successful login

[polycentric]

Using provider: google with default popup auth and listening for login event: The handleLogin function gets called twice. Using DevTools to step through code after calling the login method on the firebase-auth method reveals that in firebase-auth.html _authHandler is called "directly" after completing auth in the popup window, then _loginHandler is fired from somewhere else and _loginHandler calls _authHandler again, thereby resulting in the 'login' event being fired twice.

Am I doing something wrong? Is this intended behaviour?

Thanks, Joe.

[honzalo]

+1 Having the same issue

Created #67 for this issue. _authHandler is called by onAuth, there is no need to call by _loginHandler

[MeTaNoV]

+1

[mm-gmbd]

Has this issue been fixed? I'm having a hard time working around it.

Starting from the example code for firebase-auth, I've got a login page that, when auth is successful, it will redirect to another page. My slightly modified computeLoginStatus that is bound to both statusKnown and user.

computeLoginStatus: function(statusKnown, user) {
  console.log("statusKnown: "+statusKnown);
  console.log("user: "+user)
  if (statusKnown && user) {
    if (this.redirectOnAuth && this.onAuthRedirectLocation !== '') {
      alert('Logged in. Going to page: '+this.onAuthRedirectLocation);
      window.location.href=this.onAuthRedirectLocation;
    }
  }

  if (statusKnown) {
    if (this.redirectOnUnauth && this.onUnauthRedirectLocation !== '') {
      alert('Logged out. Going to page: '+this.onUnauthRedirectLocation);
      //window.location.href=this.onUnauthRedirectLocation;
    }
  }
}

When I am redirected to my second page after successful auth, I have a hidden element that contains this same function to watch for unauth. On unauth, it is supposed to redirect back to the home page.

But, the problem is that when this function is called twice, and the first time statusKnown is true, but user is null, so it automatically redirects back to the login page. And from there it just continually pings and pongs back between the login page and next page.

After commenting out the redirect, I saw the following output:

statusKnown: true user: null statusKnown: true user: [object Object]

I presume this is because of the issue listed herein? How are others working around this now? I know I can't be the only one with an "unauth" watcher for redirection.

EDIT:

I was thinking maybe it was because I was binding two different properties of firebase-auth (statusKnown and user) to the function computeLoginStatus, and statusKnown was getting set first and then user, but even if I just pass user to computeLoginStatus, it is still called twice. Still stuck :/

[MeTaNoV]

I think it has been fixed today with a similar issue.

[MeTaNoV]

https://github.com/GoogleWebComponents/firebase-element/pull/67

[mm-gmbd]

Is this automatically updated on the Google Web Components page? I.e. can I run:

bower install --save GoogleWebComponents/firebase-element#^1.0.0

Or should I run:

bower install --save GoogleWebComponents/firebase-element#1.0.10

Or just clone it from here?

[MeTaNoV]

you should clone master or bower install --save GoogleWebComponents/firebase-element#master

[mm-gmbd]

I've installed the latest and I see the same issue as described above:

user: null user: [object Object]

[honzalo]

I've installed the latest and the issue has been solved for me. You could use the on-login and on-logout events fired by the authHandler to perform the redirection, which would only be triggered right after the user is logged in/out and the user object being updated.

[ebidel]

It should be fixed in the latest release. Marking as fixed.

[mm-gmbd]

@honzalo, thanks for the tip about the on-login and on-logout. I'll switch to those directly.

[vkniazeu]

I'm still getting this unexpected behavior of authentication flow running twice. Using firebase3, angularfire2, and angular2 with: firebaseAuthConfig({ method: AuthMethods.Redirect, provider: AuthProviders.Google }) Once redirected back from the authentication page the host page gets refreshed the second time unexpectedly. If you are already authenticated, however, and do not go through the log in flow, everything works fine. Potential regression maybe? @ebidel, have you heard anything on this since last August?

[patrickrodee]

@vkniazeu getting the same behavior in Angular2

[vkniazeu]

Thanks @patrickrodee. Here's the full issue https://github.com/angular/angularfire2/issues/324.