Home > Software engineering >  How is Chrome detecting an input field as credential Autofill?
How is Chrome detecting an input field as credential Autofill?

Time:01-13

I have some input fields in my html DOM which have absolutely nothing special, but Chrome offers me the saved credentials when I click on it. This is annoying if you have a field which only contains a persons name for example. As this is not on all of my input fields, there must be a reason why Chrome means that this is a credential field? Does anyone know what is triggering Chrome to offer his credential auto-complete window on an input field?

This is an example:

<label><input type="text"  value=""></label>

.filterInput /* input box for edit window */.  
{
    font-size: 14px;
    font-weight: normal;
    width: 97%;
    height: 16px;
    color: var(--filter-text-color);  
}


                

CodePudding user response:

This article may have helpful information regarding your issue. Hope it helps.

Disabling-Chrome-Autofill

Key bits of information that seem to be the most relevant to your issue:

Use autocomplete="false" instead of autocomplete="off" as the latter does not work on Chrome. (Some say it works, others say it does not. You'll just have to test it yourself)

Here's a quote from the article -

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.

As well as this -

Chrome now ignores . Therefore my original workaround (which I had deleted) is now all the rage.

Simply create a couple of fields and make them hidden with "display:none". Example:

<!-- fake fields are a workaround for chrome autofill getting the wrong fields -->
<input style="display: none" type="text" name="fakeusernameremembered" />
<input style="display: none" type="password" name="fakepasswordremembered" />

CodePudding user response:

Using this link

Disabling Chrome Autofill

and trying many things I could find a solution for my problem.

As I do not use forms, I just put a

<form action = "javascript:void(0)"></form>

around the input fields which trigger the autocomplete on mistake.

  • Related