fix: recover stalled mobile sign-in (Closes #767)

frontend/login.js

@@ -33,7 +33,31 @@
   const continuation = validShareContinuation(options.continuation);
   const setIntervalImpl = options.setIntervalImpl || setInterval;
   const clearIntervalImpl = options.clearIntervalImpl || clearInterval;
+  const setTimeoutImpl = options.setTimeoutImpl || setTimeout;
+  const clearTimeoutImpl = options.clearTimeoutImpl || clearTimeout;
+  const requestTimeoutMs = options.requestTimeoutMs || 15000;
   let timer = null;
+  let activeAttempt = false;
+
+  function setAttemptActive(active) {
+    activeAttempt = active;
+    button.disabled = active;
+    if (passkeyButton) passkeyButton.disabled = active || !credentials?.get;
+  }
+
+  async function requestWithDeadline(url, init) {
+    const controller = new AbortController();
+    const timeout = setTimeoutImpl(() => {
+      const error = new Error('Sign-in request timed out');
+      error.name = 'TimeoutError';
+      controller.abort(error);
+    }, requestTimeoutMs);
+    try {
+      return await fetchImpl(url, { ...init, signal: controller.signal });
+    } finally {
+      clearTimeoutImpl(timeout);
+    }
+  }
 
   function decodeBase64Url(value) {
     const padded = String(value).replaceAll('-', '+').replaceAll('_', '/')
@@ -105,18 +129,24 @@
   }
 
   async function submit(accessToken, deviceLabel = 'This device') {
+    if (activeAttempt) return false;
+    setAttemptActive(true);
     status.textContent = 'Signing in…';
     let response;
     try {
-      response = await fetchImpl('api/v1/session', {
+      response = await requestWithDeadline('api/v1/session', {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({ access_token: accessToken, device_label: deviceLabel }),
       });
-    } catch (_error) {
+    } catch (error) {
       form.reset();
-      status.textContent = 'Sign-in failed. Check your connection and try again.';
-      return;
+      status.textContent = error?.name === 'TimeoutError'
+        ? 'Sign-in timed out. Check your connection and try again.'
+        : 'Sign-in failed. Check your connection and try again.';
+      return false;
+    } finally {
+      setAttemptActive(false);
     }
     form.reset();
     if (response.ok) {
@@ -135,9 +165,11 @@
       status.textContent = 'Passkeys are not supported in this browser. Use the access token.';
       return false;
     }
+    if (activeAttempt) return false;
+    setAttemptActive(true);
     status.textContent = 'Waiting for your passkey…';
     try {
-      const optionsResponse = await fetchImpl('api/v1/passkeys/authentication/options', {
+      const optionsResponse = await requestWithDeadline('api/v1/passkeys/authentication/options', {
         method: 'POST', headers: { Accept: 'application/json' },
       });
       if (!optionsResponse.ok) throw new Error('No enrolled passkey');
@@ -148,7 +180,7 @@
         ...item, id: decodeBase64Url(item.id),
       }));
       const credential = await credentials.get({ publicKey });
-      const response = await fetchImpl('api/v1/passkeys/authentication/verify', {
+      const response = await requestWithDeadline('api/v1/passkeys/authentication/verify', {
         method: 'POST',
         headers: { Accept: 'application/json', 'Content-Type': 'application/json' },
         body: JSON.stringify({
@@ -162,9 +194,13 @@
       if (!response.ok) throw new Error('Passkey verification failed');
       location.replace(continuation);
       return true;
-    } catch (_error) {
-      status.textContent = 'Passkey sign-in was not completed. Try again or use the access token.';
+    } catch (error) {
+      status.textContent = error?.name === 'TimeoutError'
+        ? 'Passkey sign-in timed out. Check your connection and try again.'
+        : 'Passkey sign-in was not completed. Try again or use the access token.';
       return false;
+    } finally {
+      setAttemptActive(false);
     }
   }