all repos — searchix @ 084e52376f261eae781be54eed6a37b764fa95e9

Search engine for NixOS, nix-darwin, home-manager and NUR users

fix: close modal dialogs on backdrop click in browsers without closedby Squashed commit of the following: commit 03b22ab0fb1f0b8c0509ed0f0e861c007d3fa839 Author: Péter Lódri <cabotage@pm.me> Date: Sun Nov 1 18:06:49 2026 +0900 fix: close modal dialogs on backdrop click in browsers without closedby Provide a fallback pointerdown+click listener on <dialog> elements when HTMLDialogElement.prototype.closedBy is unsupported (e.g. Safari/WebKit), closing the modal only when both pointerdown and click occur outside the dialog bounding box. Ref: #23

Alin
commit

084e52376f261eae781be54eed6a37b764fa95e9

parent

29e47b415eb3792696a486eec0df6bd20af34323

1 file changed, 40 insertions(+), 0 deletions(-)

changed files
M frontend/static/search.js → frontend/static/search.js
@@ -68,6 +68,42 @@ });
 }
 
 /**
+ * @param {HTMLDialogElement} dialogEl
+ * @param {MouseEvent} ev
+ */
+function isOutsideDialog(dialogEl, ev) {
+  if (ev.target !== dialogEl) {
+    return false;
+  }
+  const rect = dialogEl.getBoundingClientRect();
+  return (
+    ev.clientX < rect.left ||
+    ev.clientX > rect.right ||
+    ev.clientY < rect.top ||
+    ev.clientY > rect.bottom
+  );
+}
+
+/**
+ * @param {HTMLDialogElement} dialogEl
+ */
+function addBackdropCloseListener(dialogEl) {
+  if ("closedBy" in HTMLDialogElement.prototype) {
+    return;
+  }
+  let pointerDownOutside = false;
+  dialogEl.addEventListener("pointerdown", function (ev) {
+    pointerDownOutside = isOutsideDialog(dialogEl, ev);
+  });
+  dialogEl.addEventListener("click", function (ev) {
+    if (pointerDownOutside && isOutsideDialog(dialogEl, ev)) {
+      dialogEl.close();
+    }
+    pointerDownOutside = false;
+  });
+}
+
+/**
  *
  * @param {MouseEvent} ev
  */

@@ -92,6 +128,9 @@ element.addEventListener("auxclick", handleDialogNewTab);
   });
   results.querySelectorAll("a.open-sibling-dialog").forEach(function (element) {
     element.addEventListener("click", openSiblingDialog);
+    if (element.nextElementSibling instanceof HTMLDialogElement) {
+      addBackdropCloseListener(element.nextElementSibling);
+    }
   });
 }
 

@@ -274,6 +313,7 @@ dialogCloseEl.addEventListener("click", function (ev) {
   ev.preventDefault();
   dialog.close();
 });
+addBackdropCloseListener(dialog);
 
 /**
  *