From 0f152ffb23555343a4e61038c4cf186fb4da3cfd Mon Sep 17 00:00:00 2001 From: =?utf8?q?Tim=20D=C3=BCsterhus?= Date: Thu, 11 Mar 2021 10:53:41 +0100 Subject: [PATCH] Fix clear button behavior in Date/Picker.ts Before the rewrite to TypeScript both buttons used the same variable name (`button`). Apparently during the rewrite they have been mixed up. Use a clear variable name for each to fix the issue. see 9a11d3a3b9959aea13a700fa4b32ec35bdc064f0 Fixes #4061 --- ts/WoltLabSuite/Core/Date/Picker.ts | 40 +++++++++---------- .../files/js/WoltLabSuite/Core/Date/Picker.js | 38 +++++++++--------- 2 files changed, 39 insertions(+), 39 deletions(-) diff --git a/ts/WoltLabSuite/Core/Date/Picker.ts b/ts/WoltLabSuite/Core/Date/Picker.ts index b593e9c16c..0d7384b448 100644 --- a/ts/WoltLabSuite/Core/Date/Picker.ts +++ b/ts/WoltLabSuite/Core/Date/Picker.ts @@ -771,39 +771,39 @@ const DatePicker = { const container = document.createElement("div"); container.className = "inputAddon"; - clearButton = document.createElement("a"); - - clearButton.className = "inputSuffix button jsTooltip"; - clearButton.href = "#"; - clearButton.setAttribute("role", "button"); - clearButton.tabIndex = 0; - clearButton.title = Language.get("wcf.date.datePicker"); - clearButton.setAttribute("aria-label", Language.get("wcf.date.datePicker")); - clearButton.setAttribute("aria-haspopup", "true"); - clearButton.setAttribute("aria-expanded", "false"); - clearButton.addEventListener("click", open); - container.appendChild(clearButton); + const openButton = document.createElement("a"); + + openButton.className = "inputSuffix button jsTooltip"; + openButton.href = "#"; + openButton.setAttribute("role", "button"); + openButton.tabIndex = 0; + openButton.title = Language.get("wcf.date.datePicker"); + openButton.setAttribute("aria-label", Language.get("wcf.date.datePicker")); + openButton.setAttribute("aria-haspopup", "true"); + openButton.setAttribute("aria-expanded", "false"); + openButton.addEventListener("click", open); + container.appendChild(openButton); let icon = document.createElement("span"); icon.className = "icon icon16 fa-calendar"; - clearButton.appendChild(icon); + openButton.appendChild(icon); element.parentNode!.insertBefore(container, element); - container.insertBefore(element, clearButton); + container.insertBefore(element, openButton); if (!disableClear) { - const button = document.createElement("a"); - button.className = "inputSuffix button"; - button.addEventListener("click", () => this.clear(element)); + clearButton = document.createElement("a"); + clearButton.className = "inputSuffix button"; + clearButton.addEventListener("click", () => this.clear(element)); if (isEmpty) { - button.style.setProperty("visibility", "hidden", ""); + clearButton.style.setProperty("visibility", "hidden", ""); } - container.appendChild(button); + container.appendChild(clearButton); icon = document.createElement("span"); icon.className = "icon icon16 fa-times"; - button.appendChild(icon); + clearButton.appendChild(icon); } } diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Date/Picker.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Date/Picker.js index 2e09cb5133..ba1f6d289a 100644 --- a/wcfsetup/install/files/js/WoltLabSuite/Core/Date/Picker.js +++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Date/Picker.js @@ -642,33 +642,33 @@ define(["require", "exports", "tslib", "../Core", "./Util", "../Dom/Change/Liste // create input addon const container = document.createElement("div"); container.className = "inputAddon"; - clearButton = document.createElement("a"); - clearButton.className = "inputSuffix button jsTooltip"; - clearButton.href = "#"; - clearButton.setAttribute("role", "button"); - clearButton.tabIndex = 0; - clearButton.title = Language.get("wcf.date.datePicker"); - clearButton.setAttribute("aria-label", Language.get("wcf.date.datePicker")); - clearButton.setAttribute("aria-haspopup", "true"); - clearButton.setAttribute("aria-expanded", "false"); - clearButton.addEventListener("click", open); - container.appendChild(clearButton); + const openButton = document.createElement("a"); + openButton.className = "inputSuffix button jsTooltip"; + openButton.href = "#"; + openButton.setAttribute("role", "button"); + openButton.tabIndex = 0; + openButton.title = Language.get("wcf.date.datePicker"); + openButton.setAttribute("aria-label", Language.get("wcf.date.datePicker")); + openButton.setAttribute("aria-haspopup", "true"); + openButton.setAttribute("aria-expanded", "false"); + openButton.addEventListener("click", open); + container.appendChild(openButton); let icon = document.createElement("span"); icon.className = "icon icon16 fa-calendar"; - clearButton.appendChild(icon); + openButton.appendChild(icon); element.parentNode.insertBefore(container, element); - container.insertBefore(element, clearButton); + container.insertBefore(element, openButton); if (!disableClear) { - const button = document.createElement("a"); - button.className = "inputSuffix button"; - button.addEventListener("click", () => this.clear(element)); + clearButton = document.createElement("a"); + clearButton.className = "inputSuffix button"; + clearButton.addEventListener("click", () => this.clear(element)); if (isEmpty) { - button.style.setProperty("visibility", "hidden", ""); + clearButton.style.setProperty("visibility", "hidden", ""); } - container.appendChild(button); + container.appendChild(clearButton); icon = document.createElement("span"); icon.className = "icon icon16 fa-times"; - button.appendChild(icon); + clearButton.appendChild(icon); } } // check if the date input has one of the following classes set otherwise default to 'short' -- 2.20.1