Skip to content

Commit

Permalink
[BUGFIX] Make user avatar buttons accessible via keyboard
Browse files Browse the repository at this point in the history
Both "clear" and "add" buttons for the backend user avatar selection
are currently not accessible via keyboard. In order to solve this
accessibility issue, both buttons have been converted from links to
html buttons to trigger the onclick handler when using the keyboard.

Resolves: #90293
Releases: master, 9.5
Change-Id: I263a282a4bee33abdb88f9850d230a453365b7ab
Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/63221
Tested-by: TYPO3com <noreply@typo3.com>
Tested-by: Benni Mack <benni@typo3.org>
Reviewed-by: Benni Mack <benni@typo3.org>
  • Loading branch information
eliashaeussler authored and bmack committed Feb 15, 2020
1 parent cf88a5a commit d019a58
Showing 1 changed file with 5 additions and 4 deletions.
Expand Up @@ -640,16 +640,17 @@ protected function renderUserSetup()
$iconFactory = GeneralUtility::makeInstance(IconFactory::class);
if ($avatarFileUid) {
$html .=
'<a id="clear_button_' . htmlspecialchars($fieldName) . '" '
'<button type="button" id="clear_button_' . htmlspecialchars($fieldName) . '" aria-label="' . htmlspecialchars($this->getLanguageService()->getLL('avatar.clear')) . '" '
. 'onclick="clearExistingImage(); return false;" class="btn btn-default">'
. $iconFactory->getIcon('actions-delete', Icon::SIZE_SMALL)
. '</a>';
. '</button>';
}
$html .=
'<a id="add_button_' . htmlspecialchars($fieldName) . '" class="btn btn-default btn-add-avatar"'
'<button type="button" id="add_button_' . htmlspecialchars($fieldName) . '" class="btn btn-default btn-add-avatar"'
. ' aria-label="' . htmlspecialchars($this->getLanguageService()->getLL('avatar.openFileBrowser')) . '"'
. ' onclick="openFileBrowser();return false;">'
. $iconFactory->getIcon('actions-insert-record', Icon::SIZE_SMALL)
. '</a></div>';
. '</button></div>';

$this->addAvatarButtonJs($fieldName);
break;
Expand Down

0 comments on commit d019a58

Please sign in to comment.