Fix the detection of dynamically added user consent buttons

See https://www.woltlab.com/community/thread/302467-display-all-external-content-button-does-not-work-after-erroneous-field-message/

diff --git a/ts/WoltLabSuite/Core/Ui/Message/UserConsent.ts b/ts/WoltLabSuite/Core/Ui/Message/UserConsent.ts
index 65ca0ef197f2011346fef833d4f6c956ac3abd77..bbc2aa1ab9da793c2f14270caafc2935d6002b19 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/Message/UserConsent.ts
+++ b/ts/WoltLabSuite/Core/Ui/Message/UserConsent.ts
@@ -6,6 +6,7 @@
  * @license     GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
  */
 
+import { wheneverFirstSeen } from "WoltLabSuite/Core/Helper/Selector";
 import * as Ajax from "../../Ajax";
 import * as Core from "../../Core";
 import DomChangeListener from "../../Dom/Change/Listener";
@@ -14,7 +15,6 @@ import User from "../../User";
 
 class UserConsent {
   private enableAll = false;
-  private readonly knownButtons = new WeakSet();
 
   constructor() {
     if (window.sessionStorage.getItem(`${Core.getStoragePrefix()}user-consent`) === "all") {
@@ -30,12 +30,8 @@ class UserConsent {
     if (this.enableAll) {
       this.enableAllExternalMedia();
     } else {
-      document.querySelectorAll(".jsButtonMessageUserConsentEnable").forEach((button: HTMLAnchorElement) => {
-        if (!this.knownButtons.has(button)) {
-          this.knownButtons.add(button);
-
-          button.addEventListener("click", (ev) => this.click(ev));
-        }
+      wheneverFirstSeen(".jsButtonMessageUserConsentEnable", (button) => {
+        button.addEventListener("click", (event) => this.click(event));
       });
     }
   }

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Message/UserConsent.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Message/UserConsent.js
index 73f24d8fc95dd1a84239f24d5e2c4606c494f77f..bd7b95a1d94bd9cbb3562f3259e6d1259d4316eb 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Message/UserConsent.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Message/UserConsent.js
@@ -5,7 +5,7 @@
  * @copyright   2001-2020 WoltLab GmbH
  * @license     GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
  */
-define(["require", "exports", "tslib", "../../Ajax", "../../Core", "../../Dom/Change/Listener", "../../Dom/Util", "../../User"], function (require, exports, tslib_1, Ajax, Core, Listener_1, Util_1, User_1) {
+define(["require", "exports", "tslib", "WoltLabSuite/Core/Helper/Selector", "../../Ajax", "../../Core", "../../Dom/Change/Listener", "../../Dom/Util", "../../User"], function (require, exports, tslib_1, Selector_1, Ajax, Core, Listener_1, Util_1, User_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.init = void 0;
@@ -16,7 +16,6 @@ define(["require", "exports", "tslib", "../../Ajax", "../../Core", "../../Dom/Ch
     User_1 = tslib_1.__importDefault(User_1);
     class UserConsent {
         enableAll = false;
-        knownButtons = new WeakSet();
         constructor() {
             if (window.sessionStorage.getItem(`${Core.getStoragePrefix()}user-consent`) === "all") {
                 this.enableAll = true;
@@ -29,11 +28,8 @@ define(["require", "exports", "tslib", "../../Ajax", "../../Core", "../../Dom/Ch
                 this.enableAllExternalMedia();
             }
             else {
-                document.querySelectorAll(".jsButtonMessageUserConsentEnable").forEach((button) => {
-                    if (!this.knownButtons.has(button)) {
-                        this.knownButtons.add(button);
-                        button.addEventListener("click", (ev) => this.click(ev));
-                    }
+                (0, Selector_1.wheneverFirstSeen)(".jsButtonMessageUserConsentEnable", (button) => {
+                    button.addEventListener("click", (event) => this.click(event));
                 });
             }
         }