Missing ARIA label for shadow links

diff --git a/ts/WoltLabSuite/Core/Ui/Mobile.ts b/ts/WoltLabSuite/Core/Ui/Mobile.ts
index 4d881acb17622cda6a9cc5942d347f110f1c5c71..3a7bb040fbf995be02315c1436f6b68203e09d36 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/Mobile.ts
+++ b/ts/WoltLabSuite/Core/Ui/Mobile.ts
@@ -9,6 +9,7 @@
 
 import * as Core from "../Core";
 import DomChangeListener from "../Dom/Change/Listener";
+import DomUtil from "../Dom/Util";
 import * as Environment from "../Environment";
 import * as UiAlignment from "./Alignment";
 import UiCloseOverlay from "./CloseOverlay";
@@ -391,6 +392,7 @@ export function rebuildShadow(elements: HTMLElement[] | HTMLCollection, linkSele
         shadow = document.createElement("a");
         shadow.className = "mobileLinkShadow";
         shadow.href = link.href;
+        shadow.setAttribute("aria-labelledby", DomUtil.identify(link));
         parent.appendChild(shadow);
         parent.classList.add("mobileLinkShadowContainer");
       }

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Mobile.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Mobile.js
index 956570bd027368fff8d3a94c073004802e1feec6..2b67e2920b41840d05bda4edc95a0fcd5ba4d695 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Mobile.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Mobile.js
@@ -6,12 +6,13 @@
  * @license  GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
  * @module  WoltLabSuite/Core/Ui/Mobile
  */
-define(["require", "exports", "tslib", "../Core", "../Dom/Change/Listener", "../Environment", "./Alignment", "./CloseOverlay", "./Dropdown/Reusable", "./Page/Menu/Main", "./Page/Menu/User", "./Screen"], function (require, exports, tslib_1, Core, Listener_1, Environment, UiAlignment, CloseOverlay_1, UiDropdownReusable, Main_1, User_1, UiScreen) {
+define(["require", "exports", "tslib", "../Core", "../Dom/Change/Listener", "../Dom/Util", "../Environment", "./Alignment", "./CloseOverlay", "./Dropdown/Reusable", "./Page/Menu/Main", "./Page/Menu/User", "./Screen"], function (require, exports, tslib_1, Core, Listener_1, Util_1, Environment, UiAlignment, CloseOverlay_1, UiDropdownReusable, Main_1, User_1, UiScreen) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.removeShadow = exports.rebuildShadow = exports.disableShadow = exports.disable = exports.enableShadow = exports.enable = exports.setup = void 0;
     Core = (0, tslib_1.__importStar)(Core);
     Listener_1 = (0, tslib_1.__importDefault)(Listener_1);
+    Util_1 = (0, tslib_1.__importDefault)(Util_1);
     Environment = (0, tslib_1.__importStar)(Environment);
     UiAlignment = (0, tslib_1.__importStar)(UiAlignment);
     CloseOverlay_1 = (0, tslib_1.__importDefault)(CloseOverlay_1);
@@ -335,6 +336,7 @@ define(["require", "exports", "tslib", "../Core", "../Dom/Change/Listener", "../
                     shadow = document.createElement("a");
                     shadow.className = "mobileLinkShadow";
                     shadow.href = link.href;
+                    shadow.setAttribute("aria-labelledby", Util_1.default.identify(link));
                     parent.appendChild(shadow);
                     parent.classList.add("mobileLinkShadowContainer");
                 }