Chrome autofills username into random text input
Asked Answered
C

4

25

This is happening on an asp.net webforms application, using Chrome Version 72.0.3626.109 (Official Build) (64-bit).

The site is password-protected. The user logs in with a username and password. After a successful login the user is redirected to the "Loan Search" page. The Loan Search page contains a handful of text inputs.

The problem is Chrome will autofill my username into one of the text inputs (see image). "tregan" is the username I entered into the login page.

enter image description here

Chrome always selects this particular text input to autofill the username ("Contact Mailing Address"). This is happening to myself and several dozen other users of our web site.

Any idea why Chrome is doing this autofill, and is there anything I can do to prevent it? I cleared my Chrome autofill cache, but that did not fix the problem.

Cardboard answered 15/2, 2019 at 14:32 Comment(6)
Chrome does this by default to try to help users fill out forms. You can control this in ASP by adding autocomplete="off" to your ASP:TextBox declaration or you can add it to your code-behind by doing TextBoxID.Attributes.Add("autocomplete", "off");Castellano
@dvo, I don't want to turn off auto-filling. I want Chrome to stop auto-filling my username into this particular field. It seems inexplicable.Cardboard
You can try to specify the AutoCompleteType for the field. For example, if you need an email field, you can do <asp:TextBox runat="server" ID="TextBoxID" AutoCompleteType="Email" /> then Chrome should only autofill with cached emails. There are a lot of options for AutoCompleteType if you look at the VS intellisense. Give that a shot and see if that solves your problem.Castellano
Thanks @dvo, but that has no effect. I also Googled it and found a huge number of complaints that AutoCompleteType is ignored by Chrome. In any case I don't really want to turn off autofilling, I just want Chrome to stop autofililng my username into that particular input where it makes no sense.Cardboard
Interesting. Sorry that didn't help. I almost always just disable the autofill because I rarely have any need for it. I'll keep looking with you. Hope you can find an easy solution.Castellano
Please advise your users to report this issue to Google with Alt+Shift+I or ⋮→Help→Report an issue to encourage Google Chrome to fix this issue.Dodi
C
23

The answer is to add an invisible text input to the asp.net form called "username".

Several years ago we were having the same problem with a different input. The answer was to add an invisible input of type "password", as explained in this SO answer, scroll down to the phrase "It is so simple and tricky...":

Disabling Chrome Autofill

Below is the complete fix, I added these two elements inside the form element in our site's master page. Per @Jeff_Mergler's comment below, put these inputs at the top of your form tag:

<input type="text" id="username" style="width:0;height:0;visibility:hidden;position:absolute;left:0;top:0" />
<input type="password" style="width:0;height:0;visibility:hidden;position:absolute;left:0;top:0" />
Cardboard answered 15/2, 2019 at 15:34 Comment(4)
Works! Note: this only worked when I placed the elements above at the very top of the form element before all other elements. It failed to work when placed them at the bottom so make sure to put them right below opening form tag. <form ... > <input type="text" id="username" style="width: 0; height: 0; visibility: hidden; position: absolute; left: 0; top: 0" /> <input type="password" style="width: 0; height: 0; visibility: hidden; position: absolute; left: 0; top: 0" />Flimsy
I can't believe we're having to do such messy workarounds like this just to prevent Chrome from autofilling a field. It's turned into such a horrible browser.Pothead
best answer i got so farAdaline
I have been using this trick in mvc for long, you can add it inside top _layout and all nested layouts etc would be safe from chrome attack, but found today that in webform application it does not work by adding to .Master page, instead you need to add it on each page :)Hixon
D
2

Some more ways to try to workaround this:

  • Add autocomplete="off" to the <form> and/or to the <input>
  • Change the field's name/id to something that does not have "name" or "user" in it
  • If it is not already inside <form> wrap the element with empty <form> tag
  • Randomize the name attribute of the input, or use data-name instead of name. You'll have to change the code that process the data accordingly.

Also I think it'll help to report this issue to Google via ⋮→Help→Report an issue (or Alt+Shift+I) to encourage them to fix these issues.

Dodi answered 14/3, 2019 at 11:54 Comment(1)
Thanks for the comment. I am seeing this also, but google is intentionally ignoring autocomplete="off". This is happening for me on fields which do not have name/id with "name" or "user" in them. The fields are wrapped inside <form> tags. data-name could work for fields handled w/ AJAX calls.Willem
B
1

I was facing the same issue, i found a fix by wrapping my div inside a form tag and added a property autocomplete="off" in the form tag.

...... .....
Burroughs answered 2/3, 2021 at 5:17 Comment(0)
O
0

Same here. This needs to be resolved by chrome. This is just dumb to have to add tags around textboxes. Also, quick tip to anyone needing to add form tag without having to re-do your CSS. Add "display:contents;" to the form. It will act as if its not even there.

Overton answered 13/9, 2021 at 0:54 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.