Safari Web Extension and Sign in with Apple

My existing chrome extension has "Sign in with Apple" given that we have iOS users.

When user clicks "Continue with Apple" button in the extension log in pop up, this is what we do:
Code Block javascript
window.open(
'https://appleid.apple.com/auth/authorize?client_id=' + clientID + '&redirect_uri=' + backEndURL + '&response_type=id_token%20code&response_mode=form_post&scope=email%20name',
'Sign in with Apple', 'height=500,width=400,left=600,top=200,status=no,location=no,toolbar=no,menubar=no'
)


In chrome, this opens a popup window with that URL.

In Safari Converted Web Extension, it opens custom Apple sign in flow, where it says:

"Do you want to sign in to *** with your Apple ID YYY?"

and then with my mac password I'm able to authenticate.

Afterwards, nothing happens.
Expected: a redirect to the URL specified in the window.open.

Now let's do a trick:
I'll wrap the above window.open code into
Code Block javascript
setTimeout (() => {window.open (...)}, 3000)

Because of security reasons, safari then won't open the popup after 3s and will display a notification in the toolbar "Popup blocked..".
If we allow the popup, then it finally opens as a normal window popup and after sign in, it redirects to our backend and it successfully authenticates.

Any ides what how to solve this?

P.S. We're not able to use embedded Sign in with Apple JS script because we can't host a remote code in the extension (it will be deprecated soon). So, we arere using this.
Answered by thianphat in 787814022

@ceskomira90 @climb

3 years late, but I also ran into the exact same problem as you and managed to avoid the popup from being blocked by using chrome.windows.create rather than window.open

see docs:

https://developer.chrome.com/docs/extensions/reference/api/windows#method-create

I don't know if it helps but I in my case it was enough to open the window two times, maybe with a fakeUrl for the first instance:

Code Block js
popUp = window.open (fakeUrl)
popUp = window.open('https://appleid.apple.com/auth/authorize?client_id=' + clientID + '&redirect_uri=' + backEndURL + '&response_type=id_token%20code&response_mode=form_post&scope=email%20name', 'Sign in with Apple', 'height=500,width=400,left=600,top=200,status=no,location=no,toolbar=no,menubar=no' )


I know that is another workaround but it works to me.
Accepted Answer

@ceskomira90 @climb

3 years late, but I also ran into the exact same problem as you and managed to avoid the popup from being blocked by using chrome.windows.create rather than window.open

see docs:

https://developer.chrome.com/docs/extensions/reference/api/windows#method-create

Safari Web Extension and Sign in with Apple
 
 
Q