Aussi disponible en : English · Español · Português · العربية
Attribut autocomplete en HTML
Le vocabulaire complet du remplissage automatique, un vérificateur de la valeur que vous avez écrite, et une réponse précise à ce que promet réellement autocomplete=off.
Qu’est-ce que l’attribut autocomplete ?
L’attribut autocomplete indique au navigateur à quoi sert un champ de formulaire, afin qu’il puisse le remplir avec ce qu’il sait déjà de la personne qui l’utilise. Écrire autocomplete="given-name" sur un input, c’est la différence entre un navigateur qui propose le prénom de quelqu’un et un navigateur qui ne propose rien.
Le vocabulaire est plus vaste et plus structuré que ce que presque personne n’emploie. La spécification HTML définit 54 noms de champ, des évidents comme email et postal-code jusqu’à cc-exp-month, honorific-suffix, transaction-currency et one-time-code. À côté, 10 jetons d’indice qualifient un nom de champ au lieu de le remplacer : shipping, billing, home, work, mobile, fax, pager, un jeton section de regroupement, et les valeurs seules on et off. Et il existe exactement un type d’identifiant, webauthn, qui se place après le nom de champ et fait proposer une passkey.
L’ordre compte et il est fixe : un jeton section facultatif, puis shipping ou billing, puis un indice de contact, puis le nom de champ, et enfin le type d’identifiant. Cette page analyse ce que vous collez et vous dit quelle place chaque jeton a occupée.
Comment s’en servir
- Collez la valeur que vous avez écrite. Uniquement la valeur de l’attribut, pas la balise entière. Les quatre boutons d’exemple couvrent une adresse postale, une connexion par passkey, une valeur dont les jetons sont dans le mauvais ordre, et une faute de frappe.
- Regardez le groupe de contrôle. C’est la partie utile. La spécification affecte chaque nom de champ à un genre de contrôle, et l’outil vous dit lequel et ce que cela implique concrètement.
- Parcourez les problèmes, s’il y en a. Un jeton inexistant, un indice mal placé, un nom de champ manquant, ou un jeton section suivi de rien. Tout cela est silencieux dans un navigateur : rien ne vous prévient.
Le groupe de contrôle est ce que tout le monde laisse tomber
Cherchez les valeurs d’autocomplete où vous voulez et vous obtiendrez une liste de jetons avec une phrase de sens chacun. Ce que cela omet est normatif et immédiatement utile : la spécification affecte en outre chaque nom de champ à un groupe de contrôle, et le groupe vous dit sur quel genre de champ le jeton se pose.
Le premier à connaître est street-address, qui appartient au groupe multiline. Il est prévu pour un textarea, parce qu’une adresse postale ne tient pas sur une ligne. Si vous voulez des champs d’une seule ligne, ce sont address-line1, address-line2 et address-line3 qu’il vous faut, dans le groupe texte. Mettre street-address sur un champ d’une ligne est l’erreur la plus courante que cette page puisse vous montrer, et aucun navigateur ne vous en dira un mot.
Les jetons en forme de date se répartissent pareillement. bday est dans le groupe date et va sur un input de type date, car c’est une année, un mois et un jour entiers. bday-day et bday-year sont dans le groupe numérique : ce sont des nombres isolés, sur des champs numériques. cc-exp est dans le groupe month, soit une année et un mois ensemble, tandis que cc-exp-month est numérique. Quatre jetons qui ressemblent à des dates, trois genres de contrôle différents.
Quelques autres qui surprennent : one-time-code est dans le groupe password et non le numérique, ce qui permet au navigateur de proposer un code qu’il vient de voir arriver. photo et impp sont tous deux dans le groupe url, car leurs valeurs sont des adresses et non des noms. Et cc-number est dans le groupe texte plutôt que numérique, puisqu’un numéro de carte est une suite de chiffres et non une quantité.
Ce que promet réellement autocomplete=off
Moins que sa réputation ne le laisse croire, et il faut être exact. La spécification dit que, lorsque le nom de champ d’un contrôle vaut off, l’agent utilisateur ne devrait pas retenir les données du contrôle ni proposer d’anciennes valeurs. C’est un devrait, pas un doit. Un navigateur qui les retient malgré tout reste conforme.
Il est tout aussi important de dire ce que la spécification ne contient pas, car c’est là que beaucoup d’écrits sur le sujet vont trop loin. Aucune clause n’autorise les navigateurs à ignorer off sur les champs de mot de passe. La section ne parle pas de gestionnaires de mots de passe et ne parle pas d’hameçonnage. Le devrait est tout ce qu’il y a. Les navigateurs se comportent de façons que l’on décrit comme ignorer off, et ce comportement est réel, mais ce n’est pas quelque chose que la norme autorise dans son texte : cette page ne prétend donc pas le contraire.
La lecture pratique est simple : off est une demande, pas un contrôle. Si une valeur ne doit pas être conservée, l’attribut n’est pas le mécanisme qui le garantit.
Limites assumées
Ceci vérifie une valeur, pas une page. L’outil ne voit pas sur quel élément l’attribut est posé : il peut vous dire que street-address va sur un textarea, mais pas que le vôtre est sur un input. C’est justement la vérification qui attraperait le plus d’erreurs réelles, et elle exige votre balisage, pas votre valeur.
Il ne peut pas non plus vous dire si le navigateur remplira effectivement le champ. Le remplissage dépend de ce que le navigateur a enregistré, d’heuristiques qui varient d’un navigateur à l’autre, et du formulaire alentour : un attribut correct rend le bon comportement possible, pas certain.
Le vocabulaire est un instantané. La spécification y ajoute : webauthn est récent, et one-time-code est plus récent qu’une bonne partie de ce qui s’écrit sur cet attribut. La liste ici est générée depuis la norme plutôt que saisie à la main, ce qui la rend facile à régénérer, mais elle reste la norme telle qu’elle est aujourd’hui.
Une note sur la façon dont cette liste a été bâtie, car cela a pesé sur ce que cette page peut affirmer. Le tableau de la spécification fusionne des cellules dans les deux sens, avec une classe dont le nom évoque une indentation non rectangulaire : il ne peut donc pas être lu par position, et une lecture positionnelle produit un tableau qui a l’air juste et ne l’est pas. Les données viennent des ancres de définition de la spécification, l’extraction étant confrontée à des jetons dont la réponse était connue d’avance.
Pourquoi est-ce gratuit ?
La liste est statique et l’analyse s’exécute dans votre navigateur. Aucun serveur n’intervient : rien à facturer, aucun compte à créer.
Rien n’est envoyé et rien n’est conservé. Rechargez la page et elle aura oublié ce que vous avez saisi.