Configure or Handle Timeout on Popup Authentication

[auth0]

Configure or Handle Timeout on Popup Authentication

[luisrudge]

@mwillbanks @Enngage I'd love your feedback on #133 🎉

[luisrudge]

I agree that will be super useful. Do you want to send a PR with that? If you can't, I'll add our near term backlog to make sure we work on this.

[Enngage]

Same here, I feel the 30s timeout is way too low :( I would really liked there to be a way to configure custom timeout + way to close popup on any error.

[Enngage]

@luisrudge awesome, thank you!

Could you possibly share the reasoning behind the default 30sec timeout? Many users fail to fill in their credentials in such short time.

I like that you can close the popup from within the error using error.popup.close();, but would it be possible to get an instance of popup when you call auth0.loginWithPopup (and similar methods) so that we can potentially have more control and close popup whenever we want?

[luisrudge]

@Enngage I'm not sure where you saw a 30s default. I think we always used a 60s timeout.
It's not possible to return the popup in the loginWithPopup method because when the method finishes, the authentication already happened. I think it's better if we manage the lifecycle of the popup.

[mwillbanks]

You can fetch the pop-up today it's a hack but works with most browsers: const win = window.open('', 'auth0:authorize:popup')

[Enngage]

@luisrudge I thought I saw 30 seconds somewhere, but maybe I confused it with something else :-) Either way the PR looks good and would definitely help accomplish both my issues I have currently with this package. Thank you!

[luisrudge]

You can fetch the pop-up today it's a hack but works with most browsers: const win = window.open('', 'auth0:authorize:popup')

Yes, I can get the reference of the popup in the code, but there's no API that would expose the popup before the code actually runs. For example, how would you get a reference to the popup with this code: await auth0Client.getTokenWithPopup(params);

We could change it to be something like this:

const popup = await auth0Client.getTokenWithPopup(params);
const token = await popup.getToken();

But then we'd be penalizing the most used scenario for a niche use case.