<SignIn />: first "Use email" click switches back to phone when `initialValues.phoneNumber` is set

Ouverte Adaptée aux débutants
#10,487 0 commentaires 0 réactions 0 personnes assignées Voir sur GitHub

Les mainteneurs répondent en général sous 1 jour

@twicestruck y travaille déjà.

Depuis le 28/10/2026.

  • #10488 par @twicestruck — ouverte

Évaluation

Difficulté
2/5
Temps estimé
1-3 heures
Accessibilité débutants
74/100
Type d'issue
Bug
Clarté
Clairement spécifiée
Activité
Active
Stack technique
react, typescript

Piste de recherche

Commencez par packages/ui/src/components/SignIn/SignInStart.tsx, en particulier par l’initialisation de textIdentifierField et l’effet de remplissage automatique décrit dans l’issue. Suivez l’interaction entre un clic sur « Utiliser l’e-mail » et handlePhoneNumberPaste ; le lien de reproduction permet de confirmer le comportement. Le travail est terminé lorsque le premier clic affiche le champ e-mail avec un numéro de téléphone prérempli et qu’un test de régression couvre ce cas.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Description

Preliminary Checks
Reproduction

https://github.com/twicestruck/clerk-signin-phone-prefill-repro

Publishable key

pk_test_ZXhwZXJ0LXVuaWNvcm4tNzgyOC5jbGVyay5hY2NvdW50cy5kZXYk

Description

With email and phone both enabled as sign-in identifiers, <SignIn initialValues={{ phoneNumber: '+15555550100' }} /> opens on the phone field as expected, but the first "Use email" click switches straight back to the phone field. The second click works.

Steps to reproduce:

  1. Run the reproduction with the publishable key above
  2. Click "Use email" once

Expected behavior:

The email field shows.

Actual behavior:

The form switches back to the phone field.

Cause: when the form starts on the phone field, SignInStart seeds textIdentifierField with initialValues[identifierAttribute], which is the phone number (source). After the switch, the autofill effect sees a value starting with + and calls handlePhoneNumberPaste, which switches back to the phone field and clears the email field, so the second click sticks. A prefilled number without + shows up in the email field instead.

I'll open a PR with a fix and a test.

Environment
System:
  OS: macOS 27.0.1
  CPU: (18) arm64 Apple M5 Max
  Memory: 157.16 MB / 36.00 GB
  Shell: 5.9 - /bin/zsh
Binaries:
  Node: 24.22.0
  npm: 11.19.1
  pnpm: 12.14.0
  bun: 1.4.3
Browsers:
  Brave Browser: 155.1.97.59
  Chrome: 155.0.8059.85
  Chrome Canary: 158.0.8110.0
  Firefox: 158.0
  Safari: 27.0.1
npmPackages:
  @clerk/react: 6.18.3 => 6.18.3
  @vitejs/plugin-react: 6.1.2 => 6.1.2
  react: 19.3.1 => 19.3.1
  react-dom: 19.3.1 => 19.3.1
  vite: 8.3.5 => 8.3.5
Langage dominant
TypeScript
Étoiles
1.8k
Forks
484
Merge moyen
1 j 20 h
PR mergées (30 j)
363

Préparer son environnement

Par où commencer

  1. Lisez l'issue en entier, puis le guide de contribution du projet.
  2. Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
  3. Forkez le dépôt et travaillez sur une branche.
  4. Ouvrez une pull request qui référence le numéro de l'issue.

Autres issues de clerk/javascript

Toutes les issues de clerk/javascript

Issues similaires

Plus d'issues TypeScript

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.