From a323340bb98dc1cc7548525e967d5d747fa2fdf0 Mon Sep 17 00:00:00 2001 From: MelvinBot Date: Tue, 24 Feb 2026 09:05:32 +0000 Subject: [PATCH 01/17] Add descriptive accessibility labels to non-descriptive buttons Buttons like 'Learn more', 'Copy', and 'Download' were announced without sufficient context by screen readers, violating WCAG 2.4.6. - Add accessibilityLabel to SaveWithExpensifyButton (subscription page) - Add accessibilityLabel to company card promotion banner button - Fix PressableWithDelayToggle to fall back to text prop when tooltip is empty - Provide descriptive tooltipText for 2FA Copy/Download buttons Co-authored-by: Aimane Chnaif --- src/components/Pressable/PressableWithDelayToggle.tsx | 2 +- .../settings/Security/TwoFactorAuth/CopyCodesPage.tsx | 8 ++++---- src/pages/settings/Security/TwoFactorAuth/VerifyPage.tsx | 4 ++-- .../SubscriptionPlan/SaveWithExpensifyButton/index.tsx | 1 + .../WorkspaceCompanyCardExpensifyCardPromotionBanner.tsx | 1 + 5 files changed, 9 insertions(+), 7 deletions(-) diff --git a/src/components/Pressable/PressableWithDelayToggle.tsx b/src/components/Pressable/PressableWithDelayToggle.tsx index d1bb456859acb..735189179117a 100644 --- a/src/components/Pressable/PressableWithDelayToggle.tsx +++ b/src/components/Pressable/PressableWithDelayToggle.tsx @@ -128,7 +128,7 @@ function PressableWithDelayToggle({ // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-assignment ref={ref as any} onPress={updatePressState} - accessibilityLabel={tooltipTexts} + accessibilityLabel={tooltipTexts || (!isActive && textChecked ? textChecked : text)} suppressHighlighting={inline ? true : undefined} accessibilityRole={accessibilityRole} > diff --git a/src/pages/settings/Security/TwoFactorAuth/CopyCodesPage.tsx b/src/pages/settings/Security/TwoFactorAuth/CopyCodesPage.tsx index 9a15de824a638..9ea50e0ecb2c7 100644 --- a/src/pages/settings/Security/TwoFactorAuth/CopyCodesPage.tsx +++ b/src/pages/settings/Security/TwoFactorAuth/CopyCodesPage.tsx @@ -126,8 +126,8 @@ function CopyCodesPage({route}: TwoFactorAuthPageProps) { styles={[styles.button, styles.buttonMedium, styles.twoFactorAuthCodesButton]} textStyles={[styles.buttonMediumText]} accessible={false} - tooltipText="" - tooltipTextChecked="" + tooltipText={translate('twoFactorAuth.copy')} + tooltipTextChecked={translate('common.copied')} /> diff --git a/src/pages/settings/Security/TwoFactorAuth/VerifyPage.tsx b/src/pages/settings/Security/TwoFactorAuth/VerifyPage.tsx index b7cae041a5c90..458f66703cd5f 100644 --- a/src/pages/settings/Security/TwoFactorAuth/VerifyPage.tsx +++ b/src/pages/settings/Security/TwoFactorAuth/VerifyPage.tsx @@ -122,8 +122,8 @@ function VerifyPage({route}: VerifyPageProps) { Clipboard.setString(account?.twoFactorAuthSecretKey ?? '')} diff --git a/src/pages/settings/Subscription/SubscriptionPlan/SaveWithExpensifyButton/index.tsx b/src/pages/settings/Subscription/SubscriptionPlan/SaveWithExpensifyButton/index.tsx index 7a015ab7dca6c..dc330320c0a7e 100644 --- a/src/pages/settings/Subscription/SubscriptionPlan/SaveWithExpensifyButton/index.tsx +++ b/src/pages/settings/Subscription/SubscriptionPlan/SaveWithExpensifyButton/index.tsx @@ -15,6 +15,7 @@ function SaveWithExpensifyButton() {