Prevent screen reader from reading dropdown options twice

Close #7125 Co-authored-by: bir <bir@tutao.de>
tutao · Nov 12, 2024 · 4d25b43 · 4d25b43
1 parent d10c131
commit 4d25b43
Showing 1 changed file with 9 additions and 1 deletion.
diff --git a/src/common/gui/base/buttons/RowButton.ts b/src/common/gui/base/buttons/RowButton.ts
@@ -28,7 +28,15 @@ export class RowButton implements Component<RowButtonAttrs> {
 		const color = attrs.selected ? theme.content_button_selected : theme.content_button
 		return m(BaseButton, {
 			label,
-			text: m(".plr-button.text-ellipsis", { style: { color } }, text),
+			text: m(
+				".plr-button.text-ellipsis",
+				{
+					style: { color },
+					// When the label doesn't match content, screen readers read both
+					ariaHidden: label !== text, // this prevents that
+				},
+				text,
+			),
 			role: attrs.role,
 			selected: attrs.selected,
 			icon: