"AutoComplete=Off" not working on Google Chrome Browser [duplicate]

Question

I know there is one similar question on Stackoverflow, but none of the solution there worked for me.

<form autocomplete="off" id="search_form" method="post" action="">     <input autocomplete="off" type="text" /> </form> 

As you can see, I put autocomplete=off on BOTH the form and the input field, but Google Chrome still displays this autocompletion list. This doesn't happen in other browsers like Firefox and Safari.

Any other solution other than putting autocomplete=off on the form tag??

Answer 1

This is due to a design decision made by Chrome (arguably any Chrome user wants this behaviour).

The reason for this is what Google calls priority of constituencies:

1. The user is king! What they want matters most.
2. The user wants to use a password or autofill manager.
3. The web application says it doesn't want the form values to be saved.
4. The user's choice is more important, so the form values are retained.

There are ways to work round, but it's highly likely that those will be fixed in future Chrome versions as the Chrome developers regard their behaviour as correct and your workaround as a bug.

Even while your workaround does work it creates confusing behaviour for the user - they expect autofill to work according to their settings.

Many users already chose to ignore app autocomplete settings with plug-ins or scripts that just remove any autocomplete=off in the page - they already had that choice anyway.

You're best off designing with the assumption that autocomplete can work and accounting for that.

Personally I hate it when sites don't recall my password and override those that do with browser extensions. However I also create applications for my job and there recalling passwords is seen as a security risk, as a user might leave their machine unlocked. In my personal opinion users not locking their machines is an issue for local IT, not the application, and local IT can disable all password autocomplete for all web applications if their users can't be trusted.

Unfortunately to pass the security checks some applications still have to disable autocomplete, there are ways to do it, but they're all horrible. The first hack is to make the password input completely new:

<input type="hidden" name="password" id="realPassword" /> <input type="password" name="{randomly generated}"      onchange="document.getElementById('realPassword').value = this.value" /> 

I've inlined everything to simplify, but this should give you an idea of the hack - no plug in or browser can auto-fill an input with a completely new name.

This solution breaks if you properly build in ARIA and labels (as that lets the browser/extension find and autofill the input from the label).

So option 2, also horrible, is to wait until after the autocomplete has fired and then blank the field:

<input type="text" name="username"      onchange="window.setTimeout(function() {          document.getElementById('password').value = '';      }, 100)" /> <input type="password" id="password" /> 

Like I said, nasty.