Fallback MIDI export in embedded Spaces

README.md

@@ -96,9 +96,12 @@ intentionally remembers a file, not a folder, because Chrome can reject folder
 access for protected locations.
 
 If the browser does not support the file-save picker, the export falls back to a
-normal browser download. The backend also keeps `POST /api/sessions/{session_id}/save-midi`
-as a server-side fallback route, but browser users should prefer the ZIP
-download path because it writes to a location they choose locally.
+normal browser download. Hugging Face embeds Spaces in a cross-origin frame, so
+the embedded Space also uses the normal browser download flow; open the direct
+Space URL if you want Chrome's file-save picker and `Don't ask again` behavior.
+The backend also keeps `POST /api/sessions/{session_id}/save-midi` as a
+server-side fallback route, but browser users should prefer the ZIP download
+path because it writes to a location they choose locally.
 
 ## High-Level Architecture
 
@@ -369,7 +372,9 @@ CONTINUATOR_DB_PATH=/data/continuator.sqlite3
 ```
 
 The browser ZIP export does not require persistent Space storage because the
-archive is downloaded to the user. The server-side fallback `save-midi` route
+archive is downloaded to the user. In the embedded Hugging Face Space page,
+browser security rules block Chrome's file-save picker, so exports fall back to
+the browser's normal download flow. The server-side fallback `save-midi` route
 writes inside the container unless `CONTINUATOR_SESSION_EXPORT_DIR` points to a
 mounted volume, so it is mainly useful for local development or managed storage
 setups.

frontend/app.js

@@ -544,8 +544,27 @@ function safeLocalStorageSet(key, value) {
   }
 }
 
+function isCrossOriginSubframe() {
+  if (window.self === window.top) {
+    return false;
+  }
+  try {
+    void window.top.location.href;
+    return false;
+  } catch {
+    return true;
+  }
+}
+
+function filePickerBlockedByFrame(error) {
+  return /cross.?origin|sub.?frames?|file picker/i.test(error?.message || "");
+}
+
 function midiExportZipSaveSupported() {
-  return typeof window.showSaveFilePicker === "function";
+  return (
+    typeof window.showSaveFilePicker === "function" &&
+    !isCrossOriginSubframe()
+  );
 }
 
 function midiExportZipRememberSupported() {
@@ -4734,14 +4753,23 @@ async function saveSessionMidi() {
           setPhraseMessage("MIDI export cancelled.");
           return;
         }
-        if (error?.name === "NotAllowedError" || /system files/i.test(error?.message || "")) {
+        if (filePickerBlockedByFrame(error)) {
+          destinationLabel = `${downloadZipBlob(payload.blob, payload.archive_file_name)} in your browser downloads`;
+          setSessionMidiSaveResult(
+            "File picker is blocked in this embedded page; using browser downloads instead.",
+          );
+          fileHandle = null;
+        } else if (error?.name === "NotAllowedError" || /system files/i.test(error?.message || "")) {
           throw new Error(
             "Chrome blocked that location. Save the ZIP in Downloads, Documents, Desktop, or Music instead of a system, home, or project folder.",
           );
+        } else {
+          throw error;
         }
-        throw error;
       }
-      destinationLabel = await writeZipBlobToFileHandle(payload.blob, fileHandle);
+      if (fileHandle) {
+        destinationLabel = await writeZipBlobToFileHandle(payload.blob, fileHandle);
+      }
     } else {
       destinationLabel = `${downloadZipBlob(payload.blob, payload.archive_file_name)} in your browser downloads`;
     }

frontend/index.html

@@ -4,7 +4,7 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <title>Web Continuator</title>
-    <link rel="stylesheet" href="/assets/styles.css?v=20260602-session-midi-zip2" />
+    <link rel="stylesheet" href="/assets/styles.css?v=20260602-session-midi-zip3" />
   </head>
   <body>
     <div class="page-aura"></div>
@@ -167,7 +167,7 @@
           <p>
             In Chrome and Edge, <strong>Don't ask again</strong> remembers the
             selected ZIP file and overwrites it on future saves. Other browsers
-            use the normal download flow.
+            and embedded Hugging Face pages use the normal download flow.
           </p>
         </section>
 
@@ -1159,6 +1159,6 @@
       </section>
     </main>
 
-    <script type="module" src="/assets/app.js?v=20260602-session-midi-zip2"></script>
+    <script type="module" src="/assets/app.js?v=20260602-session-midi-zip3"></script>
   </body>
 </html>