htmlbrowserautocompleteweb-deployment-project

Browser credential autocompletion issue when there is a password field on page without email field


In laravel jetstream standard user-profile-managing scaffolding there is a page http://127.0.0.1:8000/user/profile where input fields with type="password" can be found without e-mail field alone. This is done to let user change the password.

If there is any other field with type="text" or type="search" it would be automatically filled in with email like this:

Wrong looking search field

But when I add additional input field type="email" (of course this field can be hidden) it looks normally like it should look:

Normally looking search field

This issue appears only when browser "remembers" the password.

So the question is it ok to put additional "email" field to trick the browser?

Is there any other better way of doing it?

Update1: Hidden field does not work. Only when it is visible...

Update2: Instead of hidden, field can be of zero width.

Update3: Another thing that works - wrap search field in form tags.


Solution

  • Wrapping the search field in it's own form tag will help.

    Additionally, wrapping the contents of other forms in its own form tag will also help. Otherwise, the browser will think that the whole page is a single form and will try to autofill.

    It is best practice to wrap each form in its own form tag with different IDs/names to help the browser understand that each of them is different and not related.