fix: add retry logic for Turnstile CAPTCHA widget rendering

- initTurnstileWithRetry() polls every 500ms (up to 10x) for async script
- Added onload=onTurnstileLoad callback to Turnstile script URL
- turnstile-ready event auto-renders widget when script loads
- Fixes widget not showing when share modal opens before script loads

Author: ijbo

changelogs/CHANGELOG-turnstile-retry.md

@@ -0,0 +1,33 @@
+# Turnstile Widget Retry Fix — Ensure CAPTCHA renders reliably
+
+- Fixed: Turnstile widget never rendering when the async/defer script loads after the share modal opens
+- Added `initTurnstileWithRetry()` polling mechanism (retries every 500ms, up to 10 times)
+- Added `onload=onTurnstileLoad` callback to Turnstile script URL for immediate notification
+- Added `turnstile-ready` custom event listener to auto-render widget when script loads
+- Added `turnstileModalOpen` state tracking to coordinate script loading with modal visibility
+
+---
+
+## Summary
+The Turnstile CAPTCHA widget was not rendering because the async/defer script hadn't loaded when `initTurnstile()` was called. The function silently returned with no retry mechanism. This fix ensures reliable widget rendering through polling retries and an onload callback.
+
+---
+
+## 1. Retry Logic
+**Files:** `js/cloud-share.js`
+**What:** Added `initTurnstileWithRetry()` that polls every 500ms (up to 10 attempts) until the `turnstile` global is available, then renders the widget.
+**Impact:** Widget reliably renders regardless of script load timing.
+
+## 2. Onload Callback
+**Files:** `index.html`, `js/cloud-share.js`
+**What:** Added `onload=onTurnstileLoad` parameter to script URL; callback dispatches `turnstile-ready` event; cloud-share.js listens and auto-inits if modal is open.
+**Impact:** Belt-and-suspenders approach — widget renders as soon as script loads.
+
+---
+
+## Files Changed (2 total)
+
+| File | Lines Changed | Type |
+|------|:---:|------|
+| `js/cloud-share.js` | +30 −8 | Retry logic + event listener |
+| `index.html` | +6 −1 | Onload callback + event dispatch |

index.html

@@ -1014,7 +1014,13 @@ <h4><i class="bi bi-keyboard me-2"></i>Keyboard Shortcuts</h4>
 
 
     <!-- Cloudflare Turnstile CAPTCHA (explicit render — used in email-to-self flow) -->
-    <script src="https://challenges.cloudflare.com/turnstile/v0/api.js?render=explicit" async defer></script>
+    <script>
+        // Cloudflare Turnstile onload callback — dispatches event for cloud-share.js
+        function onTurnstileLoad() {
+            window.dispatchEvent(new Event('turnstile-ready'));
+        }
+    </script>
+    <script src="https://challenges.cloudflare.com/turnstile/v0/api.js?render=explicit&onload=onTurnstileLoad" async defer></script>
 
     <script type="module" src="/src/main.js"></script>
 </body>

js/cloud-share.js

@@ -859,6 +859,8 @@
     var savedEmail = localStorage.getItem(M.KEYS.EMAIL_SELF);
     if (savedEmail && emailInput) emailInput.value = savedEmail;
 
+    var turnstileModalOpen = false; // Track if the share result modal is open
+
     /** Render Turnstile widget when the share result modal opens */
     function initTurnstile() {
         if (turnstileWidgetId !== null) return; // Already rendered
@@ -879,6 +881,23 @@
         }
     }
 
+    /**
+     * Try to init Turnstile with retry — the script loads async/defer so it
+     * may not be available when the share result modal first opens.
+     */
+    function initTurnstileWithRetry(attempt) {
+        attempt = attempt || 0;
+        if (turnstileWidgetId !== null) return; // Already rendered
+        if (typeof turnstile !== 'undefined') {
+            initTurnstile();
+            return;
+        }
+        // Retry up to 10 times (5 seconds total)
+        if (attempt < 10 && turnstileModalOpen) {
+            setTimeout(function () { initTurnstileWithRetry(attempt + 1); }, 500);
+        }
+    }
+
     /** Reset the Turnstile widget for retry */
     function resetTurnstile() {
         if (typeof turnstile !== 'undefined') {
@@ -890,8 +909,21 @@
     var _origShowShareResult = showShareResult;
     showShareResult = function (url, isSecure) {
         _origShowShareResult(url, isSecure);
-        // Small delay so the modal DOM is visible before Turnstile measures it
-        setTimeout(initTurnstile, 200);
+        turnstileModalOpen = true;
+        // Start retry loop — handles case where script hasn't loaded yet
+        setTimeout(function () { initTurnstileWithRetry(0); }, 200);
+    };
+
+    // Auto-init when Turnstile script finishes loading (if modal is already open)
+    window.addEventListener('turnstile-ready', function () {
+        if (turnstileModalOpen) initTurnstile();
+    });
+
+    // When the share result modal closes, mark it
+    var _origCloseShareResult = M.closeShareResultModal;
+    M.closeShareResultModal = function () {
+        turnstileModalOpen = false;
+        _origCloseShareResult();
     };
 
     if (emailSendBtn) emailSendBtn.addEventListener('click', async function () {