diff --git a/.changeset/tidy-auth-accessibility.md b/.changeset/tidy-auth-accessibility.md new file mode 100644 index 00000000000..b40dcc20fbc --- /dev/null +++ b/.changeset/tidy-auth-accessibility.md @@ -0,0 +1,7 @@ +--- +'@clerk/ui': patch +'@clerk/localizations': minor +'@clerk/shared': minor +--- + +Localize icon-only social sign-in button names using `socialButtonsBlockButton` and exclude decorative provider icons from the accessibility tree. Add `formFieldAction__showPassword` and `formFieldAction__hidePassword` localization keys for password visibility controls, with translations for every supported locale and English fallback for older localization resources. diff --git a/integration/tests/last-authentication-strategy.test.ts b/integration/tests/last-authentication-strategy.test.ts index 194ca1c6a82..12e1e5fb545 100644 --- a/integration/tests/last-authentication-strategy.test.ts +++ b/integration/tests/last-authentication-strategy.test.ts @@ -86,7 +86,7 @@ testAgainstRunningApps({ withEnv: [appConfigs.envs.withEmailCodes] })( await expect(lastUsedBadge).toBeVisible(); await expect(lastUsedBadge).toHaveCount(1); - const btn = page.getByRole('button', { name: 'Last used Sign in with Google' }); + const btn = page.getByRole('button', { name: 'Last used Continue with Google' }); await expect(btn).toBeVisible(); // Ensure the last used social button has been pulled to the first row. @@ -108,7 +108,7 @@ testAgainstRunningApps({ withEnv: [appConfigs.envs.withEmailCodes] })( await expect(lastUsedBadge).toBeVisible(); await expect(lastUsedBadge).toHaveCount(1); - const btn = page.getByRole('button', { name: 'Last used Sign in with Google' }); + const btn = page.getByRole('button', { name: 'Last used Continue with Google' }); await expect(btn).toBeVisible(); // Ensure the last used social button has been pulled to the first row. diff --git a/packages/localizations/src/ar-SA.ts b/packages/localizations/src/ar-SA.ts index bae370e4160..bb22bba765c 100644 --- a/packages/localizations/src/ar-SA.ts +++ b/packages/localizations/src/ar-SA.ts @@ -955,6 +955,8 @@ export const arSA: LocalizationResource = { formButtonPrimary: 'متابعة', formButtonPrimary__verify: 'تحقق', formFieldAction__forgotPassword: 'نسيت كلمة المرور؟', + formFieldAction__hidePassword: 'إخفاء كلمة المرور', + formFieldAction__showPassword: 'إظهار كلمة المرور', formFieldError__matchingPasswords: 'كلمة المرور مطابقة', formFieldError__notMatchingPasswords: 'كلمة المرور لا تتطابق', formFieldError__verificationLinkExpired: 'صلاحية رمز التأكيد أنتهت. يرجى طلب رابط جديد', diff --git a/packages/localizations/src/be-BY.ts b/packages/localizations/src/be-BY.ts index fd61dffb722..1f8c02d1b06 100644 --- a/packages/localizations/src/be-BY.ts +++ b/packages/localizations/src/be-BY.ts @@ -956,6 +956,8 @@ export const beBY: LocalizationResource = { formButtonPrimary: 'Працягнуць', formButtonPrimary__verify: 'Праверыць', formFieldAction__forgotPassword: 'Забылі пароль?', + formFieldAction__hidePassword: 'Схаваць пароль', + formFieldAction__showPassword: 'Паказаць пароль', formFieldError__matchingPasswords: 'Паролі супадаюць.', formFieldError__notMatchingPasswords: 'Паролі не супадаюць.', formFieldError__verificationLinkExpired: 'Спасылка на верыфікацыю спампавала. Калі ласка, запытайце новую спасылку.', diff --git a/packages/localizations/src/bg-BG.ts b/packages/localizations/src/bg-BG.ts index 8bbf53b726d..e930180c2b9 100644 --- a/packages/localizations/src/bg-BG.ts +++ b/packages/localizations/src/bg-BG.ts @@ -957,6 +957,8 @@ export const bgBG: LocalizationResource = { formButtonPrimary: 'Продължи', formButtonPrimary__verify: 'Потвърди', formFieldAction__forgotPassword: 'Забравена парола?', + formFieldAction__hidePassword: 'Скриване на паролата', + formFieldAction__showPassword: 'Показване на паролата', formFieldError__matchingPasswords: 'Паролите съвпадат.', formFieldError__notMatchingPasswords: 'Паролите не съвпадат.', formFieldError__verificationLinkExpired: 'Линкът за потвърждение е изтекъл. Моля, заявете нов линк.', diff --git a/packages/localizations/src/bn-IN.ts b/packages/localizations/src/bn-IN.ts index 686f31ed8da..d4943caadb8 100644 --- a/packages/localizations/src/bn-IN.ts +++ b/packages/localizations/src/bn-IN.ts @@ -962,6 +962,8 @@ export const bnIN: LocalizationResource = { formButtonPrimary: 'চালিয়ে যান', formButtonPrimary__verify: 'যাচাই করুন', formFieldAction__forgotPassword: 'পাসওয়ার্ড ভুলে গেছেন?', + formFieldAction__hidePassword: 'পাসওয়ার্ড লুকান', + formFieldAction__showPassword: 'পাসওয়ার্ড দেখান', formFieldError__matchingPasswords: 'পাসওয়ার্ড মিলেছে।', formFieldError__notMatchingPasswords: 'পাসওয়ার্ড মিলে না।', formFieldError__verificationLinkExpired: 'যাচাইকরণ লিংকের মেয়াদ শেষ হয়েছে। দয়া করে একটি নতুন লিংক অনুরোধ করুন।', diff --git a/packages/localizations/src/ca-ES.ts b/packages/localizations/src/ca-ES.ts index 5f08487cd0c..b9631e0e7cb 100644 --- a/packages/localizations/src/ca-ES.ts +++ b/packages/localizations/src/ca-ES.ts @@ -963,6 +963,8 @@ export const caES: LocalizationResource = { formButtonPrimary: 'Continua', formButtonPrimary__verify: 'Verifica', formFieldAction__forgotPassword: 'Has oblidat la contrasenya?', + formFieldAction__hidePassword: 'Amaga la contrasenya', + formFieldAction__showPassword: 'Mostra la contrasenya', formFieldError__matchingPasswords: 'Les contrasenyes coincideixen.', formFieldError__notMatchingPasswords: 'Les contrasenyes no coincideixen.', formFieldError__verificationLinkExpired: "L'enllaç de verificació ha caducat. Si us plau, sol·licita un nou enllaç.", diff --git a/packages/localizations/src/cs-CZ.ts b/packages/localizations/src/cs-CZ.ts index d5df10b95ed..d06b5ac9101 100644 --- a/packages/localizations/src/cs-CZ.ts +++ b/packages/localizations/src/cs-CZ.ts @@ -960,6 +960,8 @@ export const csCZ: LocalizationResource = { formButtonPrimary: 'Pokračovat', formButtonPrimary__verify: 'Ověřit', formFieldAction__forgotPassword: 'Zapomněli jste heslo?', + formFieldAction__hidePassword: 'Skrýt heslo', + formFieldAction__showPassword: 'Zobrazit heslo', formFieldError__matchingPasswords: 'Hesla se shodují.', formFieldError__notMatchingPasswords: 'Hesla se neshodují.', formFieldError__verificationLinkExpired: 'Ověřovací odkaz vypršel. Prosím, požádejte o nový odkaz.', diff --git a/packages/localizations/src/da-DK.ts b/packages/localizations/src/da-DK.ts index 4dec7aca1c2..c943ea9c802 100644 --- a/packages/localizations/src/da-DK.ts +++ b/packages/localizations/src/da-DK.ts @@ -955,6 +955,8 @@ export const daDK: LocalizationResource = { formButtonPrimary: 'Fortsæt', formButtonPrimary__verify: 'Verificer', formFieldAction__forgotPassword: 'Glemt adgangskode?', + formFieldAction__hidePassword: 'Skjul adgangskode', + formFieldAction__showPassword: 'Vis adgangskode', formFieldError__matchingPasswords: 'Adgangskoderne matcher.', formFieldError__notMatchingPasswords: 'Adgangskoderne matcher ikke.', formFieldError__verificationLinkExpired: 'Bekræftelseslinket er udløbet. Venligst anmod om et nyt link.', diff --git a/packages/localizations/src/de-DE.ts b/packages/localizations/src/de-DE.ts index adce063eade..efe77c56715 100644 --- a/packages/localizations/src/de-DE.ts +++ b/packages/localizations/src/de-DE.ts @@ -964,6 +964,8 @@ export const deDE: LocalizationResource = { formButtonPrimary: 'Fortsetzen', formButtonPrimary__verify: 'Verifizieren', formFieldAction__forgotPassword: 'Passwort vergessen?', + formFieldAction__hidePassword: 'Passwort verbergen', + formFieldAction__showPassword: 'Passwort anzeigen', formFieldError__matchingPasswords: 'Passwörter stimmen überein.', formFieldError__notMatchingPasswords: 'Passwörter stimmen nicht überein.', formFieldError__verificationLinkExpired: diff --git a/packages/localizations/src/el-GR.ts b/packages/localizations/src/el-GR.ts index 2a2afeabb01..973ca52f5c5 100644 --- a/packages/localizations/src/el-GR.ts +++ b/packages/localizations/src/el-GR.ts @@ -956,6 +956,8 @@ export const elGR: LocalizationResource = { formButtonPrimary: 'Συνέχεια', formButtonPrimary__verify: 'Επαλήθευση', formFieldAction__forgotPassword: 'Ξεχάσατε τον κωδικό;', + formFieldAction__hidePassword: 'Απόκρυψη κωδικού πρόσβασης', + formFieldAction__showPassword: 'Εμφάνιση κωδικού πρόσβασης', formFieldError__matchingPasswords: 'Οι κωδικοί ταιριάζουν.', formFieldError__notMatchingPasswords: 'Οι κωδικοί δεν ταιριάζουν.', formFieldError__verificationLinkExpired: 'Ο σύνδεσμος επαλήθευσης έληξε. Παρακαλώ ζητήστε νέο σύνδεσμο.', diff --git a/packages/localizations/src/en-GB.ts b/packages/localizations/src/en-GB.ts index e07a96bce7e..07bd9d181d5 100644 --- a/packages/localizations/src/en-GB.ts +++ b/packages/localizations/src/en-GB.ts @@ -955,6 +955,8 @@ export const enGB: LocalizationResource = { formButtonPrimary: 'Continue', formButtonPrimary__verify: 'Verify', formFieldAction__forgotPassword: 'Forgot password?', + formFieldAction__hidePassword: 'Hide password', + formFieldAction__showPassword: 'Show password', formFieldError__matchingPasswords: 'Passwords match.', formFieldError__notMatchingPasswords: "Passwords don't match.", formFieldError__verificationLinkExpired: 'The verification link expired. Please request a new link.', diff --git a/packages/localizations/src/en-US.ts b/packages/localizations/src/en-US.ts index 387aa8b15f7..39f6f9746dc 100644 --- a/packages/localizations/src/en-US.ts +++ b/packages/localizations/src/en-US.ts @@ -986,6 +986,8 @@ export const enUS: LocalizationResource = { formButtonPrimary: 'Continue', formButtonPrimary__verify: 'Verify', formFieldAction__forgotPassword: 'Forgot password?', + formFieldAction__hidePassword: 'Hide password', + formFieldAction__showPassword: 'Show password', formFieldError__matchingPasswords: 'Passwords match.', formFieldError__notMatchingPasswords: "Passwords don't match.", formFieldError__verificationLinkExpired: 'The verification link expired. Please request a new link.', diff --git a/packages/localizations/src/es-CR.ts b/packages/localizations/src/es-CR.ts index 3333de57e3f..0915ceebb4a 100644 --- a/packages/localizations/src/es-CR.ts +++ b/packages/localizations/src/es-CR.ts @@ -956,6 +956,8 @@ export const esCR: LocalizationResource = { formButtonPrimary: 'Continuar', formButtonPrimary__verify: 'Verificar', formFieldAction__forgotPassword: 'Has olvidado tu contraseña?', + formFieldAction__hidePassword: 'Ocultar contraseña', + formFieldAction__showPassword: 'Mostrar contraseña', formFieldError__matchingPasswords: 'Las contraseñas coinciden.', formFieldError__notMatchingPasswords: 'Las contraseñas no coinciden.', formFieldError__verificationLinkExpired: 'El enlace de verificación expiró. Por favor, vuelve a solicitarlo.', diff --git a/packages/localizations/src/es-ES.ts b/packages/localizations/src/es-ES.ts index 5318d7322a1..ea8efcf406e 100644 --- a/packages/localizations/src/es-ES.ts +++ b/packages/localizations/src/es-ES.ts @@ -962,6 +962,8 @@ export const esES: LocalizationResource = { formButtonPrimary: 'Continuar', formButtonPrimary__verify: 'Verificar', formFieldAction__forgotPassword: 'Has olvidado tu contraseña?', + formFieldAction__hidePassword: 'Ocultar contraseña', + formFieldAction__showPassword: 'Mostrar contraseña', formFieldError__matchingPasswords: 'Las contraseñas coinciden.', formFieldError__notMatchingPasswords: 'Las contraseñas no coinciden.', formFieldError__verificationLinkExpired: 'El enlace de verificación ha expirado. Por favor solicite uno nuevo.', diff --git a/packages/localizations/src/es-MX.ts b/packages/localizations/src/es-MX.ts index c0895676430..a7d9e1d7aa4 100644 --- a/packages/localizations/src/es-MX.ts +++ b/packages/localizations/src/es-MX.ts @@ -957,6 +957,8 @@ export const esMX: LocalizationResource = { formButtonPrimary: 'Continuar', formButtonPrimary__verify: 'Verificar', formFieldAction__forgotPassword: 'Has olvidado tu contraseña?', + formFieldAction__hidePassword: 'Ocultar contraseña', + formFieldAction__showPassword: 'Mostrar contraseña', formFieldError__matchingPasswords: 'Las contraseñas coinciden.', formFieldError__notMatchingPasswords: 'Las no contraseñas coinciden.', formFieldError__verificationLinkExpired: 'El link de verificación expiro. Por favor vuelve a solicitarlo.', diff --git a/packages/localizations/src/es-UY.ts b/packages/localizations/src/es-UY.ts index 5d85d52d811..432c849c485 100644 --- a/packages/localizations/src/es-UY.ts +++ b/packages/localizations/src/es-UY.ts @@ -956,6 +956,8 @@ export const esUY: LocalizationResource = { formButtonPrimary: 'Continuar', formButtonPrimary__verify: 'Verificar', formFieldAction__forgotPassword: '¿Olvidaste tu contraseña?', + formFieldAction__hidePassword: 'Ocultar contraseña', + formFieldAction__showPassword: 'Mostrar contraseña', formFieldError__matchingPasswords: 'Las contraseñas coinciden.', formFieldError__notMatchingPasswords: 'Las contraseñas no coinciden.', formFieldError__verificationLinkExpired: diff --git a/packages/localizations/src/fa-IR.ts b/packages/localizations/src/fa-IR.ts index 15d607bebcd..8daa142f9ad 100644 --- a/packages/localizations/src/fa-IR.ts +++ b/packages/localizations/src/fa-IR.ts @@ -961,6 +961,8 @@ export const faIR: LocalizationResource = { formButtonPrimary: 'ادامه', formButtonPrimary__verify: 'تأیید', formFieldAction__forgotPassword: 'رمز عبور را فراموش کرده‌اید؟', + formFieldAction__hidePassword: 'پنهان کردن رمز عبور', + formFieldAction__showPassword: 'نمایش رمز عبور', formFieldError__matchingPasswords: 'رمزهای عبور مطابقت دارند.', formFieldError__notMatchingPasswords: 'رمزهای عبور مطابقت ندارند.', formFieldError__verificationLinkExpired: 'لینک تأیید منقضی شده است. لطفاً درخواست لینک جدید بدهید.', diff --git a/packages/localizations/src/fi-FI.ts b/packages/localizations/src/fi-FI.ts index 162703f38c1..360a30cf3f3 100644 --- a/packages/localizations/src/fi-FI.ts +++ b/packages/localizations/src/fi-FI.ts @@ -962,6 +962,8 @@ export const fiFI: LocalizationResource = { formButtonPrimary: 'Jatka', formButtonPrimary__verify: 'Vahvista', formFieldAction__forgotPassword: 'Unohditko salasanasi?', + formFieldAction__hidePassword: 'Piilota salasana', + formFieldAction__showPassword: 'Näytä salasana', formFieldError__matchingPasswords: 'Salasanat täsmäävät.', formFieldError__notMatchingPasswords: 'Salasanat eivät täsmää.', formFieldError__verificationLinkExpired: 'Vahvistuslinkki on vanhentunut. Pyydä uusi linkki.', diff --git a/packages/localizations/src/fr-FR.ts b/packages/localizations/src/fr-FR.ts index 461e10efcb6..aada099130c 100644 --- a/packages/localizations/src/fr-FR.ts +++ b/packages/localizations/src/fr-FR.ts @@ -965,6 +965,8 @@ export const frFR: LocalizationResource = { formButtonPrimary: 'Continuer', formButtonPrimary__verify: 'Vérifier', formFieldAction__forgotPassword: 'Mot de passe oublié ?', + formFieldAction__hidePassword: 'Masquer le mot de passe', + formFieldAction__showPassword: 'Afficher le mot de passe', formFieldError__matchingPasswords: 'Les mots de passe correspondent.', formFieldError__notMatchingPasswords: 'Les mots de passe ne correspondent pas.', formFieldError__verificationLinkExpired: 'Le lien de vérification a expiré. Merci de demander un nouveau lien.', diff --git a/packages/localizations/src/he-IL.ts b/packages/localizations/src/he-IL.ts index 7836eb1b6dd..b9babea27b7 100644 --- a/packages/localizations/src/he-IL.ts +++ b/packages/localizations/src/he-IL.ts @@ -955,6 +955,8 @@ export const heIL: LocalizationResource = { formButtonPrimary: 'המשך', formButtonPrimary__verify: 'Verify', formFieldAction__forgotPassword: 'שכחת סיסמה?', + formFieldAction__hidePassword: 'הסתרת סיסמה', + formFieldAction__showPassword: 'הצגת סיסמה', formFieldError__matchingPasswords: 'הסיסמאות תואמות.', formFieldError__notMatchingPasswords: 'הסיסמאות אינן תואמות.', formFieldError__verificationLinkExpired: 'הקישור לאימות פג תוקף. אנא בקש/י קישור חדש.', diff --git a/packages/localizations/src/hi-IN.ts b/packages/localizations/src/hi-IN.ts index c71848b381b..7c6c2ad0582 100644 --- a/packages/localizations/src/hi-IN.ts +++ b/packages/localizations/src/hi-IN.ts @@ -962,6 +962,8 @@ export const hiIN: LocalizationResource = { formButtonPrimary: 'जारी रखें', formButtonPrimary__verify: 'सत्यापित करें', formFieldAction__forgotPassword: 'पासवर्ड भूल गए?', + formFieldAction__hidePassword: 'पासवर्ड छिपाएँ', + formFieldAction__showPassword: 'पासवर्ड दिखाएँ', formFieldError__matchingPasswords: 'पासवर्ड मेल खाते हैं।', formFieldError__notMatchingPasswords: 'पासवर्ड मेल नहीं खाते।', formFieldError__verificationLinkExpired: 'सत्यापन लिंक समाप्त हो गया है। कृपया एक नया लिंक अनुरोध करें।', diff --git a/packages/localizations/src/hr-HR.ts b/packages/localizations/src/hr-HR.ts index d51d0ad8d93..4ae52b41ae4 100644 --- a/packages/localizations/src/hr-HR.ts +++ b/packages/localizations/src/hr-HR.ts @@ -963,6 +963,8 @@ export const hrHR: LocalizationResource = { formButtonPrimary: 'Nastavi', formButtonPrimary__verify: 'Potvrdi', formFieldAction__forgotPassword: 'Zaboravili ste lozinku?', + formFieldAction__hidePassword: 'Sakrij lozinku', + formFieldAction__showPassword: 'Prikaži lozinku', formFieldError__matchingPasswords: 'Lozinke se podudaraju.', formFieldError__notMatchingPasswords: 'Lozinke se ne podudaraju.', formFieldError__verificationLinkExpired: 'Verifikacijska poveznica je istekla. Molimo zatražite novu poveznicu.', diff --git a/packages/localizations/src/hu-HU.ts b/packages/localizations/src/hu-HU.ts index be0c7d46357..f1b222ba5d5 100644 --- a/packages/localizations/src/hu-HU.ts +++ b/packages/localizations/src/hu-HU.ts @@ -964,6 +964,8 @@ export const huHU: LocalizationResource = { formButtonPrimary: 'Tovább', formButtonPrimary__verify: 'Ellenőrzés', formFieldAction__forgotPassword: 'Elfelejtetted a jelszavad?', + formFieldAction__hidePassword: 'Jelszó elrejtése', + formFieldAction__showPassword: 'Jelszó megjelenítése', formFieldError__matchingPasswords: 'A jelszavak megegyeznek', formFieldError__notMatchingPasswords: 'A jelszavak nem egyeznek', formFieldError__verificationLinkExpired: 'A megerősítő link lejárt. Kérlek kérj egy újat.', diff --git a/packages/localizations/src/id-ID.ts b/packages/localizations/src/id-ID.ts index 4f4434c49c0..617a66f9613 100644 --- a/packages/localizations/src/id-ID.ts +++ b/packages/localizations/src/id-ID.ts @@ -956,6 +956,8 @@ export const idID: LocalizationResource = { formButtonPrimary: 'Lanjutkan', formButtonPrimary__verify: 'Verifikasi', formFieldAction__forgotPassword: 'Lupa kata sandi?', + formFieldAction__hidePassword: 'Sembunyikan kata sandi', + formFieldAction__showPassword: 'Tampilkan kata sandi', formFieldError__matchingPasswords: 'Kata sandi cocok.', formFieldError__notMatchingPasswords: 'Kata sandi tidak cocok.', formFieldError__verificationLinkExpired: 'Tautan verifikasi telah kedaluwarsa. Silakan minta tautan baru.', diff --git a/packages/localizations/src/is-IS.ts b/packages/localizations/src/is-IS.ts index 2eeefbeadcd..b27d7cd37b1 100644 --- a/packages/localizations/src/is-IS.ts +++ b/packages/localizations/src/is-IS.ts @@ -962,6 +962,8 @@ export const isIS: LocalizationResource = { formButtonPrimary: 'Halda áfram', formButtonPrimary__verify: 'Staðfesta', formFieldAction__forgotPassword: 'Gleymt lykilorð?', + formFieldAction__hidePassword: 'Fela lykilorð', + formFieldAction__showPassword: 'Sýna lykilorð', formFieldError__matchingPasswords: 'Lykilorð passa saman.', formFieldError__notMatchingPasswords: 'Lykilorð passa ekki saman.', formFieldError__verificationLinkExpired: 'Staðfestingartengillinn er útrunninn. Vinsamlegast biðjið um nýjan tengil.', diff --git a/packages/localizations/src/it-IT.ts b/packages/localizations/src/it-IT.ts index d938f226c74..b5dd28eda07 100644 --- a/packages/localizations/src/it-IT.ts +++ b/packages/localizations/src/it-IT.ts @@ -962,6 +962,8 @@ export const itIT: LocalizationResource = { formButtonPrimary: 'Continua', formButtonPrimary__verify: 'Verifica', formFieldAction__forgotPassword: 'Password dimenticata?', + formFieldAction__hidePassword: 'Nascondi password', + formFieldAction__showPassword: 'Mostra password', formFieldError__matchingPasswords: 'Le password coincidono.', formFieldError__notMatchingPasswords: 'Le password non coincidono.', formFieldError__verificationLinkExpired: 'Il link di verifica è scaduto. Per favore richiedi un nuovo link.', diff --git a/packages/localizations/src/ja-JP.ts b/packages/localizations/src/ja-JP.ts index 60c0fea1061..1ef8f68d012 100644 --- a/packages/localizations/src/ja-JP.ts +++ b/packages/localizations/src/ja-JP.ts @@ -963,6 +963,8 @@ export const jaJP: LocalizationResource = { formButtonPrimary: '続ける', formButtonPrimary__verify: '確認する', formFieldAction__forgotPassword: 'パスワードをお忘れですか?', + formFieldAction__hidePassword: 'パスワードを非表示にする', + formFieldAction__showPassword: 'パスワードを表示する', formFieldError__matchingPasswords: 'パスワードが一致します。', formFieldError__notMatchingPasswords: 'パスワードが一致しません。', formFieldError__verificationLinkExpired: '検証リンクの有効期限が切れています。新しいリンクをリクエストしてください。', diff --git a/packages/localizations/src/kk-KZ.ts b/packages/localizations/src/kk-KZ.ts index 3d1d8d96497..feee430ad7d 100644 --- a/packages/localizations/src/kk-KZ.ts +++ b/packages/localizations/src/kk-KZ.ts @@ -956,6 +956,8 @@ export const kkKZ: LocalizationResource = { formButtonPrimary: 'Жалғастыру', formButtonPrimary__verify: 'Растау', formFieldAction__forgotPassword: 'Құпия сөзді ұмыттыңыз ба?', + formFieldAction__hidePassword: 'Құпия сөзді жасыру', + formFieldAction__showPassword: 'Құпия сөзді көрсету', formFieldError__matchingPasswords: 'Құпия сөздер сәйкес келеді.', formFieldError__notMatchingPasswords: 'Құпия сөздер сәйкес келмейді.', formFieldError__verificationLinkExpired: 'Растау сілтемесінің мерзімі бітті. Жаңа сілтеме сұраңыз.', diff --git a/packages/localizations/src/ko-KR.ts b/packages/localizations/src/ko-KR.ts index 132442c3d20..0e630fb6fd8 100644 --- a/packages/localizations/src/ko-KR.ts +++ b/packages/localizations/src/ko-KR.ts @@ -959,6 +959,8 @@ export const koKR: LocalizationResource = { formButtonPrimary: '계속', formButtonPrimary__verify: '확인하기', formFieldAction__forgotPassword: '비밀번호를 잊으셨나요?', + formFieldAction__hidePassword: '비밀번호 숨기기', + formFieldAction__showPassword: '비밀번호 표시', formFieldError__matchingPasswords: '비밀번호가 일치해요.', formFieldError__notMatchingPasswords: '비밀번호가 일치하지 않아요.', formFieldError__verificationLinkExpired: '인증 링크가 만료됐어요. 새 링크를 요청해 주세요.', diff --git a/packages/localizations/src/mn-MN.ts b/packages/localizations/src/mn-MN.ts index 3f9c7b0695d..053cf26b29d 100644 --- a/packages/localizations/src/mn-MN.ts +++ b/packages/localizations/src/mn-MN.ts @@ -956,6 +956,8 @@ export const mnMN: LocalizationResource = { formButtonPrimary: 'Үргэлжлүүлэх', formButtonPrimary__verify: 'Баталгаажуулах', formFieldAction__forgotPassword: 'Нууц үгээ мартсан?', + formFieldAction__hidePassword: 'Нууц үгийг нуух', + formFieldAction__showPassword: 'Нууц үгийг харуулах', formFieldError__matchingPasswords: 'Нууц үг таарч байна.', formFieldError__notMatchingPasswords: 'Нууц үг таарахгүй байна.', formFieldError__verificationLinkExpired: 'Баталгаажуулах холбоосын хугацаа дууссан. Шинэ холбоос хүсэлт гаргана уу.', diff --git a/packages/localizations/src/ms-MY.ts b/packages/localizations/src/ms-MY.ts index f1f5657ec03..e3ca6913a1e 100644 --- a/packages/localizations/src/ms-MY.ts +++ b/packages/localizations/src/ms-MY.ts @@ -964,6 +964,8 @@ export const msMY: LocalizationResource = { formButtonPrimary: 'Teruskan', formButtonPrimary__verify: 'Sahkan', formFieldAction__forgotPassword: 'Lupa kata laluan?', + formFieldAction__hidePassword: 'Sembunyikan kata laluan', + formFieldAction__showPassword: 'Tunjukkan kata laluan', formFieldError__matchingPasswords: 'Kata laluan sepadan.', formFieldError__notMatchingPasswords: 'Kata laluan tidak sepadan.', formFieldError__verificationLinkExpired: 'Pautan pengesahan telah tamat tempoh. Sila minta pautan baharu.', diff --git a/packages/localizations/src/nb-NO.ts b/packages/localizations/src/nb-NO.ts index a4151c4bb37..3300cb8456f 100644 --- a/packages/localizations/src/nb-NO.ts +++ b/packages/localizations/src/nb-NO.ts @@ -963,6 +963,8 @@ export const nbNO: LocalizationResource = { formButtonPrimary: 'Fortsett', formButtonPrimary__verify: 'Verifiser', formFieldAction__forgotPassword: 'Glemt passord?', + formFieldAction__hidePassword: 'Skjul passord', + formFieldAction__showPassword: 'Vis passord', formFieldError__matchingPasswords: 'Passordene stemmer overens.', formFieldError__notMatchingPasswords: 'Passordene stemmer ikke overens.', formFieldError__verificationLinkExpired: 'Verifikasjonslenken har utløpt. Vennligst be om en ny lenke.', diff --git a/packages/localizations/src/nl-BE.ts b/packages/localizations/src/nl-BE.ts index 5e1adc6c082..5635c4bdae0 100644 --- a/packages/localizations/src/nl-BE.ts +++ b/packages/localizations/src/nl-BE.ts @@ -956,6 +956,8 @@ export const nlBE: LocalizationResource = { formButtonPrimary: 'Doorgaan', formButtonPrimary__verify: 'Verifieer', formFieldAction__forgotPassword: 'Wachtwoord vergeten?', + formFieldAction__hidePassword: 'Wachtwoord verbergen', + formFieldAction__showPassword: 'Wachtwoord tonen', formFieldError__matchingPasswords: 'Wachtwoorden matchen.', formFieldError__notMatchingPasswords: 'Wachtwoorden komen niet overeen.', formFieldError__verificationLinkExpired: 'De verificatielink is verlopen. Vraag een nieuwe link aan.', diff --git a/packages/localizations/src/nl-NL.ts b/packages/localizations/src/nl-NL.ts index 52a3b5bcc49..683c087722b 100644 --- a/packages/localizations/src/nl-NL.ts +++ b/packages/localizations/src/nl-NL.ts @@ -956,6 +956,8 @@ export const nlNL: LocalizationResource = { formButtonPrimary: 'Doorgaan', formButtonPrimary__verify: 'Verifieer', formFieldAction__forgotPassword: 'Wachtwoord vergeten?', + formFieldAction__hidePassword: 'Wachtwoord verbergen', + formFieldAction__showPassword: 'Wachtwoord tonen', formFieldError__matchingPasswords: 'Wachtwoorden matchen.', formFieldError__notMatchingPasswords: 'Wachtwoorden komen niet overeen.', formFieldError__verificationLinkExpired: 'De verificatielink is verlopen. Vraag een nieuwe link aan.', diff --git a/packages/localizations/src/pl-PL.ts b/packages/localizations/src/pl-PL.ts index d4684783343..bd2ce40f06c 100644 --- a/packages/localizations/src/pl-PL.ts +++ b/packages/localizations/src/pl-PL.ts @@ -956,6 +956,8 @@ export const plPL: LocalizationResource = { formButtonPrimary: 'Kontynuuj', formButtonPrimary__verify: 'Zweryfikuj', formFieldAction__forgotPassword: 'Zapomniałem/am hasła', + formFieldAction__hidePassword: 'Ukryj hasło', + formFieldAction__showPassword: 'Pokaż hasło', formFieldError__matchingPasswords: 'Hasła się zgadzają.', formFieldError__notMatchingPasswords: 'Hasła się nie zgadzają.', formFieldError__verificationLinkExpired: 'Link weryfikacyjny wygasł. Spróbuj ponownie.', diff --git a/packages/localizations/src/pt-BR.ts b/packages/localizations/src/pt-BR.ts index 64a2822da6b..f060558f508 100644 --- a/packages/localizations/src/pt-BR.ts +++ b/packages/localizations/src/pt-BR.ts @@ -963,6 +963,8 @@ export const ptBR: LocalizationResource = { formButtonPrimary: 'Continuar', formButtonPrimary__verify: 'Verificar', formFieldAction__forgotPassword: 'Esqueceu a senha?', + formFieldAction__hidePassword: 'Ocultar senha', + formFieldAction__showPassword: 'Mostrar senha', formFieldError__matchingPasswords: 'Senhas conferem.', formFieldError__notMatchingPasswords: 'Senhas não conferem.', formFieldError__verificationLinkExpired: 'O link de verificação expirou. Por favor solicite um novo link.', diff --git a/packages/localizations/src/pt-PT.ts b/packages/localizations/src/pt-PT.ts index 8a9b1731bd8..8a6cd1a348a 100644 --- a/packages/localizations/src/pt-PT.ts +++ b/packages/localizations/src/pt-PT.ts @@ -964,6 +964,8 @@ export const ptPT: LocalizationResource = { formButtonPrimary: 'Continuar', formButtonPrimary__verify: 'Verificar', formFieldAction__forgotPassword: 'Esqueceu a palavra-passe?', + formFieldAction__hidePassword: 'Ocultar palavra-passe', + formFieldAction__showPassword: 'Mostrar palavra-passe', formFieldError__matchingPasswords: 'As palavras-passe coincidem.', formFieldError__notMatchingPasswords: 'As palavras-passe não coincidem.', formFieldError__verificationLinkExpired: 'A ligação de verificação expirou. Solicite uma nova ligação.', diff --git a/packages/localizations/src/ro-RO.ts b/packages/localizations/src/ro-RO.ts index ebd873d5716..859280e7e38 100644 --- a/packages/localizations/src/ro-RO.ts +++ b/packages/localizations/src/ro-RO.ts @@ -963,6 +963,8 @@ export const roRO: LocalizationResource = { formButtonPrimary: 'Continuă', formButtonPrimary__verify: 'Verifică', formFieldAction__forgotPassword: 'Ai uitat parola?', + formFieldAction__hidePassword: 'Ascunde parola', + formFieldAction__showPassword: 'Afișează parola', formFieldError__matchingPasswords: 'Parolele coincid.', formFieldError__notMatchingPasswords: 'Parolele nu coincid.', formFieldError__verificationLinkExpired: 'Linkul de verificare a expirat. Te rugăm să soliciți unul nou.', diff --git a/packages/localizations/src/ru-RU.ts b/packages/localizations/src/ru-RU.ts index 96d03ce5a3f..e8b1b84144d 100644 --- a/packages/localizations/src/ru-RU.ts +++ b/packages/localizations/src/ru-RU.ts @@ -956,6 +956,8 @@ export const ruRU: LocalizationResource = { formButtonPrimary: 'Продолжить', formButtonPrimary__verify: 'Верификация', formFieldAction__forgotPassword: 'Забыли пароль?', + formFieldAction__hidePassword: 'Скрыть пароль', + formFieldAction__showPassword: 'Показать пароль', formFieldError__matchingPasswords: 'Пароли совпадают.', formFieldError__notMatchingPasswords: 'Пароли не совпадают.', formFieldError__verificationLinkExpired: diff --git a/packages/localizations/src/sk-SK.ts b/packages/localizations/src/sk-SK.ts index 9ba2f4f156a..d2eafb0a578 100644 --- a/packages/localizations/src/sk-SK.ts +++ b/packages/localizations/src/sk-SK.ts @@ -956,6 +956,8 @@ export const skSK: LocalizationResource = { formButtonPrimary: 'Pokračovať', formButtonPrimary__verify: 'Overiť', formFieldAction__forgotPassword: 'Zabudli ste heslo?', + formFieldAction__hidePassword: 'Skryť heslo', + formFieldAction__showPassword: 'Zobraziť heslo', formFieldError__matchingPasswords: 'Heslá sa musia zhodovať.', formFieldError__notMatchingPasswords: 'Heslá sa nezhodujú.', formFieldError__verificationLinkExpired: 'Overovací odkaz vypršal. Vyžiadajte si nový odkaz.', diff --git a/packages/localizations/src/sr-RS.ts b/packages/localizations/src/sr-RS.ts index ee1093c3073..acd705324c5 100644 --- a/packages/localizations/src/sr-RS.ts +++ b/packages/localizations/src/sr-RS.ts @@ -956,6 +956,8 @@ export const srRS: LocalizationResource = { formButtonPrimary: 'Nastavi', formButtonPrimary__verify: 'Verifikuj', formFieldAction__forgotPassword: 'Zaboravljena lozinka?', + formFieldAction__hidePassword: 'Sakrij lozinku', + formFieldAction__showPassword: 'Prikaži lozinku', formFieldError__matchingPasswords: 'Lozinke se poklapaju.', formFieldError__notMatchingPasswords: 'Lozinke se ne poklapaju.', formFieldError__verificationLinkExpired: 'Link za verifikaciju je istekao. Molimo zatražite novi link.', diff --git a/packages/localizations/src/sv-SE.ts b/packages/localizations/src/sv-SE.ts index 5b652afb4da..881a4a4df2a 100644 --- a/packages/localizations/src/sv-SE.ts +++ b/packages/localizations/src/sv-SE.ts @@ -956,6 +956,8 @@ export const svSE: LocalizationResource = { formButtonPrimary: 'Fortsätt', formButtonPrimary__verify: 'Verifiera', formFieldAction__forgotPassword: 'Glömt lösenord?', + formFieldAction__hidePassword: 'Dölj lösenord', + formFieldAction__showPassword: 'Visa lösenord', formFieldError__matchingPasswords: 'Lösenorden matchar.', formFieldError__notMatchingPasswords: 'Lösenorden matchar inte.', formFieldError__verificationLinkExpired: 'Verifieringslänken har löpt ut. Vänligen begär en ny länk.', diff --git a/packages/localizations/src/ta-IN.ts b/packages/localizations/src/ta-IN.ts index e4e15915cde..cb706cc5fc5 100644 --- a/packages/localizations/src/ta-IN.ts +++ b/packages/localizations/src/ta-IN.ts @@ -964,6 +964,8 @@ export const taIN: LocalizationResource = { formButtonPrimary: 'தொடரவும்', formButtonPrimary__verify: 'சரிபார்க்கவும்', formFieldAction__forgotPassword: 'கடவுச்சொல் மறந்துவிட்டதா?', + formFieldAction__hidePassword: 'கடவுச்சொல்லை மறை', + formFieldAction__showPassword: 'கடவுச்சொல்லைக் காட்டு', formFieldError__matchingPasswords: 'கடவுச்சொற்கள் பொருந்துகின்றன.', formFieldError__notMatchingPasswords: 'கடவுச்சொற்கள் பொருந்தவில்லை.', formFieldError__verificationLinkExpired: 'சரிபார்ப்பு இணைப்பு காலாவதியானது. புதிய இணைப்பைக் கோருங்கள்.', diff --git a/packages/localizations/src/te-IN.ts b/packages/localizations/src/te-IN.ts index d9a957f8b1c..9db00b0f6b5 100644 --- a/packages/localizations/src/te-IN.ts +++ b/packages/localizations/src/te-IN.ts @@ -963,6 +963,8 @@ export const teIN: LocalizationResource = { formButtonPrimary: 'కొనసాగించండి', formButtonPrimary__verify: 'ధృవీకరించండి', formFieldAction__forgotPassword: 'పాస్‌వర్డ్ మర్చిపోయారా?', + formFieldAction__hidePassword: 'పాస్‌వర్డ్‌ను దాచు', + formFieldAction__showPassword: 'పాస్‌వర్డ్‌ను చూపించు', formFieldError__matchingPasswords: 'పాస్‌వర్డ్‌లు సరిపోలాయి.', formFieldError__notMatchingPasswords: 'పాస్‌వర్డ్‌లు సరిపోలడం లేదు.', formFieldError__verificationLinkExpired: 'ధృవీకరణ లింక్ గడువు ముగిసింది. దయచేసి కొత్త లింక్‌ను అభ్యర్థించండి.', diff --git a/packages/localizations/src/th-TH.ts b/packages/localizations/src/th-TH.ts index fb6515d892c..b9abd92700a 100644 --- a/packages/localizations/src/th-TH.ts +++ b/packages/localizations/src/th-TH.ts @@ -959,6 +959,8 @@ export const thTH: LocalizationResource = { formButtonPrimary: 'ดำเนินการต่อ', formButtonPrimary__verify: 'ยืนยัน', formFieldAction__forgotPassword: 'ลืมรหัสผ่าน?', + formFieldAction__hidePassword: 'ซ่อนรหัสผ่าน', + formFieldAction__showPassword: 'แสดงรหัสผ่าน', formFieldError__matchingPasswords: 'รหัสผ่านตรงกัน', formFieldError__notMatchingPasswords: 'รหัสผ่านไม่ตรงกัน', formFieldError__verificationLinkExpired: 'ลิงก์ยืนยันหมดอายุแล้ว โปรดขอลิงก์ใหม่', diff --git a/packages/localizations/src/tr-TR.ts b/packages/localizations/src/tr-TR.ts index 0e6efae4e09..31f6d97069a 100644 --- a/packages/localizations/src/tr-TR.ts +++ b/packages/localizations/src/tr-TR.ts @@ -956,6 +956,8 @@ export const trTR: LocalizationResource = { formButtonPrimary: 'İleri', formButtonPrimary__verify: 'Doğrula', formFieldAction__forgotPassword: 'Şifremi unuttum', + formFieldAction__hidePassword: 'Şifreyi gizle', + formFieldAction__showPassword: 'Şifreyi göster', formFieldError__matchingPasswords: 'Şifreler eşleşmeli.', formFieldError__notMatchingPasswords: 'Şifreler eşleşmiyor.', formFieldError__verificationLinkExpired: 'Doğrulama bağlantısının süresi doldu. Lütfen yeni bir bağlantı isteyin.', diff --git a/packages/localizations/src/uk-UA.ts b/packages/localizations/src/uk-UA.ts index c4f96eb5c38..a6f282ae4e8 100644 --- a/packages/localizations/src/uk-UA.ts +++ b/packages/localizations/src/uk-UA.ts @@ -956,6 +956,8 @@ export const ukUA: LocalizationResource = { formButtonPrimary: 'Продовжити', formButtonPrimary__verify: 'Verify', formFieldAction__forgotPassword: 'Забули пароль?', + formFieldAction__hidePassword: 'Приховати пароль', + formFieldAction__showPassword: 'Показати пароль', formFieldError__matchingPasswords: 'Паролі збігаються.', formFieldError__notMatchingPasswords: 'Паролі не збігаються.', formFieldError__verificationLinkExpired: 'The verification link expired. Please request a new link.', diff --git a/packages/localizations/src/vi-VN.ts b/packages/localizations/src/vi-VN.ts index 8c3c23b9588..89603486018 100644 --- a/packages/localizations/src/vi-VN.ts +++ b/packages/localizations/src/vi-VN.ts @@ -962,6 +962,8 @@ export const viVN: LocalizationResource = { formButtonPrimary: 'Tiếp tục', formButtonPrimary__verify: 'Xác minh', formFieldAction__forgotPassword: 'Quên mật khẩu?', + formFieldAction__hidePassword: 'Ẩn mật khẩu', + formFieldAction__showPassword: 'Hiện mật khẩu', formFieldError__matchingPasswords: 'Mật khẩu trùng khớp.', formFieldError__notMatchingPasswords: 'Mật khẩu không trùng khớp.', formFieldError__verificationLinkExpired: 'Liên kết xác minh đã hết hạn. Vui lòng yêu cầu liên kết mới.', diff --git a/packages/localizations/src/zh-CN.ts b/packages/localizations/src/zh-CN.ts index 07fd70dd618..ee9112eadc8 100644 --- a/packages/localizations/src/zh-CN.ts +++ b/packages/localizations/src/zh-CN.ts @@ -955,6 +955,8 @@ export const zhCN: LocalizationResource = { formButtonPrimary: '继续', formButtonPrimary__verify: '验证', formFieldAction__forgotPassword: '忘记密码?', + formFieldAction__hidePassword: '隐藏密码', + formFieldAction__showPassword: '显示密码', formFieldError__matchingPasswords: '密码匹配。', formFieldError__notMatchingPasswords: '密码不匹配。', formFieldError__verificationLinkExpired: '验证链接已过期。请申请新的链接。', diff --git a/packages/localizations/src/zh-TW.ts b/packages/localizations/src/zh-TW.ts index 75018e1a8f2..ed85fe52c0c 100644 --- a/packages/localizations/src/zh-TW.ts +++ b/packages/localizations/src/zh-TW.ts @@ -958,6 +958,8 @@ export const zhTW: LocalizationResource = { formButtonPrimary: '繼續', formButtonPrimary__verify: '驗證', formFieldAction__forgotPassword: '忘記密碼?', + formFieldAction__hidePassword: '隱藏密碼', + formFieldAction__showPassword: '顯示密碼', formFieldError__matchingPasswords: '密碼匹配。', formFieldError__notMatchingPasswords: '密碼不匹配。', formFieldError__verificationLinkExpired: '驗證連結已過期,請請求新的連結。', diff --git a/packages/shared/src/types/localization.ts b/packages/shared/src/types/localization.ts index 34834095c01..48bba0d2a2d 100644 --- a/packages/shared/src/types/localization.ts +++ b/packages/shared/src/types/localization.ts @@ -141,6 +141,8 @@ export type __internal_LocalizationResource = { formFieldError__matchingPasswords: LocalizationValue; formFieldError__verificationLinkExpired: LocalizationValue; formFieldAction__forgotPassword: LocalizationValue; + formFieldAction__hidePassword: LocalizationValue; + formFieldAction__showPassword: LocalizationValue; formFieldHintText__optional: LocalizationValue; formFieldHintText__slug: LocalizationValue; formButtonPrimary: LocalizationValue; diff --git a/packages/ui/src/elements/PasswordInput.tsx b/packages/ui/src/elements/PasswordInput.tsx index 93c1c2be5a1..b98113aeb40 100644 --- a/packages/ui/src/elements/PasswordInput.tsx +++ b/packages/ui/src/elements/PasswordInput.tsx @@ -107,7 +107,7 @@ export const PasswordInput = forwardRef((p { const totalEnabledAuthMethods = useTotalEnabledAuthMethods(); const card = useCardState(); const clerk = useClerk(); + const { t } = useLocalizations(); const { socialButtonsVariant } = useAppearance().parsedOptions; type TStrategy = OAuthStrategy | Web3Strategy | PhoneCodeChannel; @@ -171,6 +173,7 @@ export const SocialButtons = React.memo((props: SocialButtonsRootProps) => { })} > {row.map(strategy => { + const isLastAuthenticationStrategy = strategy === lastAuthenticationStrategy && totalEnabledAuthMethods > 1; const shouldShowPreText = remainingStrategiesLength === SOCIAL_BUTTON_PRE_TEXT_THRESHOLD || (strategy === lastAuthenticationStrategy && row.length === 1); @@ -194,7 +197,7 @@ export const SocialButtons = React.memo((props: SocialButtonsRootProps) => { name={strategyToDisplayData[strategy].name} isLoading={card.loadingMetadata === strategy} isDisabled={card.isLoading} - alt={`Sign in with ${strategyToDisplayData[strategy].name}`} + aria-hidden elementDescriptor={[descriptors.providerIcon, descriptors.socialButtonsProviderIcon]} elementId={descriptors.socialButtonsProviderIcon.setId(strategyToDisplayData[strategy].id)} /> @@ -208,9 +211,18 @@ export const SocialButtons = React.memo((props: SocialButtonsRootProps) => { isLoading={card.loadingMetadata === strategy} isDisabled={card.isLoading} label={label} + aria-label={ + preferBlockButtons || isLastAuthenticationStrategy + ? undefined + : t( + localizationKeys('socialButtonsBlockButton', { + provider: strategyToDisplayData[strategy].name, + }), + ) + } textLocalizationKey={localizedText} icon={imageOrInitial} - lastAuthenticationStrategy={strategy === lastAuthenticationStrategy && totalEnabledAuthMethods > 1} + lastAuthenticationStrategy={isLastAuthenticationStrategy} /> ); })} diff --git a/packages/ui/src/elements/__tests__/AuthenticationLabels.test.tsx b/packages/ui/src/elements/__tests__/AuthenticationLabels.test.tsx new file mode 100644 index 00000000000..4ea97f82ba4 --- /dev/null +++ b/packages/ui/src/elements/__tests__/AuthenticationLabels.test.tsx @@ -0,0 +1,133 @@ +import { frFR } from '@clerk/localizations'; +import type { LocalizationResource } from '@clerk/shared/types'; +import { describe, expect, it, vi } from 'vitest'; + +import { bindCreateFixtures, render, screen } from '@/test/utils'; +import { AppearanceProvider } from '@/ui/customizables'; +import { CardStateProvider } from '@/ui/elements/contexts'; + +import { PasswordInput } from '../PasswordInput'; +import { SocialButtons } from '../SocialButtons'; + +describe.each(['SignIn', 'SignUp'] as const)('%s accessible labels', component => { + const { createFixtures } = bindCreateFixtures(component); + + it.each(['auto', 'iconButton', 'blockButton'] as const)( + 'localizes OAuth accessible names with the %s layout', + async socialButtonsVariant => { + const { wrapper, fixtures } = await createFixtures(f => { + f.withSocialProvider({ provider: 'apple' }); + f.withSocialProvider({ provider: 'facebook' }); + f.withSocialProvider({ provider: 'google' }); + }); + fixtures.options.localization = { + ...frFR, + socialButtonsBlockButton: 'Se connecter avec {{provider}}', + socialButtonsBlockButtonManyInView: 'Utiliser {{provider|titleize}}', + }; + + render( + + + + + , + { wrapper }, + ); + + for (const provider of ['Apple', 'Facebook', 'Google']) { + const name = socialButtonsVariant === 'blockButton' ? `Utiliser ${provider}` : `Se connecter avec ${provider}`; + const button = screen.getByRole('button', { name, exact: true }); + expect(button).toHaveAccessibleName(name); + expect(button.querySelector('[aria-hidden="true"]')).toBeInTheDocument(); + } + expect(screen.queryByRole('button', { name: /Sign in with/ })).not.toBeInTheDocument(); + }, + ); + + it.each(['auto', 'iconButton', 'blockButton'] as const)( + 'includes the localized last-used badge in the accessible name with the %s layout', + async socialButtonsVariant => { + const { wrapper, fixtures } = await createFixtures(f => { + f.withSocialProvider({ provider: 'apple' }); + f.withSocialProvider({ provider: 'facebook' }); + f.withSocialProvider({ provider: 'google' }); + }); + fixtures.clerk.client.lastAuthenticationStrategy = 'oauth_google'; + fixtures.options.localization = { + ...frFR, + lastAuthenticationStrategy: 'Dernière utilisation', + socialButtonsBlockButton: 'Se connecter avec {{provider}}', + }; + + render( + + + + + , + { wrapper }, + ); + + expect( + screen.getByRole('button', { name: 'Dernière utilisation Se connecter avec Google', exact: true }), + ).toBeVisible(); + }, + ); + + it.each([ + { localization: frFR, show: 'Afficher le mot de passe', hide: 'Masquer le mot de passe' }, + { + localization: { formFieldAction__showPassword: 'Révéler', formFieldAction__hidePassword: 'Cacher' }, + show: 'Révéler', + hide: 'Cacher', + }, + { localization: { locale: 'fr-FR' }, show: 'Show password', hide: 'Hide password' }, + ] satisfies { localization: LocalizationResource; show: string; hide: string }[])( + 'uses $show / $hide while toggling password visibility', + async ({ localization, show, hide }) => { + const { wrapper, fixtures } = await createFixtures(); + fixtures.options.localization = localization; + + const { userEvent } = render( + , + { wrapper }, + ); + + expect(screen.getByLabelText('Password')).toHaveAttribute('type', 'password'); + await userEvent.click(screen.getByRole('button', { name: show, exact: true })); + expect(screen.getByLabelText('Password')).toHaveAttribute('type', 'text'); + await userEvent.click(screen.getByRole('button', { name: hide, exact: true })); + expect(screen.getByLabelText('Password')).toHaveAttribute('type', 'password'); + expect(screen.getByRole('button', { name: show, exact: true })).toBeInTheDocument(); + }, + ); +});