From: Alexander Ebert <ebert@woltlab.com>
Date: Mon, 21 Aug 2023 08:50:38 +0000 (+0200)
Subject: Prevent updates to the dialog position during initialization
X-Git-Tag: 6.0.0_Beta_2~13
X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=185ad86aff62dea3169660d03aafb1da4819ce4e;p=GitHub%2FWoltLab%2FWCF.git

Prevent updates to the dialog position during initialization

The initial value only needs to be set once, all other cases are already handled by the `ResizeObserver`, causing race conditions.

See https://www.woltlab.com/community/thread/301273-the-position-of-the-edit-thread-menu-is-not-always-centred/
---

diff --git a/ts/WoltLabSuite/Core/Ui/Dialog.ts b/ts/WoltLabSuite/Core/Ui/Dialog.ts
index ace02fe8d2..3c265d6855 100644
--- a/ts/WoltLabSuite/Core/Ui/Dialog.ts
+++ b/ts/WoltLabSuite/Core/Ui/Dialog.ts
@@ -627,8 +627,10 @@ const UiDialog = {
     const maximumHeight = window.innerHeight * (_dialogFullHeight ? 1 : 0.8) - unavailableHeight;
     contentContainer.style.setProperty("max-height", `${~~maximumHeight}px`, "");
 
-    const offset = Math.floor(data.dialog.getBoundingClientRect().width / 2);
-    data.dialog.style.setProperty("--translate-x", `-${offset}px`);
+    if (data.dialog.style.getPropertyValue("--translate-x") === "") {
+      const offset = Math.floor(data.dialog.getBoundingClientRect().width / 2);
+      data.dialog.style.setProperty("--translate-x", `-${offset}px`);
+    }
 
     const callbackObject = _dialogToObject.get(id);
     //noinspection JSUnresolvedVariable
diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Dialog.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Dialog.js
index c481bd3c2a..5320f5b9ae 100644
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Dialog.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Dialog.js
@@ -516,8 +516,10 @@ define(["require", "exports", "tslib", "../Core", "../Dom/Change/Listener", "./S
             unavailableHeight += Util_1.default.outerHeight(data.header);
             const maximumHeight = window.innerHeight * (_dialogFullHeight ? 1 : 0.8) - unavailableHeight;
             contentContainer.style.setProperty("max-height", `${~~maximumHeight}px`, "");
-            const offset = Math.floor(data.dialog.getBoundingClientRect().width / 2);
-            data.dialog.style.setProperty("--translate-x", `-${offset}px`);
+            if (data.dialog.style.getPropertyValue("--translate-x") === "") {
+                const offset = Math.floor(data.dialog.getBoundingClientRect().width / 2);
+                data.dialog.style.setProperty("--translate-x", `-${offset}px`);
+            }
             const callbackObject = _dialogToObject.get(id);
             //noinspection JSUnresolvedVariable
             if (callbackObject !== undefined && typeof callbackObject._dialogSubmit === "function") {