From e9ffefb4d0db61bf8e12b3824c6515ac16fe3812 Mon Sep 17 00:00:00 2001 From: Alexander Ebert Date: Sat, 14 May 2022 14:30:38 +0200 Subject: [PATCH] Incorrect handling of the return focus Related https://www.woltlab.com/community/thread/295562-inhalte-k%C3%B6nnen-doppelt-gemeldet-werden/ --- ts/WoltLabSuite/Core/Ui/Dialog.ts | 15 ++++++++++++++- ts/WoltLabSuite/Core/Ui/Mobile.ts | 1 + .../files/js/WoltLabSuite/Core/Ui/Dialog.js | 15 ++++++++++++++- .../files/js/WoltLabSuite/Core/Ui/Mobile.js | 1 + 4 files changed, 30 insertions(+), 2 deletions(-) diff --git a/ts/WoltLabSuite/Core/Ui/Dialog.ts b/ts/WoltLabSuite/Core/Ui/Dialog.ts index ee349cd6a6..2be8a133bc 100644 --- a/ts/WoltLabSuite/Core/Ui/Dialog.ts +++ b/ts/WoltLabSuite/Core/Ui/Dialog.ts @@ -783,7 +783,20 @@ const UiDialog = { throw new Error("Expected a valid dialog id, '" + id + "' does not match any active dialog."); } - data.focusTrap.deactivate(); + try { + data.focusTrap.deactivate(); + } catch (e) { + // The focus trap is unable to return the focus if + // the origin is no longer focusable. This can happen + // when the source is removed or is not longer visible, + // the latter typically caused by collapsing menus + // on mobile devices. + const ignoreErrorMessage = + "Your focus-trap must have at least one container with at least one tabbable node in it at all times"; + if (e.message !== ignoreErrorMessage) { + throw e; + } + } data.dialog.setAttribute("aria-hidden", "true"); diff --git a/ts/WoltLabSuite/Core/Ui/Mobile.ts b/ts/WoltLabSuite/Core/Ui/Mobile.ts index 40c05c5c13..89c363d0ac 100644 --- a/ts/WoltLabSuite/Core/Ui/Mobile.ts +++ b/ts/WoltLabSuite/Core/Ui/Mobile.ts @@ -266,6 +266,7 @@ function toggleMobileNavigation(message: HTMLElement, quickOptions: HTMLElement, return false; }, + setReturnFocus: quickOptions, }); _focusTrap.activate(); } diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Dialog.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Dialog.js index 65c330e1fd..a3d6bb78c3 100644 --- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Dialog.js +++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Dialog.js @@ -644,7 +644,20 @@ define(["require", "exports", "tslib", "../Core", "../Dom/Change/Listener", "./S if (data === undefined) { throw new Error("Expected a valid dialog id, '" + id + "' does not match any active dialog."); } - data.focusTrap.deactivate(); + try { + data.focusTrap.deactivate(); + } + catch (e) { + // The focus trap is unable to return the focus if + // the origin is no longer focusable. This can happen + // when the source is removed or is not longer visible, + // the latter typically caused by collapsing menus + // on mobile devices. + const ignoreErrorMessage = "Your focus-trap must have at least one container with at least one tabbable node in it at all times"; + if (e.message !== ignoreErrorMessage) { + throw e; + } + } data.dialog.setAttribute("aria-hidden", "true"); // Move the keyboard focus away from a now hidden element. const activeElement = document.activeElement; diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Mobile.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Mobile.js index 0631e43394..ade8133efc 100644 --- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Mobile.js +++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Mobile.js @@ -232,6 +232,7 @@ define(["require", "exports", "tslib", "focus-trap", "../Core", "../Dom/Change/L toggleMobileNavigation(message, quickOptions, navigation); return false; }, + setReturnFocus: quickOptions, }); _focusTrap.activate(); } -- 2.20.1