Improve handling of the `validate` event.

diff --git a/ts/WoltLabSuite/Core/Element/woltlab-core-dialog.ts b/ts/WoltLabSuite/Core/Element/woltlab-core-dialog.ts
index 67f33e2caab0a4cc86d022aa4da3ed9e409ddb95..01aeca053703e8687309380811c1d69698ec263f 100644 (file)
--- a/ts/WoltLabSuite/Core/Element/woltlab-core-dialog.ts
+++ b/ts/WoltLabSuite/Core/Element/woltlab-core-dialog.ts
@@ -173,8 +173,10 @@ export class WoltlabCoreDialogElement extends HTMLElement {
       });
       this.dispatchEvent(evt);
 
+      // Canceling this event is interpreted as a form validation failure.
       if (evt.defaultPrevented) {
         event.preventDefault();
+        return;
       }
 
       if (evt.detail.length > 0) {
@@ -203,8 +205,9 @@ export class WoltlabCoreDialogElement extends HTMLElement {
           }
         });
       }
-
-      if (!this.#shouldClose()) {
+      // There were no validation handlers to process, so validation has passed.
+      // By default the browser will close the dialog unless the submit event’s default action gets prevented.
+      else if (!this.#shouldClose()) {
         // Prevent the browser from closing the dialog
         event.preventDefault();
         // but dispatch the `primary` event
@@ -298,8 +301,7 @@ export class WoltlabCoreDialogElement extends HTMLElement {
 
       if (this.#shouldClose()) {
         this.#detachDialog();
-      }
-      else {
+      } else {
         // Prevent the browser from closing the dialog.
         event.preventDefault();
       }

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Element/woltlab-core-dialog.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Element/woltlab-core-dialog.js
index 1f3b3f2937e2b580dfe70c1da58c3d6241ede83b..632bd30e3b46123e2cceeaa0b34b98817948459c 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Element/woltlab-core-dialog.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Element/woltlab-core-dialog.js
@@ -124,8 +124,10 @@ define(["require", "exports", "tslib", "../Dom/Util", "../Helper/PageOverlay", "
                     detail: callbacks,
                 });
                 this.dispatchEvent(evt);
+                // Canceling this event is interpreted as a form validation failure.
                 if (evt.defaultPrevented) {
                     event.preventDefault();
+                    return;
                 }
                 if (evt.detail.length > 0) {
                     // DOM events cannot wait for async functions. We must
@@ -149,7 +151,9 @@ define(["require", "exports", "tslib", "../Dom/Util", "../Helper/PageOverlay", "
                         }
                     });
                 }
-                if (!this.#shouldClose()) {
+                // There were no validation handlers to process, so validation has passed.
+                // By default the browser will close the dialog unless the submit event’s default action gets prevented.
+                else if (!this.#shouldClose()) {
                     // Prevent the browser from closing the dialog
                     event.preventDefault();
                     // but dispatch the `primary` event