Fix: preserve attached files during file input changes (#4877) * fix: preserve attached files during file input changes * Reverse order of duplicate pasted files check

e7dee7f5a7a67d3128179d9ba9477d11fc51dd83

Cohee <18619528+Cohee1207@users.noreply.github.com>

Signed

public/scripts/chats.js+27 -12 Viewed

 export function hasPendingFileAttachment() {
     const fileInput = document.getElementById('file_form_input');
     if (!(fileInput instanceof HTMLInputElement)) return false;
-    const file = fileInput.files[0];
+    return fileInput.files.length > 0;
-    return !!file;
+}
 /**

         fileInput.click();
     });
+    const fileInput = document.getElementById('file_form_input');
     // Do not change. #attachFile is added by extension.
     $(document).on('click', '#attachFile', function () {
-        $('#file_form_input').trigger('click');
+        if (!(fileInput instanceof HTMLInputElement)) return;
+        const $fileInput = $(fileInput);
+        // Preserve existing files in DataTransfer
+        const dataTransfer = new DataTransfer();
+        for (const file of fileInput.files) {
+            dataTransfer.items.add(file);
+        }
+        $fileInput.off('change').on('change', async () => {
+            for (const file of fileInput.files) {
+                if (!Array.from(dataTransfer.files).some(f => isSameFile(f, file))) {
+                    dataTransfer.items.add(file);
+                }
+            }
+            fileInput.files = dataTransfer.files;
+            await onFileAttach(fileInput.files);
+        });
+        $fileInput.trigger('click');
     });
     // Do not change. #manageAttachments is added by extension.

         await onImageSwiped(messageId, messageBlock, SWIPE_DIRECTION.RIGHT);
     });
-    $('#file_form_input').on('change', async () => {
-        const fileInput = document.getElementById('file_form_input');
-        if (!(fileInput instanceof HTMLInputElement)) return;
-        await onFileAttach(fileInput.files);
-    });
     $('#file_form').on('reset', function () {
         $('#file_form').addClass('displayNone');
     });

      * @returns {Promise<void>}
      */
     async function handleFileAttach(files) {
-        const fileInput = document.getElementById('file_form_input');
         if (!(fileInput instanceof HTMLInputElement)) return;
         // Workaround for Firefox: Use a DataTransfer object to indirectly set fileInput.files
         const dataTransfer = new DataTransfer();
-        for (let i = 0; i < files.length; i++) {
+        for (const file of fileInput.files) {
-            dataTransfer.items.add(files[i]);
+            dataTransfer.items.add(file);
+        }
         // Preserve existing non-duplicate files in the input
-        for (const file of fileInput.files) {
+        for (const file of files) {
             if (!Array.from(dataTransfer.files).some(f => isSameFile(f, file))) {
                 dataTransfer.items.add(file);
+            }