@bobfrankston/rmfmail 1.1.105 → 1.1.106

package/client/app.js

@@ -4495,29 +4495,44 @@ optEditorTiptap?.addEventListener("change", () => {
         saveEditorSetting("tiptap");
 });
 optEditorTinymce?.addEventListener("change", () => {
-    if (optEditorTinymce.checked) {
-        saveEditorSetting("tinymce");
-        // Q133 pre-warm — fire the TinyMCE bundle fetch right now so the
-        // next compose-open finds tinymce.min.js already in WebView2's
-        // HTTP cache. Without this, the first compose after picking
-        // TinyMCE in Settings blocks ~1 s while the bundle downloads.
-        try {
-            // Default points at the locally bundled TinyMCE (build-tinymce.js
-            // copies it from node_modules). Path is relative to index.html
-            // which lives at the client/ root; compose.html (in client/compose/)
-            // uses `../lib/tinymce/...` instead.
-            const cdnUrl = localStorage.getItem("mailx-tinymce-cdn") || "lib/tinymce/tinymce.min.js";
-            // Use <link rel="prefetch"> — fires the request as a hint,
-            // doesn't execute the script (we don't want a stray global
-            // tinymce in the main window; it lives in the compose iframe).
-            const link = document.createElement("link");
-            link.rel = "prefetch";
-            link.as = "script";
-            link.href = cdnUrl;
-            document.head.appendChild(link);
-        }
-        catch { /* prefetch is best-effort */ }
-    }
+    if (!optEditorTinymce.checked)
+        return;
+    saveEditorSetting("tinymce");
+    // Q133 + 2026-05-21 — warm the TinyMCE bundle into the HTTP cache so the
+    // first compose-open doesn't stall downloading it. The old code used a
+    // silent <link rel=prefetch> — no completion signal, so picking TinyMCE
+    // looked like a frozen UI ("hang while fetching"). Now we do an explicit
+    // fetch() (I/O, already off the UI thread — a Worker buys nothing for a
+    // download) and surface a pending → ready indicator on the menu item.
+    const cdnUrl = localStorage.getItem("mailx-tinymce-cdn") || "lib/tinymce/tinymce.min.js";
+    const label = optEditorTinymce.closest("label");
+    let status = document.getElementById("opt-editor-tinymce-status");
+    if (label && !status) {
+        status = document.createElement("span");
+        status.id = "opt-editor-tinymce-status";
+        status.className = "tb-menu-status";
+        label.appendChild(status);
+    }
+    const setStatus = (text, state) => {
+        if (!status)
+            return;
+        status.textContent = text;
+        status.dataset.state = state;
+    };
+    setStatus(" loading…", "pending"); // CSS ::before draws the spinner
+    fetch(cdnUrl, { cache: "force-cache" })
+        .then(r => (r.ok ? r.arrayBuffer() : Promise.reject(new Error(`HTTP ${r.status}`))))
+        .then(() => {
+        setStatus(" ✓ ready", "ready");
+        // Clear the badge after a few seconds — but only if still "ready"
+        // (don't wipe a later pending/error state from a re-pick).
+        setTimeout(() => { if (status?.dataset.state === "ready")
+            setStatus("", "idle"); }, 4000);
+    })
+        .catch(e => {
+        setStatus(" ⚠ load failed", "error");
+        console.error("[tinymce] pre-warm fetch failed:", e?.message || e);
+    });
 });
 // External editor preference (Edit-in-Word handoff target). Stored under
 // settings.externalEditor so the service can read it via loadSettings().