probeo

How to fix an invalid autocomplete attribute?

autocomplete-valid page

The issue

A form field with an invalid autocomplete value can’t be filled in automatically, and its purpose can’t be identified by the browser or by assistive tools. People who rely on autofill to avoid typing, including people with motor or memory impairments, have to enter their name, address or card number by hand.

The cause is usually a value that looks reasonable but isn’t in the HTML specification’s list, such as autocomplete="phone" instead of tel, or zip instead of postal-code. WCAG 2.1 success criterion 1.3.5, Identify Input Purpose, relies on these exact tokens.

Scope

Each visible <select>, <textarea> and text-like <input> with an autocomplete attribute is checked: text, search, url, tel, email, password, the date and time types, number, range and color. An empty value is a violation. Every token in the value must be a recognized one: a field name such as email or postal-code, shipping or billing, a contact type such as work or mobile, on, off, webauthn, or a section- name.

How to check you have it

  • In probeo: the page reports the autocomplete-valid rule, “autocomplete attribute must be used correctly”, with serious impact, quoting the invalid value or noting an empty attribute.
  • By hand: search the source for autocomplete= and compare each value with the field names in the HTML specification.
  • With a tool: axe DevTools reports the same rule id. Filling the form with the browser’s saved details shows which fields it recognizes.

The fix

Use the HTML specification’s token for what each field asks for.

<input type="email" name="email" autocomplete="email">
<input type="tel" name="phone" autocomplete="tel">
<input type="text" name="zip" autocomplete="shipping postal-code">
<input type="password" name="new" autocomplete="new-password">

The name attribute can stay whatever the back end expects; only the autocomplete value has to be a standard token.

Done when: every autocomplete value is made of valid tokens, and the check above comes back clean.

Do not

  • Do not invent descriptive values such as phone, zip or firstname.
  • Do not leave the attribute empty; remove it, or give it a value.
  • Do not use autocomplete="off" on fields that ask for the user’s own details; it takes autofill away from the people who need it.

Common tokens

Field Token
Full name name
First and last name given-name, family-name
Email email
Phone tel
Street address street-address, or address-line1 and address-line2
City, state address-level2, address-level1
Postal code postal-code
Country country or country-name
Card number, expiry cc-number, cc-exp
New or current password new-password, current-password
One-time code one-time-code

FAQ

Does probeo check that the token suits the field?

No. It checks that each token is valid, not that email is on the email field. Read the form yourself for that.

Is autocomplete=“off” a violation?

Not in this rule; off is a valid token. It can still undercut WCAG 1.3.5 on fields that collect the user’s own details.

Do I need autocomplete on every field?

No. It matters on fields that ask for information about the user, which is what 1.3.5 covers.

Which product detects this

Probeo checks this on every page of your site as part of Site Clarity. This page explains one instance; the product tells you every page that has it.