Bad value X for attribute “autocomplete” on element “Y”: The string Z is not a valid autofill field name.

The autocomplete attribute holds a word that isn't one of the autofill field names defined in the HTML standard.

autocomplete tells browsers and password managers what saved data can fill a form control. Its value is either on or off on its own, or a token from a fixed list, such as name, email, tel, organization, postal-code or country. The token can be preceded by a section-* name and by shipping or billing, as in section-work shipping postal-code. The tokens are English words whatever the language of the page, and letter case doesn't matter. Browsers ignore any other value. The control then behaves as if it had no autocomplete attribute and follows its form's setting, which is on by default.

The validator reads the value word by word and quotes the first word it can't place, in lower case. So autocomplete="Choose a topic" is reported as the string "choose", and autocomplete="shipping clinic-name" as "clinic-name". on and off must stand alone: autocomplete="off email" is reported as the string "off".

If a standard token describes the control, use it. If none does, set autocomplete="off" or remove the attribute, and keep your own identifier in name or id. The usual cause depends on the element:

• <input>: the field's own name ends up in the attribute, like company, telephone or a word in the page's language. Look for the token that means the same thing: organization for a company name, tel for a phone number. The token also has to suit the input's type, or the validator reports that it isn't allowed in this context. Invented values like nope, none or nothanks are also common, added to stop the browser from offering saved data. Write off instead. On a field where the user picks a new password, new-password tells the browser not to fill in a saved password.
• <textarea>: the value is usually message, comments or a misspelling of one of them. Spelling it right doesn't help, because the list has no token for text the user writes freely. Use off or remove the attribute. A <textarea> that collects a postal address over several lines can take street-address.
• <select>: several tokens fit a dropdown, such as country, bday-month, bday-year, cc-exp-month and sex. The bad value is often text meant for people, like the field's label or its "Choose an option" prompt, sometimes copied into the attribute by a form builder. For a list the browser keeps no data for, such as topics or departments, remove the attribute.

Invalid example

<form action="/contact" method="post">
  <label for="clinic">Clinic</label>
  <input type="text" id="clinic" name="clinic" autocomplete="clinic-name">

  <label for="topic">Topic</label>
  <select id="topic" name="topic" autocomplete="Choose a topic">
    <option value="">Choose a topic</option>
    <option value="billing">Billing</option>
    <option value="support">Support</option>
  </select>

  <label for="message">Message</label>
  <textarea id="message" name="message" rows="6" autocomplete="message"></textarea>

  <button type="submit">Send</button>
</form>

Valid example

<form action="/contact" method="post">
  <label for="clinic">Clinic</label>
  <input type="text" id="clinic" name="clinic" autocomplete="off">

  <label for="topic">Topic</label>
  <select id="topic" name="topic">
    <option value="">Choose a topic</option>
    <option value="billing">Billing</option>
    <option value="support">Support</option>
  </select>

  <label for="message">Message</label>
  <textarea id="message" name="message" rows="6" autocomplete="off"></textarea>

  <button type="submit">Send</button>
</form>

When a standard token fits the control, use it:

<form action="/checkout" method="post">
  <label for="company">Company</label>
  <input type="text" id="company" name="company" autocomplete="organization">

  <label for="country">Country</label>
  <select id="country" name="country" autocomplete="shipping country">
    <option value="ES">Spain</option>
    <option value="FR">France</option>
  </select>

  <label for="address">Delivery address</label>
  <textarea id="address" name="address" rows="3" autocomplete="shipping street-address"></textarea>

  <button type="submit">Continue</button>
</form>

Learn more:

MDN Reference

MDN Web Docs: autocomplete

→

WHATWG Spec

HTML Standard: Autofill

→