magiclabs / magic-js

Magic browser/React Native JavaScript SDK is your entry-point to integrating passwordless authentication inside your application.
https://magic.link/docs/api-reference/client-side-sdks/web
Apache License 2.0
463 stars 86 forks source link

fix: remount the webview after inactivity before posting a message to avoid timeouts #798

Closed romin-halltari closed 1 month ago

romin-halltari commented 2 months ago

After a period of inactivity, especially when the app goes to the background, iOS will randomly decide to kill the webview process without letting us know in any way. When the user comes back to the app and a magic method is called like isLoggedIn, we call webview.postMessage but even though the webview process is killed, no error is thrown here.

As a result, the message is never sent to mgbox/mandrake, and the user is left hanging for the response forever. They would need to restart the app for magic to work again.

In this PR, we're checking before posting any message if there's been inactivity. Inactivity is determined when a message is being sent 5 minutes or more after the last sent message.

If inactivity is determined, we briefly unmount and re-mount the webview to force a restart of the webview process and reload the webview content. Only after this hard reload we post the message, avoiding a "forever hanging" situation.

First I tried with webview.reload(), but it seems like even the ref is lost when the webview process is killed, so calling this function did nothing. That's why I went with the re-mount approach.

This was tested by the Nova Labs dev who could reproduce the problem previously, and he confirmed that this fix works. He even waited a full night with the app in background, and the next day he opened the app and it still worked, when before it would hang and the app would need a restart.

Ticket: https://magiclink.atlassian.net/browse/PDEEXP-1611

📦 Published PR as canary version: Canary Versions
:sparkles: Test out this PR locally via: ```bash npm install @magic-ext/react-native-bare-oauth@25.7.0-canary.798.10727977103.0 npm install @magic-ext/react-native-expo-oauth@25.7.0-canary.798.10727977103.0 npm install @magic-sdk/react-native-bare@29.7.0-canary.798.10727977103.0 npm install @magic-sdk/react-native-expo@29.7.0-canary.798.10727977103.0 # or yarn add @magic-ext/react-native-bare-oauth@25.7.0-canary.798.10727977103.0 yarn add @magic-ext/react-native-expo-oauth@25.7.0-canary.798.10727977103.0 yarn add @magic-sdk/react-native-bare@29.7.0-canary.798.10727977103.0 yarn add @magic-sdk/react-native-expo@29.7.0-canary.798.10727977103.0 ```
bcleary06 commented 2 months ago

@romin-halltari will you link the ticket to the PR

Ethella commented 2 months ago

Do you think we should also introduce this patch to Expo? Where potentially iOS would put the webview to inactive as well?

swarmia[bot] commented 2 months ago

✅  Linked to Story PDEEXP-1611 · Nova Labs Timeouts
➡️  Part of Epic PDEEXP-1815 · Stability

svc-magic-git commented 1 month ago

:rocket: PR was released in @magic-ext/react-native-bare-oauth@25.7.0, @magic-ext/react-native-expo-oauth@25.7.0, @magic-sdk/react-native-bare@29.7.0, @magic-sdk/react-native-expo@29.7.0 :rocket: