Disabling Chrome Autofill

autocomplete, autofill, forms, google-chrome, html

Solution

June 2023: `autocomplete="one-time-code"` works in Chrome https://robindirksen.com/blog/html-autocomplete-one-time-code

Apr 2022: `autocomplete="off"` still does not work in Chrome, and I don't believe it ever has after looking through the Chromium bugs related to the issue (maybe only for password fields). I see issues reported in 2014 that were closed as "WontFix", and issues still open and under discussion [1][2]. From what I gather the Chromium team doesn't believe there is a valid use case for `autocomplete="off"`.

Overall, I still believe that neither of the extreme strategies ("always honor autocomplete=off" and "never honor autocomplete=off") are good.

https://bugs.chromium.org/p/chromium/issues/detail?id=914451#c66

They are under the impression that websites won't use this correctly and have decided not to apply it, suggesting the following advice:

In cases where you want to disable autofill, our suggestion is to utilize the autocomplete attribute to give semantic meaning to your fields. If we encounter an autocomplete attribute that we don't recognize, we won't try and fill it.

As an example, if you have an address input field in your CRM tool that you don't want Chrome to Autofill, you can give it semantic meaning that makes sense relative to what you're asking for: e.g. autocomplete="new-user-street-address". If Chrome encounters that, it won't try and autofill the field.

https://bugs.chromium.org/p/chromium/issues/detail?id=587466#c10

Although this "suggestion" currently works for me it may not always hold true and it looks like the team is running experiments, meaning the autocomplete functionality could change in new releases.

It's silly that we have to resort to this, but the only sure way is to try and confuse the browser as much as possible:

Name your inputs without leaking any information to the browser, i.e. `id="field1"` instead of `id="country"`.

Set `autocomplete="do-not-autofill"`, basically use any value that won't let the browser recognize it as an autofillable field.

Jan 2021: `autocomplete="off"` does work as expected now (tested on Chrome 88 macOS).

For this to work be sure to have your input tag within a Form tag

Sept 2020: `autocomplete="chrome-off"` disables Chrome autofill.

Original answer, 2015:

For new Chrome versions you can just put `autocomplete="new-password"` in your password field and that's it. I've checked it, works fine.

Got that tip from Chrome developer in this discussion: https://bugs.chromium.org/p/chromium/issues/detail?id=370363#c7

P.S. Note that Chrome will attempt to infer autofill behavior from name, id and any text content it can get surrounding the field including labels and arbitrary text nodes. If there is a autocomplete token like `street-address` in context, Chrome will autofill that as such. The heuristic can be quite confusing as it sometimes only trigger if there are additional fields in the form, or not if there are too few fields in the form. Also note that `autocomplete="no"` will appear to work but `autocomplete="off"` will not for historical reasons. `autocomplete="no"` is you telling the browser that this field should be auto completed as a field called `"no"`. If you generate unique random `autocomplete` names you disable auto complete.

If your users have visited bad forms their autofill information may be corrupt. Having them manually go in and fix their autofill information in Chrome may be a necessary action from them to take.

Problem

I have been running into issues with the chrome autofill behavior on several forms. The fields in the form all have very common and accurate names, such as "email", "name", or "password", and they also have `autocomplete="off"` set. The autocomplete flag has successfully disabled the autocomplete behavior, where a dropdown of values appear as you start typing, but has not changed the values that Chrome auto-populates the fields as. This behavior would be ok except that chrome is filling the inputs incorrectly, for example filling the phone input with an email address. Customers have complained about this, so it's verified to be happening in multiple cases, and not as some some sort of result to something that I've done locally on my machine. The only current solution I can think of is to dynamically generate custom input names and then extract the values on the backend, but this seems like a pretty hacky way around this issue. Are there any tags or quirks that change the autofill behavior that could be used to fix this?

Original source

Related problems