AppleId auth popup doesn't returns signIn promise

Hi,
I'm having a similar problem (using Chrome in a Mac).
I can open the popup login/authenticate without problems, but when I click on continue nothing happens.
When I check the network traffic I see the response with the authentication date being returned but the popup is never closed and the promise isn't resolved or rejected.
This doesn't work

async function appleSignIn() {
  var data = await AppleID.auth.signIn();
  console.log("data", data);
}

This either

var data = AppleID.auth.signIn().then(function(response) {
  console.log("response", response);
}, function(err) {
  $log.error(err);
});

I have also included this just in case

//Listen for authorization success
document.addEventListener('AppleIDSignInOnSuccess', (data) => {
console.log("AppleIDSignInOnSuccess", data);
});
//Listen for authorization failures
document.addEventListener('AppleIDSignInOnFailure', (error) => {
console.log("AppleIDSignInOnFailure", error);
});

But only the AppleIDSignInOnFailure event is called when I close the popup window through the browser's red button.
The website I'm working on doesn't render anything. It's a fully static Angular app.
All interactions are done through REST APIs, so the app won't refresh.
The redirect URL works because there is a proxy behind that forwards the redirect URL to an existing API.
Mobile authentication from Android works fine.
But this web page can't do the same given it is static.
I'm wondering why the promise is never resolved or rejected? What's the purpose of the promise then?

Problem resolved (at least mine).
In the Apple portal configuration, you need to have all involved domains registered and validated.
Then, if you need multiple redirect URLs (because the login might start from different paths), just add them into the redirect URLs list (separated by commas).
The undocumented trick is:
The redirect url should fully match the current window url (even if there is a port there, https://domain:port/path)

Facing the same issue and setting the domains and return URLs under Service ID seem not do any difference. Anything else to try out?

I faced the same issue. When usePopup is true, the only way the pop-up will close after the user clicks "continue" is if redirectURI is set to the hostname, and hostname is listed in the Service ID "Return URLs" in the developer portal. I.e., if your login page is at https://www.example.com/user/login, you can set redirectURI to https://www.example.com (don't need the path after the hostname) and then add this to "Return URLs" in developer portal.

Two gotchas for development:

1. Apple doesn't allow localhost Return URL.
2. Apple doesn't allow non-https Return URL.

I ended up using ngrok to serve up a https endpoint that forwarded to my local environment (e.g., https://xxxxxxx.ngrok.io ---> http://localhost:3000) and during development, I added the https://xxxxxxx.ngrok.io endpoint as the Return URL in the developer portal. I then did all testing by visiting the https://xxxxxxx.ngrok.io endpoint, which served up my local code and I could debug.

Note that when usePopup is true, you need to use the JS listeners (or promise) to handle the data that results from the popup closing when the user clicks Continue. Here you'll redirect or POST to the page that can process the id_token and manage then user session.

document.addEventListener('AppleIDSignInOnSuccess', (event) => {
    // Handle successful response.
    console.log(event.detail.data);
});

// Listen for authorization failures.
document.addEventListener('AppleIDSignInOnFailure', (event) => {
     // Handle error.
     console.log(event.detail.error);
});

If you have usePopup is false, then the user is fully sent to Apples https://appleid.apple.com/auth/authorize page and this page then does a POST back to your redirectURI after the user clicks Continue. In this case, the redirectURI does need to be the full path so Apple knows where to send the user back to. And also in the Developer portal, the services ID Return URL will need to have that full path Redirect URL.

I found Apple's documention unnecessairly complicated and missing this critical point about having redirectURI match the host of the page that opens the popup, when usePopup is true.

Thanks a lot @dbcarlton

I can confirm your 2 sentences about Return URLs if usePopup: true:

1 - redirectURI must be "https://example.com" (without any path) in app config

2 - "https://example.com" must be added in return URLs in Apple Developer website

Moreover let me add my own finding:

3 - do NOT add any 'alert("my debug message")' (you might have done for debugging as in my case) in the listener "AppleIDSignInOnSuccess".

An alert in that listener will prevent the Apple popup to close.

I succeeded in using "usePopUp= true''' on the website and in the iOS mobile app.

However, I could not do it in the Android app.

The error is:

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('https://www.example.com') does not match the recipient window's origin ('https://appleid.apple.com').

The apple popup is shown and after hitting the "Continue" button, it does not show anything, and clicking the "Continue" button again, it shows "Try again later". I could see the request "https://appleid.apple.com/appleauth/auth/oauth/authorize" was also sent. In the subdomain and domain tab in Apple config, I set: "www.example.com" and the return URL is "https://www.example.com". What did i do wrong here?