definet
definet

Reputation: 43

Preventing Browser Text Input Suggestions 2021 chrome version 88.0.4324.190

How To Preventing Browser Text Input Suggestions from browser cookie, autocomplete="off" and others are not work.. Chrome Version : 2021 chrome version 88.0.4324.190

readonly is work for autofill its work proper, but autosuggestion is not.

 <input type="email" class="form-control" id="email" name="email" placeholder="Enter Email" readonly onfocus="this.removeAttribute('readonly');" style="background-color: white;" autocomplete="off">   
<input type="password" class="form-control" id="Password" name="password" minlength="6" placeholder="Enter Password">

enter image description here

Upvotes: 4

Views: 2338

Answers (2)

Mohammad Malek
Mohammad Malek

Reputation: 634

what you want is here

change type="password" to type="text" and used in your input -webkit-text-security: disc !important;

<input type="text" class="form-control" id="Password" name="password" minlength="6" placeholder="Enter Password" style="-webkit-text-security: disc !important;">

Upvotes: 2

Luiz Vaz
Luiz Vaz

Reputation: 1839

The only thing that still works in Chrome is creating random name not related to the field. Like autocomplete="new-password" to password field name.
Seems to be wrong, but it's a workaround.

So for your field named email, try to put autocomplete="new-email".

Even as stated as working in the SO below, autocomplete="off" still buggy:
Disabling Chrome Autofill

Also note that autocomplete="no" will appear to work but autocomplete="off" will not for historical reasons. autocomplete="no" is you telling the browser that this field should be auto completed as a field called "no". If you generate unique random autocomplete names you disable auto complete.

You need to keep in mind that's a feature from the Password Manager.
This is correctly stated here by Mozilla:
Preventing autofilling with autocomplete="new-password"

And why it's not always possible to prevent:
Browser compatibility

Note: In most modern browsers, setting autocomplete to "off" will not prevent a password manager from asking the user if they would like to save username and password information, or from automatically filling in those values in a site's login form. See the autocomplete attribute and login fields.

Solution #1:

As you can see, the autosuggestion show From this website.
As workaround, you need to change the fieldname from name="email" to something else, like name="user-email". And handle the change inside your server logic.

Again in your server logic, generate a random name every time page is shown, like a UUID autocomplete="c821c4f0-7be8-11eb-9439-0242ac130002"

Solution #2:

Replace the input kind type="email" to type="text".

html:

<input type="text" class="form-control" id="user-email" name="user-email" placeholder="Enter Email" readonly onfocus="this.removeAttribute('readonly');" autocomplete="off" />

javascript:

window.onload = function () {
    init();
}

function init() {
    let x = document.getElementById("user-email");
    if (x) x.setAttribute("type", "email");
}

Solution #3:

Add hidden fields before the real one:
HTML - Disable Password Manager

PS: Don't forget to place autocomplete="off" on the form which field belongs

Upvotes: 1

Related Questions