fix: don't close modal on inner HTMX requests.

changelog

html-router/tests/router_integration.rs

@@ -333,6 +333,22 @@ async fn snapshot_new_entity_modal() {
     snapshot_settings().bind(|| insta::assert_snapshot!("new_entity_modal", body));
 }
 
+#[tokio::test(flavor = "multi_thread", worker_threads = 2)]
+async fn modal_form_after_request_ignores_inner_htmx_requests() {
+    let (app, db) = build_test_app().await;
+    let cookie = seeded_cookie(&app, &db).await;
+    let modal = get_html(&app, "/knowledge-entity/new", Some(&cookie)).await;
+
+    // Inner buttons (e.g. Suggest Relationships) bubble htmx:afterRequest to
+    // #modal_form; closing must only run when the form itself submitted.
+    assert!(
+        modal.contains(
+            r#"hx-on::after-request="if(event.detail.successful && event.detail.elt === event.currentTarget) document.getElementById('body_modal').close()"#
+        ),
+        "#modal_form should ignore bubbled after-request events from child elements"
+    );
+}
+
 async fn sign_in(app: &Router, email: &str, password: &str) -> String {
     let response = app
         .clone()

html-router/tests/snapshots/new_entity_modal.snap

@@ -1,5 +1,6 @@
 ---
 source: html-router/tests/router_integration.rs
+assertion_line: 333
 expression: body
 ---
 <dialog id="body_modal" class="modal">
@@ -18,7 +19,7 @@ expression: body
     </button>
 
     
-    <form id="modal_form" hx-on::after-request="if(event.detail.successful) document.getElementById('body_modal').close()" 
+    <form id="modal_form" hx-on::after-request="if(event.detail.successful && event.detail.elt === event.currentTarget) document.getElementById('body_modal').close()" 
 hx-post="/knowledge-entity"
 hx-target="#knowledge_pane"
 hx-swap="outerHTML"