From aa125b661a3100c95adfbcdd5330041f6dd6bd1c Mon Sep 17 00:00:00 2001
From: Christian Rath-Ulrich <christian@rath-ulrich.de>
Date: Thu, 23 Nov 2023 09:24:49 +0100
Subject: [PATCH] [TASK] Add aria-label to datepicker button
To make the functionality of the button that opens the datepicker clear
to screenreaders, an aria-label is added to the button.
Resolves: #102470
Releases: main, 12.4
Change-Id: I3c16c887cd148101fe225d65ea95a6f88dd1518b
Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/83292
Reviewed-by: Christian Kuhn <lolli@schwarzbu.ch>
Tested-by: core-ci <typo3@b13.com>
Tested-by: Christian Kuhn <lolli@schwarzbu.ch>
---
typo3/sysext/backend/Classes/Form/Element/DatetimeElement.php | 4 +++-
.../sysext/core/Resources/Private/Language/locallang_core.xlf | 3 +++
2 files changed, 6 insertions(+), 1 deletion(-)
diff --git a/typo3/sysext/backend/Classes/Form/Element/DatetimeElement.php b/typo3/sysext/backend/Classes/Form/Element/DatetimeElement.php
index 78af2def214e..28607ca8a598 100644
--- a/typo3/sysext/backend/Classes/Form/Element/DatetimeElement.php
+++ b/typo3/sysext/backend/Classes/Form/Element/DatetimeElement.php
@@ -194,6 +194,8 @@ class DatetimeElement extends AbstractFormElement
$fieldControlHtml = $fieldControlResult['html'];
$resultArray = $this->mergeChildReturnIntoExistingResult($resultArray, $fieldControlResult, false);
+ $buttonAriaLabelEscaped = htmlspecialchars($languageService->sL('LLL:EXT:core/Resources/Private/Language/locallang_core.xlf:labels.datepicker.label'));
+
$expansionHtml = [];
$expansionHtml[] = '<div class="form-control-wrap" style="max-width: ' . $width . 'px">';
$expansionHtml[] = '<div class="form-wizards-wrap">';
@@ -201,7 +203,7 @@ class DatetimeElement extends AbstractFormElement
$expansionHtml[] = '<div class="input-group">';
$expansionHtml[] = '<input type="text" ' . GeneralUtility::implodeAttributes($attributes, true) . ' />';
$expansionHtml[] = '<input type="hidden" name="' . $itemName . '" value="' . htmlspecialchars((string)$itemValue) . '" />';
- $expansionHtml[] = '<button class="btn btn-default" type="button" data-global-event="click" data-action-focus="#' . $attributes['id'] . '">';
+ $expansionHtml[] = '<button class="btn btn-default" aria-label="' . $buttonAriaLabelEscaped . '" type="button" data-global-event="click" data-action-focus="#' . $attributes['id'] . '">';
$expansionHtml[] = $this->iconFactory->getIcon('actions-edit-pick-date', Icon::SIZE_SMALL)->render();
$expansionHtml[] = '</button>';
$expansionHtml[] = '</div>';
diff --git a/typo3/sysext/core/Resources/Private/Language/locallang_core.xlf b/typo3/sysext/core/Resources/Private/Language/locallang_core.xlf
index 0f1d59c7d712..c341c2cc605b 100644
--- a/typo3/sysext/core/Resources/Private/Language/locallang_core.xlf
+++ b/typo3/sysext/core/Resources/Private/Language/locallang_core.xlf
@@ -3,6 +3,9 @@
<file source-language="en" datatype="plaintext" original="EXT:core/Resources/Private/Language/locallang_core.xlf" date="2011-10-17T20:22:33Z" product-name="lang">
<header/>
<body>
+ <trans-unit id="labels.datepicker.label" resname="labels.datepicker.label">
+ <source>Open date picker</source>
+ </trans-unit>
<trans-unit id="labels.openInNewWindow" resname="labels.openInNewWindow">
<source>Open in new window</source>
</trans-unit>
--
GitLab