Safari cannot open the page because the network connection was lost - PWA

[ptallett]

I have developed a small Progressive Web App (PWA) using Create React App and react-adal. My index.tsx is quite normal:

const DO_NOT_LOGIN = false;

runWithAdal(
  adalContext.AuthContext,
  () => {
    const rootDiv = document.getElementById('root') as HTMLElement;
    ReactDOM.render(<App />, rootDiv);
  },
  DO_NOT_LOGIN
);
serviceWorker.register();

The app works fine on Windows and Android, both in a browser and installed as a PWA, but on iOS it only works in Safari, not when installed as a PWA.

On iPhone, I launch my PWA, it redirects to the Microsoft login page, I type my username & password, it does TFA and sends me a prompt, which I approve (on the same phone in Authenticator), but when I go back to the app, I get the above error message. Its right at the point of doing the token redirect, but the url sticks at msft.sts.microsoft.com. Its as if the very final redirect is failing.

I wondered if the fact I am switching away from the app to approve could have something to do with it (reloading the PWA), but I thought OAuth was stateless on the client, so wouldn;t matter if the client got reloaded.

Do I need to do anything special for PWA?

I saw a post where he was suggesting doing the login flow inside a popup to avoid the url bar, so I set AuthContext.popUp to true, but after authenticating it sits in a loop inside the service worker failing to redirect to the homepage. My SW is the standard CRA with a few console.logs sprinkled in.

Been stuck for days on this issue.