fix: fileinput change listener (#861)

Author: lukasvinclav

src/unfold/static/unfold/js/app.js

@@ -135,27 +135,33 @@ const dateTimeShortcutsOverlay = () => {
  * File upload path
  *************************************************************/
 const fileInputUpdatePath = () => {
-  const observer = new MutationObserver((mutations) => {
-    for (const mutation of mutations) {
-      if (mutation.type === "childList") {
-        for (const input of document.querySelectorAll("input[type=file]")) {
-          input.addEventListener("change", (e) => {
-            const parts = e.target.value.split("\\");
-            const placeholder =
-              input.parentNode.parentNode.parentNode.querySelector(
-                "input[type=text]"
-              );
-            placeholder.setAttribute("value", parts[parts.length - 1]);
-          });
-        }
+  const checkInputChanged = () => {
+    for (const input of document.querySelectorAll("input[type=file]")) {
+      if (input.hasChangeListener) {
+        continue;
       }
+
+      input.addEventListener("change", (e) => {
+        const parts = e.target.value.split("\\");
+        const placeholder =
+          input.parentNode.parentNode.parentNode.querySelector(
+            "input[type=text]"
+          );
+        placeholder.setAttribute("value", parts[parts.length - 1]);
+      });
+
+      input.hasChangeListener = true;
     }
-  });
+  };
 
-  observer.observe(document.body, {
+  new MutationObserver(() => {
+    checkInputChanged();
+  }).observe(document.body, {
     childList: true,
     subtree: true,
   });
+
+  checkInputChanged();
 };
 
 /*************************************************************