From 9f9709aa5ebf262c9ca937349d156c10d909225d Mon Sep 17 00:00:00 2001 From: Andre Klapper Date: Sun, 1 Jun 2025 13:36:40 +0200 Subject: [PATCH] a11y: Set project workboard button tooltips as aria-label Summary: Dropdown elements should have associated labels per https://www.w3.org/WAI/tutorials/forms/labels/ Setting the JS tooltips for the "Manage" and "Fullscreen" dropdowns also as their `aria-label` is clearly more accessible than exposing no hints at all. Regarding the implemention, * `$action->getName()` would return null as no name is set to be rendered in the UI next to the icon. * introducing `$action->getTooltip()` in `PHUIListItemView` would also return null as this tooltip is created via JavaScript in `PhabricatorProjectBoardViewController` via `PHUIListItemView()->setMetadata()`. Thus do the ugly dance by parsing that very metadata for the sake of more accessibility on project workboards. Ref T16072 Test Plan: Go to a project workboard, inspect the HTML of the two buttons in the upper right corner for "Manage" and "Fullscreen", see an `aria-label` in the HTML code, have happier screenreader users who appreciate links which have a discernible name. Reviewers: O1 Blessed Committers, chris Reviewed By: O1 Blessed Committers, chris Subscribers: tobiaswiese, valerio.bozzolan, Matthew, Cigaryno Maniphest Tasks: T16072 Differential Revision: https://we.phorge.it/D26050 --- src/view/phui/PHUICrumbsView.php | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/src/view/phui/PHUICrumbsView.php b/src/view/phui/PHUICrumbsView.php index 8430c07d92..bd43898bbd 100644 --- a/src/view/phui/PHUICrumbsView.php +++ b/src/view/phui/PHUICrumbsView.php @@ -106,12 +106,19 @@ final class PHUICrumbsView extends AphrontView { $action_classes[] = 'phui-crumbs-action-disabled'; } + $aria_label = null; + $metadata = $action->getMetadata(); + if ($metadata && isset($metadata['tip'])) { + $aria_label = $metadata['tip']; + } + $actions[] = javelin_tag( 'a', array( 'href' => $action->getHref(), 'class' => implode(' ', $action_classes), 'sigil' => implode(' ', $action_sigils), + 'aria-label' => $aria_label, 'style' => $action->getStyle(), 'meta' => $action->getMetadata(), ), -- 2.51.2