I seem to have a problem with Facebook or Google authentication when my login link is visited from within the iOS Facebook browser. I’ve confirmed that other popup links and redirects in general can work within the browser, but it for some reason it blocks Firebase auth popup. (We haven’t had problems with any other browsers blocking the popup.)
Here is the code for my Polymer element 'twt-auth-panel’ that provides the content of an iframe that I open when the user clicks the Sign In link.
<polymer-element name="twt-auth-panel" attributes="user" layout vertical center>
<template>
...
<firebase-login id="firebaseLogin" statusKnown="true" redirect="false"
location="{{baseUrl}}" provider="{{authProvider}}"
on-login="{{onLogin}}" on-error="{{onError}}" params='{"scope": "email,user_location"}'></firebase-login>
...
<paper-button id="fbLoginButton" class="signin-button" on-click="{{ loginFacebook }}"><core-icon icon="social-post:facebook"></core-icon>Sign in with Facebook</paper-button>
<paper-button id="googLoginButton" class="signin-button" on-click="{{ loginGoogle }}"><core-icon icon="social-post:gplus"></core-icon>Sign in with Google</paper-button>
...
</template>
<script>
Polymer('twt-auth-panel', {
...
loginFacebook: function (event, detail, sender) {
this.user = null;
this.authProvider = 'facebook';
this.$.firebaseLogin.login({scope: "email,user_location"});
},
loginGoogle: function (event, detail, sender) {
this.user = null;
this.authProvider = 'google';
this.$.firebaseLogin.login({scope: "email"
+ ",https://www.googleapis.com/auth/plus.me"
+ ",https://www.googleapis.com/auth/plus.profiles.read"});
},
...
});
</script>
</polymer-element>
As you can see, within this element I have a couple of paper-buttons with on-click handlers that invoke the login() method of the firebase-login element. In all other browsers we've tested, these buttons work to open the Firebase authentication popups, but in the Facebook mobile app, the button actions are ignored.
From my reading of the code, this is probably a result of the way the popup/redirect is implemented in the firebase/firebase.js script -- perhaps too many levels of indirection before the popup window finally gets opened. I've submitted a support request to Firebase and am waiting to hear back from them. In the meantime I thought I'd check if anyone else might have encountered this issue within the Facebook browser.