CODEWITHSUNDEEP
htmlgoogle-chromewebautocompleteautofill
Phil Norfleet
Phil Norfleet

Reputation: 85

Chrome autofills incorrect data type

On my site, there are two fields on the sign in page: one for email, one for password. If I have already signed up, log out, and go back to sign in, Chrome autofills the username into the email text box instead of the email address. 

<div class="inputs">
      <%= devise_error_messages! %>
      <label id="maincontent" class="control-label sr-hidden" for="email">Email Address</label>
      <input id="email-input" name="email" type="email" required='true' autocompletetype='email' autofocus='true' placeholder='Enter your email address...'/>      
      <label class="control-label sr-hidden" for="password">Password</label>
      <%= f.password_field :password, :required => false, :placeholder => "Enter your password...", :id => "password" %>
</div>

In addition, if I delete the password field altogether, no autofill happens at all in the email field and it is left blank. If you click in the field, the drop down autocomplete menu pops up, however.

EDIT[SOLVED]: I switched the name and email fields on the sign up page

chrome assigns a ‘default login credential’ status to whatever field is directly above the password on the sign up page

it recalls that credential automatically for autofill in the field above a password field on the sign in page

it requires one to go to settings>passwords and forms > manage passwords and deleting the erroneous default, and then signing in/up again on the corrected forms

Upvotes: 2

Views: 4533

Answers (3)

adinas
adinas

Reputation: 4550

You can control what is auto filled by adding a autocomplete attribute to the input tag as explained here: https://developers.google.com/web/fundamentals/design-and-ux/input/forms/#use_metadata_to_enable_auto-complete

For example

<input type="text" autocomplete="name">

Will tell Chrome to auto-enter the name. See the entire list at the link above

Upvotes: 0

theblang
theblang

Reputation: 10425

Yeah, this answer also confirms the behavior of autofilling an email or login for a text input directly before a type="password" input. You could also do something like this just before the password input to stop it:

<input name="block-autocomplete" style="opacity: 0.0; width: 1px; height: 1px; position: absolute;" tabindex="-1">

Upvotes: 4

Phil Norfleet
Phil Norfleet

Reputation: 85

Switched the name and email fields on the sign up page, fixed it.

chrome assigns a ‘default login credential’ status to whatever field is directly above the password on the sign up page

it recalls that credential automatically for autofill in the field above a password field on the sign in page

it requires one to go to settings>passwords and forms > manage passwords and deleting the erroneous default, and then signing in/up again on the corrected forms

Upvotes: 4

Related Questions