2

My meteor app login with facebook seems to work properly except that the login popup never closes. The popup window stays open until the app is reloaded. I don't even where to start to debug this... The popup is blank and the inspect reveals :

<p id="completedText" style="display:none;">
    Login completed. <a href="#" onclick="window.close()">
      Click here</a> to close this window.
  </p>

The style=display:none is probably why the popup appears blank but I don't know how to update that style. Also, if I perform a window.close() from the console, the popup disappears but the app doesn't register the login.

BTW, this bug only appears when I use my app from my domain name, when I call it from the IP address, it works just fine.

Mathieu K.
  • 903
  • 8
  • 27
  • 1
    Can you please tell me which packages you use? You can close it manually with JQuery like $('.elementClass').hide() but you should check if there are errors and hide it if there aren't any. – Luna Mar 11 '16 at 01:45
  • accounts-facebook, accounts-ui, service-configuration are the packages relevant to this issue I think. there is an error related to blocked frame : http://stackoverflow.com/questions/35891773/meteor-app-facebook-login-blocked-frame, but apparently it shouldn't prevent the window to close? – Mathieu K. Mar 11 '16 at 11:41
  • @Luna actually the facebbok popup just doesn't display the button that should allow the user to close the window : – Mathieu K. Mar 14 '16 at 09:03
  • @MathieuK. did you find any solution to the problem? I am facing same problem. Twitter works fine for me but Facebook doesn't close popup due to which user is not registered. – Davinder Jan 27 '17 at 18:59
  • I posted my solution as an answer below – Mathieu K. Jan 27 '17 at 19:01

2 Answers2

1

I was experiencing the same issue, when I started using accounts-google.

It was because I was mixing http and https in my redirect URL.

1

Apparently this is a known bug with iOS and can be solved by changing the loginStyle parameters:

Usually, the popup-based flow is preferable because the user will not have to reload your whole app at the end of the login flow. However, the popup-based flow requires browser features such as window.close and window.opener that are not available in all mobile environments. In particular, we recommend using Meteor.loginWith({ loginStyle: "redirect" }) in the following environments:

Inside UIWebViews (when your app is loaded inside a mobile app) In Safari on iOS8 (window.close is not supported due to a bug)

Meteor docs

Community
  • 1
  • 1
Mathieu K.
  • 903
  • 8
  • 27
  • but loginStyle cannot be changed for apps as it is hardcoded to popup. – Davinder Jan 27 '17 at 19:01
  • no it is not. you can change it when you setup a particular service or in mongo if you are already setup. – Mathieu K. Jan 27 '17 at 19:03
  • 1
    @Davinder You are kind of right when the app is packaged as hybrid Cordova app: the `loginStyle` no longer applies and the app always uses a new InAppBrowser window. Unfortunately that Cordova plugin had a bug specifically in such situations. See https://stackoverflow.com/questions/40105055/meteor-social-login-blank-page-on-oauth2-login-using-fb-or-google/44652947#44652947 – ghybs Jun 20 '17 at 12:29