How to disable Chrome autocomplete feature?

Question

We want to disable autocomplete in Chrome browser in our React JavaScript application. We have tried bunch of solution available on the Internet but nothing wor

Answer 1

Do autocomplete="new-password" to disable autocomplete.

Answer 2

The only hack that worked for me is to create hidden input and add random number for the original input name:

<input type="text" name="" value="" readOnly={true} style={{display: "none"}}/>
<input
  type="text"
  name={"address " + Math.random()}
/>

Answer 3

Nothing worked for me including new-password, so this is how I did:

onFocus={(event) => {
  event.target.setAttribute('autocomplete', 'off');
  console.log(event.target.autocomplete);
}}

Answer 4

When using jsx - you have to camel case attributes; so autoComplete="new-password" instead of autocomplete.

Answer 5

I got the same issue with my React project. My solution is to use a random string for autoComplete attribute. Don't use "off", as per Pim, you need to set a invalid value to really turn auto completion off. Please also note the attribute name has to be autoComplete in React.

Answer 6

You can override chrome autofill by add onFocus attribute.

render()
{
  return <input type="text" name="name" value="this is my input" autoComplete="off" onFocus={this.onFocus} />
}

In the onFocus method we need to change "autocomplete" attribute through javaScript.

onFocus = event => {

   if(event.target.autocomplete)
   {
     event.target.autocomplete = "whatever";
   }

};

This solution works for me.

let me know if it works for you ;)