Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
How to turn off password and email/username autocomplete.
<!--
<form autocomplete="off"> will turn off autocomplete for the form in most browsers
except for username/email/password fields
-->
<form autocomplete="off">
<!-- fake fields are a workaround for chrome/opera autofill getting the wrong fields -->
<input id="username" style="display:none" type="text" name="fakeusernameremembered">
<input id="password" style="display:none" type="password" name="fakepasswordremembered">
<!--
<input autocomplete="nope"> turns off autocomplete on many other browsers that don't respect
the form's "off", but not for "password" inputs.
-->
<input id="real-username" type="text" autocomplete="nope">
<!--
<input type="password" autocomplete="new-password" will turn it off for passwords everywhere
-->
<input id="real-password" type="password" autocomplete="new-password">
</form>
@sonudhakar

This comment has been minimized.

Copy link

@sonudhakar sonudhakar commented Apr 17, 2017

Thanks

@sanjaykumar2338

This comment has been minimized.

Copy link

@sanjaykumar2338 sanjaykumar2338 commented Dec 21, 2017

Thanks, it's great.

@huntertran

This comment has been minimized.

Copy link

@huntertran huntertran commented Dec 29, 2017

for Chrome 63, this workaround does not work anymore :(

@atrhacker

This comment has been minimized.

Copy link

@atrhacker atrhacker commented Jan 10, 2018

  <!--
    <input type="password" autocomplete="new-password" will turn it off for passwords everywhere
    -->
  <input id="real-password" type="password" autocomplete="new-password">

Does not work in firefox. If someone has a workaround, don't hesitate.

@palaniichukdmytro

This comment has been minimized.

Copy link

@palaniichukdmytro palaniichukdmytro commented Jan 18, 2018

The same, does not work in Chrome 63, any idea?

@ramamusc

This comment has been minimized.

Copy link

@ramamusc ramamusc commented Jan 18, 2018

try autocomplete="false" instead. Used it on Chrome for password and it worked

@jeffmcmahan

This comment has been minimized.

Copy link

@jeffmcmahan jeffmcmahan commented Jan 19, 2018

@ramamusc - autocomplete="false" is not working in Chrome Canary (65).

@aarcangeli

This comment has been minimized.

Copy link

@aarcangeli aarcangeli commented Jan 24, 2018

This is my personal workaround:

document.querySelectorAll(".pw-workaround input[type=password]").forEach(function (el) {
    el.addEventListener("keydown", function (event) {
        if (event.keyCode === 38 || event.keyCode === 40) {
            event.stopPropagation();
            event.preventDefault();
        }
    });

    function reset() {
        if (el.value === "") {
            el.value = " ";
            var oldColor = el.style.color;
            var oldCaretColor = el.style.caretColor;
            el.style.color = 'transparent';
            el.style.caretColor = 'black';
            if (el.setSelectionRange !== undefined) {
                el.setSelectionRange(0, 0);
            }
            setTimeout(function () {
                el.style.color = oldColor;
                el.style.caretColor = oldCaretColor;
                var value = el.value;
                if (value.endsWith(" ")) {
                    el.value = value.substr(0, value.length - 1);
                }
            }, 0);
        }
    }

    el.addEventListener("mouseup", reset);
    el.addEventListener("input", reset);
})

jsfiddle: https://jsfiddle.net/nxh8okuk/

@sijorsijo

This comment has been minimized.

Copy link

@sijorsijo sijorsijo commented Feb 6, 2018

Can we do this dynamically ? Other than Changing the html , using js

@DeepikaSuretek

This comment has been minimized.

Copy link

@DeepikaSuretek DeepikaSuretek commented Feb 26, 2018

Its not working in firefox on switching input via tab

@BennyPolak

This comment has been minimized.

Copy link

@BennyPolak BennyPolak commented Mar 15, 2018

Well, there is a very good way to solve this problem easily for all browsers and versions.

First, you need to realise that the only reason we use type="password" is that the person-behind-your-chair can't see the password on your screen. Right?

Now, we all running up against this "Remind Password" native browser thing that always will popup on type="password".

With the reason for using the type="password" in mind: why not using type="text" and give it a font-family which makes the text unreadable? Like dots, or what ever.
Sure, your placeholder text will be messed-up either, but you can find a better way around that one ;)

Goodluck folks.

@pepijnve

This comment has been minimized.

Copy link

@pepijnve pepijnve commented Mar 16, 2018

With the reason for using the type="password" in mind: why not using type="text" and give it a font-family which makes the text unreadable? Like dots, or what ever.

That's pretty bad advice to give people. This allows the cleartext password to be obtained by simply copy/pasting the value to a text editor.

@terrylinooo

This comment has been minimized.

Copy link

@terrylinooo terrylinooo commented Mar 29, 2018

Use jQuery disableAutoFill plugin.

$('#login-form').disableAutoFill();

Document:
https://github.com/terrylinooo/jquery.disableAutoFill

Demo:
https://terrylinooo.github.io/jquery.disableAutoFill/

@Andreasrn

This comment has been minimized.

Copy link

@Andreasrn Andreasrn commented Apr 11, 2018

That's pretty bad advice to give people. This allows the cleartext password to be obtained by simply copy/pasting the value to a text editor.

Take into account that somebody could open inspect element window and just change
<input type='password'>
to
<input type='text'>

and the password would be shown as plain text.

@johnmarinelli

This comment has been minimized.

Copy link

@johnmarinelli johnmarinelli commented Apr 12, 2018

Seems like autocomplete="off" works for FF (v59.0.2) but not Chrome v65.
autocomplete="new-password" works for Chrome, but not FF.

welcome to the internet

@lv-3

This comment has been minimized.

Copy link

@lv-3 lv-3 commented Apr 23, 2018

What is the difference between "nope" , "new-password" and "current-password" ?

@mehranhassani

This comment has been minimized.

Copy link

@mehranhassani mehranhassani commented Apr 23, 2018

Thanks!

@SunGuoQiang123

This comment has been minimized.

Copy link

@SunGuoQiang123 SunGuoQiang123 commented May 10, 2018

my solution is to add a full hidden form with a username field and a password field , still the real password input should set autocomplete = 'new-password'

@yupeilin123

This comment has been minimized.

Copy link

@yupeilin123 yupeilin123 commented May 11, 2018

only set autocomplete = 'new-password'. this is ok

@Ray-Hughes

This comment has been minimized.

Copy link

@Ray-Hughes Ray-Hughes commented May 23, 2018

Since Chrome 63 display:none is ignored. I updated mine to use opacity - opacity: 0;position: absolute;

<input id="username" style="opacity: 0;position: absolute;" type="text" name="fakeusernameremembered">
<input id="password" style="opacity: 0;position: absolute;" class="cp-password_stub" type="password" name="fakepasswordremembered">
@istarkov

This comment has been minimized.

Copy link

@istarkov istarkov commented Jun 19, 2018

The only working way we found is not use id and name attributes on inputs,
and also not use <label> for inputs (as chrome can use label text for autocomplete) or mutate label text with zero width spaces like

const ZERO_WIDTH_SPACES = ['\u200C', '\u200B'];

export const mutateStringWithZeroSpaces = (str: string, seed: number) => {
  let initial = seed;
  let result = '';
  let i = 0;

  while (initial > 0) {
    if (i < str.length) {
      result += str[i];
      i += 1;
    }
    result += ZERO_WIDTH_SPACES[initial & 0x1];
    initial >>= 1;
  }

  return result;
};

using getTime as a seed for example.

@darthsimplicus

This comment has been minimized.

Copy link

@darthsimplicus darthsimplicus commented Jul 2, 2018

Why is it not possible to turn off autocomplete for a form field?

Why is it so hard, compare it with a ligth switch, if you turn off the lights what happens??? Look at it this way...

@NOYB

This comment has been minimized.

Copy link

@NOYB NOYB commented Jul 8, 2018

darthsimplicus
It's not difficult at all. But they are pushing an agenda that is contrary to the html spec. Forcing their will on people rather than justifying spec change is their evil way. Meet the new MS. Same as the old MS. (Meet the new boss. Same as the old boss)

@NOYB

This comment has been minimized.

Copy link

@NOYB NOYB commented Jul 9, 2018

They are even stooping so far now as triggering on the keyword/string "fake" used in within the name or label. LOL how pathetic they have become.
Chrome Version 67.0.3396.99 (Official Build) (64-bit)

@derakhshanfar

This comment has been minimized.

Copy link

@derakhshanfar derakhshanfar commented Jul 23, 2018

i use this method:

  <form onSubmit={this.onFormSubmit}>
        <input id="username" style={{ display: 'none'}} type="tell" name="username" />
        <input id="password" style={{ display: 'none'}} type="password" name="password" />
         <input type="tell" name="username" />
        <input type="password" name="password" />
   <form>

if i change the name of input to something else except username or password, it doesn't work for example:
<input id="username" style={{ display: 'none'}} type="tell" name="fakeuserName" />

name of this element is fakeuserName, that's why it doesn't work!

@SampsonCrowley

This comment has been minimized.

Copy link

@SampsonCrowley SampsonCrowley commented Jul 30, 2018

out of curiosity why are you trying so hard to keep me from being able to use my password manager?

if it shouldn't fill an existing password, use 'new-password' otherwise leave it alone

@atodd-geoplan

This comment has been minimized.

Copy link

@atodd-geoplan atodd-geoplan commented Jul 31, 2018

@SampsonCrowley because you do not get to choose the level of security I require for the users of my system OK?

@ezfe

This comment has been minimized.

Copy link

@ezfe ezfe commented Aug 1, 2018

@atodd-geoplan Your users will just copy and paste passwords and dislike you.

@ivanhoe011

This comment has been minimized.

Copy link

@ivanhoe011 ivanhoe011 commented Aug 10, 2018

@atodd-geoplan Please explain what additional level of security do you get with autocomplete="off"?!

People with either manually copy&paste the password which is a bad UX, or will choose to use some simplistic password that is easy to remember and type. Either way it's just stupid.

It's just like those characters (for some reason usually IT guys from some bank with zero secops experience) who come up with crazy complicated password validation rules believing that it makes it safer, not realizing that it actually reduces the security in the end because people then choose far worse passwords.

@martiuh

This comment has been minimized.

Copy link

@martiuh martiuh commented Aug 21, 2018

Hi guys, apparently if the input tag has no name="any-name" property then the autofill won't trigger.
<input type="password" autocomplete="off" /> and that did the trick for me, hope this works for you as well.

@ghost

This comment has been minimized.

Copy link

@ghost ghost commented Aug 31, 2018

Thanx

@chhumsina

This comment has been minimized.

Copy link

@chhumsina chhumsina commented Sep 26, 2018

i use this method:

  <form onSubmit={this.onFormSubmit}>
        <input id="username" style={{ display: 'none'}} type="tell" name="username" />
        <input id="password" style={{ display: 'none'}} type="password" name="password" />
         <input type="tell" name="username" />
        <input type="password" name="password" />
   <form>

if i change the name of input to something else except username or password, it doesn't work for example:
<input id="username" style={{ display: 'none'}} type="tell" name="fakeuserName" />

name of this element is fakeuserName, that's why it doesn't work!

Great work, Thanks

@Pitus660

This comment has been minimized.

Copy link

@Pitus660 Pitus660 commented Oct 2, 2018

With "autocomplete" = "new-password" works for me.
Thanks

@amithbsrikanth

This comment has been minimized.

Copy link

@amithbsrikanth amithbsrikanth commented Oct 7, 2018

Hi guys, there is 1 trick you can use to make the autofill stop in most browsers, making type="search".
Eg: <input type="search" name="email">
this will work for email/username for passwords you have to go the CSS way.

@ConnorsFan

This comment has been minimized.

Copy link

@ConnorsFan ConnorsFan commented Oct 9, 2018

@ezfe @ivanhoe011 - What about an application that can be used by 100 different users on a given workstation? I am working on such an application. Each user has to write a text, save it, and be allowed to edit it later. We want each user to login into the application with his own account, and not have to create 100 user accounts on the workstation. We don't need DoD security level but the username and password fields should be empty when starting the application, and autocomplete should be turned off.

@jdgregson

This comment has been minimized.

Copy link

@jdgregson jdgregson commented Oct 18, 2018

A better idea is to leave the feature enabled and stop trying to control the user's browser's behavior.

@AwokeKnowing

This comment has been minimized.

Copy link

@AwokeKnowing AwokeKnowing commented Oct 19, 2018

@jdgregson There are cases that hurt the user.

For example an admin tool where you type in usernames for users, such as a corporate HR tool. For example, you have a screen that let's you update user profile info, and only saves 'what you changed' ignoring the blanks. But browser throws SOMEONE ELSE'S username into this user's profile field, or fills out the 'set new password' field with SOME RANDOM PAST USER'S PASSWORD.

Or also a set up your account form, where different fields are hidden according to account logic, and should be empty, but browser adds values.

Microsoft got into huge trouble trying to force certain user experiences against the code of the dev. Chrome will become IE if it continues this nonsense.

Defaults are fine, but the dev needs full final control.

@pixels-farm

This comment has been minimized.

Copy link

@pixels-farm pixels-farm commented Nov 28, 2018

As all i've read - hadn't been working for me (tested on Chrome Version 70.0.3538.102 (Official Build) (64-bit) - on Linux Ubuntu 18) - so i've ended up with my own "trick". I will leave it here - maybe for someone it is the last chance to make it.
1 Step. - If field is empty - to prevent browser from autofilling the email or password - you should make this field not empty. Just put something like ‌ (or other non printable character) into the field's value attribute on page render.
2 Step - As field wasn't empty - it stays untouched till you clear this field in the way you like.

hope it will help somebody...

@simeyla

This comment has been minimized.

Copy link

@simeyla simeyla commented Jan 3, 2019

@ivanho011 @ezfe The cardio machines at my gym have a Facebook login page.
Some poor person has got their email and password stuck in the browser history.
I tried to delete it for them but it's been stuck there for weeks now even though they since changed it.

So there are a very good reason for needing this in some environments :-)
But yes for sure don't impose this unless it's absolutely necessary in whatever you're developing.

@michalstepan

This comment has been minimized.

Copy link

@michalstepan michalstepan commented Jan 16, 2019

In case that someone struck on the solution as I did (Chrome + Firefox support), this answer seems to solve the problem.

Basicaly you set up new font with only specified characters as css styles:
@font-face { font-family: "password-mask"; src: url(data:font/woff;charset:utf-8;base64,d09....see SO answer..AAAA) format(" .password-input { font-family: password-mask; } .password-input::placeholder { font-family: initial; }

Then you assign the class to your password field with type="text":
<input class="password-input"name="pw" id="pw" type="text">

Username is solved easier by specifiyng type 'search':
<input name="username" type="search">

@ZigZapps

This comment has been minimized.

Copy link

@ZigZapps ZigZapps commented Feb 11, 2019

What worked for me I just set the user field to type="search" and password field autocomplete="off"

<input name="user" type="search">
<input name="pass" type="password" autocomplete="off">
@genixo-basim

This comment has been minimized.

Copy link

@genixo-basim genixo-basim commented Feb 15, 2019

Well, there is a very good way to solve this problem easily for all browsers and versions.

First, you need to realise that the only reason we use type="password" is that the person-behind-your-chair can't see the password on your screen. Right?

Now, we all running up against this "Remind Password" native browser thing that always will popup on type="password".

With the reason for using the type="password" in mind: why not using type="text" and give it a font-family which makes the text unreadable? Like dots, or what ever.
Sure, your placeholder text will be messed-up either, but you can find a better way around that one ;)

Goodluck folks.

This answer is very bad practice. Please don't follow this...

@gamalielwkr

This comment has been minimized.

Copy link

@gamalielwkr gamalielwkr commented Feb 20, 2019

Hi guys,

I just have a tricky solution for this.
I tried to add a div with display none style as a wrapper, then it has an without another attributes.
So the structure looks like this.

<form>
  <div style="display: none">
    <input type="password">
  </div>

  <!-- Place your another inputs right here... -->
</form>

Hope this works.

@richlv

This comment has been minimized.

Copy link

@richlv richlv commented Feb 21, 2019

First, everybody: DON'T DO THIS. It is a stupid idea that has been propagated too far.

@atodd-geoplan, the responses by @ezfe and @ivanhoe011 explain the situation well. If you do this to your users, they will:

  • hate you
  • do something else with their passwords that will make the security worse (simple passwords etc)

If those are actually your users on platforms you control, you just disable password remembering feature in their browsers. You might still run into the two problems above, but at least you won't be messing up in a more global way.

@ConnorsFan, if you have a browser that is used on a shared system by hundreds of users, you disable password saving feature in that browser. Easy, works, and is actually more secure.

@AwokeKnowing, unexpectedly auto-filling some fields in management forms is a real problem. It could be solved by all browsers obeying some simple flag... if there were no assholes abusing the flag for real login forms.

You, people here trying to mess with users, are the reason why browsers have to do extra work to be useful for their users.

@shubhamyugtia001

This comment has been minimized.

Copy link

@shubhamyugtia001 shubhamyugtia001 commented Mar 6, 2019

is there any proper solution for this or not,

because it can cause big loss if it is not working in firefox,
i have used autocomplete = "new-password" and it worked in chrome

@PTC-JoshuaMatthews

This comment has been minimized.

Copy link

@PTC-JoshuaMatthews PTC-JoshuaMatthews commented Apr 3, 2019

To those saying let the browser do what it wants, I think you are missing use cases where this functionality just makes 0 sense. For instance, administration portals where multiple users are being created by a site admin. It would be a security issue if say... the site admin's password gets autofilled into the password box for an employee they are creating and they walk away, come back and because the required password field is already filled they don't know to fill it with the correct password now. Not only that, but they can't even see what password is in it to easily check if they entered it or chrome did. Ultimately user ends up with the wrong password and UI flow is bad because we can't enforce a required password box properly.

@ben-dappen

This comment has been minimized.

Copy link

@ben-dappen ben-dappen commented Apr 3, 2019

@PTC-JoshuaMatthews is correct. There are lots of scenarios where autofilling saved passwords is a huge problem. Two cases we deal with regularly are:

Administrative accounts that are creating/resetting passwords for other users. Having the fields auto-populate is a huge pain and introduces errors.

Shared computers: If you have a terminal in a gym or patient check-in station at a doctors office you obviously don't want the system to remember credentials or allow people to use a password manager.

In this case browsers should just follow the autocomplete='off' standard - I get that they think it's overused (it probably is) but sadly it looks like we have to resort to javascript hacks to get this to work even though there's already a published standard for it.

@greatBigMassive

This comment has been minimized.

Copy link

@greatBigMassive greatBigMassive commented Apr 5, 2019

Hello, I've seen all the different solutions for this and I completely understand why @PTC-JoshuaMatthews and @ben-dappen want this turned off by default. It shoulder really be turned off by default for all browsers and let the user decide if they want the feature turned on by learning about it. It's a pain for developers in environments where multiple people might share the same computer. It's stupid.

Anyway, I've created a solution for this, works in Google and it completely removes the popup window without any crazy hidden input fields or timeouts. You just embed a script and tell it the id of the password field and it does the rest. I must admit, it probably needs "World testing" so I'm expecting people to come back with tweaks but it's out there now.

Fiddle example

@lucaslealdev

This comment has been minimized.

Copy link

@lucaslealdev lucaslealdev commented May 17, 2019

People talking about not doing something that we should allowed to control.
I want to disable this not for login, but for the new account form. There is no benefit in using an already saved password for a new account, the user should be forced to type it in (or paste if using a password manager).

@UnDeAdYeTii

This comment has been minimized.

Copy link

@UnDeAdYeTii UnDeAdYeTii commented May 21, 2019

People talking about not doing something that we should allowed to control.
I want to disable this not for login, but for the new account form. There is no benefit in using an already saved password for a new account, the user should be forced to type it in (or paste if using a password manager).

Exactly. In my case, when an admin is updating a user account (or a user is updating their profile information) the browser is sticking its nose where it doesn't belong, prefilling the password field. It means that every time a user is updated, their password field needs to be stripped prior to saving the form, otherwise they adopt whatever password your browser remembered - which for the admin's case would likely be their password, or one of the other thousands of users' passwords. It's frustrating and I absolutely hate the browsers for ignoring explicit commands to not fill these fields. But hey, what do I know, I'm just a developer of this system - surely the browser devs know what's best in my case /s

I propose the following: autofill="mateimfuckinseriousdontautofillyouprick"

@mauryask

This comment has been minimized.

Copy link

@mauryask mauryask commented Jul 17, 2019

none of above solutions are working in chrome 75.

@runspired

This comment has been minimized.

Copy link
Owner Author

@runspired runspired commented Jul 19, 2019

This gist is pretty old and I'm sure that the right way to do this has evolved since it was written. I don't write the kinds of apps that necessitated this any more so I haven't kept up with techniques.

That said, I'd love to respond to the folks like @richlv that have very obviously never worked on certain kinds of systems where this is a necessity. More broadly speaking I agree that 99% of the time for applications you should not try to turn off password autocomplete.

So when should you? I've encountered three kinds of applications

  1. when you have an app designed to be used my multiple users on one device.
  2. when you have an app designed for multiple accounts on one device with different passwords
    or
  3. when you are presenting a form to someone to create a new password or account (autocomplete tries very hard to fill in the new password field with existing passwords)

In addition to more typical apps that might have these requirements, Javascript applications run a ton of tablet applications that handle hundreds to thousands of users logging in on the device just once (and stupidly saving credentials or giving browsers enough info to decide to autocomplete the next user despite best efforts not to). An example is a table app that collects registrations at a kiosk.

TL;DR There are extremely valid reasons to turn off autocomplete. Stop complaining and go build cool shit.

@richlv

This comment has been minimized.

Copy link

@richlv richlv commented Jul 19, 2019

@runspired, your cases 1 and 2, and the description below, seem to be the cases where the device is controlled by a company, or is always shared by multiple users in any case. The correct solution there is to disable autocomplete in the browser, as it could cause confusion with other websites - you cannot control those.

As for the third case, that is where "autocomplete=off" would fit in wonderfully. If people stop abusing it, it would likely work all over the place.

@lainz

This comment has been minimized.

Copy link

@lainz lainz commented Jan 28, 2020

Thanks, the one that worked for me is form autocomplete="off", I had to disable the entire form, since it was picking a random input that is even not related to login credentials, seems that's using some kind of AI to detect automatically login fields.

@JordonMMG

This comment has been minimized.

Copy link

@JordonMMG JordonMMG commented Jan 31, 2020

I need this functionality because i have a password for inner functionality that isn't related to a user's profile which should be shared across a single team for access. No auto fill should be used on such a field.

new-password did not work for me in the <form> tag. I had to place it in the <input> tag for both password and confirm password.

@gregg-cbs

This comment has been minimized.

Copy link

@gregg-cbs gregg-cbs commented Feb 3, 2020

It looks like Chrome will force a password suggestion when the input is type=password regardless of what you try do.
They want to put the option in the users hands which is fine.

An option for everyone out there is to make the input type=text and use a font that looks like the password dots.

@motsmanish

This comment has been minimized.

Copy link

@motsmanish motsmanish commented Feb 8, 2020

The working solution for Chrome Version 79.0.3945.130 | 80.0.3987.87
Stackoverflow link: https://stackoverflow.com/a/51617163/1228430

@ShivaMiyapuram

This comment has been minimized.

Copy link

@ShivaMiyapuram ShivaMiyapuram commented Feb 19, 2020

autocomplete = 'nope' was working fine in Chrome 79.

Tried using autocomplete = 'any-random-string'. But it's not working in Chrome version 80.

@AliN11

This comment has been minimized.

Copy link

@AliN11 AliN11 commented Feb 27, 2020

You can make it simpler by using only this input between your real inputs (username and password):

<input style="display:none" type="password">
@marena

This comment has been minimized.

Copy link

@marena marena commented Mar 5, 2020

This is my workaround. At the begining of your form insert code below. Inner div with -100vw is there for chrome show password extensions. Like 'Show and Hide Passwords' etc (they adding eye icon image before end body tag).

<div style="position: absolute; width: 0; height: 0; overflow: hidden">
    <div style="position: absolute; left: -100vw">
        <input type="text" name="autocomplete_username">
        <input type="password" name="autocomplete_password" class="egbyvocndjvrioh" autocomplete="off" style="">
    </div>
</div>
@JVwork

This comment has been minimized.

Copy link

@JVwork JVwork commented Mar 8, 2020

Hey there, try this:

  • use the classic autocomplete="off" on the autocomplete input
  • for the autocomplete input, use a name not corresponding to any stuff like address (or parts, in any language), username, etc... for example, just try name="ac"

... so, to wrap it up - autocomplete="off" + name="ac"

@ghost

This comment has been minimized.

Copy link

@ghost ghost commented Mar 20, 2020

I use, autocomplete="off", name="password" , and ++ placeholder="" ++

@lucacerza

This comment has been minimized.

Copy link

@lucacerza lucacerza commented Apr 1, 2020

Hey there,
try this solution:

  1. change the type from "password" to "tel"
    es.
  1. in the add this:
<style> @font-face { font-family: "password-mask"; src: url(data:font/woff;charset:utf-8;base64,d09GRgABAAAAAAusAAsAAAAAMGgAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADsAAABUIIslek9TLzIAAAFEAAAAPgAAAFZjRmM5Y21hcAAAAYQAAAgCAAArYmjjYVVnbHlmAAAJiAAAAEEAAABQiOYj2mhlYWQAAAnMAAAALgAAADYOxVFUaGhlYQAACfwAAAAcAAAAJAqNAyNobXR4AAAKGAAAAAgAAAAIAyAAAGxvY2EAAAogAAAABgAAAAYAKAAAbWF4cAAACigAAAAeAAAAIAEOACJuYW1lAAAKSAAAAUIAAAKOcN63t3Bvc3QAAAuMAAAAHQAAAC5lhHRpeJxjYGRgYOBiMGCwY2BycfMJYeDLSSzJY5BiYGGAAJA8MpsxJzM9kYEDxgPKsYBpDiBmg4gCACY7BUgAeJxjYGScwDiBgZWBgSGVtYKBgVECQjMfYEhiYmFgYGJgZWbACgLSXFMYHIAq/rNfAHK3gEmgASACAIekCT4AAHic7dhl0zDVmUXh5+XFHYK7E0IguFtwt4QQgmtwd3d3d7cED+4SXIO7u7vbsNfaUzU1fyGcu66u1adOf+6uHhgYGGpgYGDwL37/iyEHBoZZcWDQLzUw9NK/7A5if/DA8OwPOfQknBky+0P8/PPPOcd1UJ785frr/Dq/zq/z6/w3zsCgoX/xX74GRsxbcYpRB1iDB/7PGvT/DFGDenBwe8hKD1XpoSs9TKWHrfRwlR6+0iNUesRKj1TpkSs9SqVHrfRolR690r+p9BiVHrPSY1V67EqPU+lxKz1epcev9ASVnrDSE1V64kpPUulJKz1ZpSev9BSVnrLSU1V66kr/ttLTVPp3lZ62/KJSerpKT1/pP1R6hkrPWOmZKj1zpWep9KyVnq3Ss1d6jkrPWem5Kj13peep9LyVnq/S81d6gUr/sdILVnqhSi9c6UUqvWilF6v04pVeotJLVnqpSi9d6WUqvWyll6v08pVeodIrVvpPlf5zpVeq9F8qvXKl/1rpVSr9t0qvWunVKr16pdeo9JqVXqvSa1d6nUqvW+n1Kr1+pTeo9N8rvWGlN6r0xpXepNKbVnqzSm9e6S0qvWWlt6r01pXeptLbVnq7Sm9f6R0qvWOld6r0zpXepdK7Vnq3Su9e6T0qvWel96r03pXep9L7Vnq/Su9f6QMqfWClD6r0wZU+pNKHVvqwSh9e6SMqfWSlj6r00ZU+ptLHVvq4Sh9f6RMqfWKlT6r0yZU+pdKnVvq0Sp9e6TMqfWalz6r02ZU+p9LnVvq8Sp9f6QsqfWGl/1Hpf1b6okpfXOlLKn1ppS+r9OWVvqLS/6r0lZW+qtJXV/qaSl9b6esqfX2lb6j0jZW+qdI3V/qWSt9a6dsqfXul76j0vyt9Z6XvqvTdlb6n0vdW+r5K31/pByr9YKUfqvTDlX6k0v+p9KOVfqzSj1f6iUo/WemnKv10pZ+p9LOVfq7Sz1f6hUq/WOmXKv1ypV+p9KuVfq3Sr1f6jUq/Wem3Kv12pd+p9LuVfq/S71f6g0p/WOmPKv1xpT+p9KeV/qzSn1f6i0p/WemvKv11pb+p9LeV/q7S31f6h0r/WOmfKv1zDfI26KKHED1Y9JCihxI9tOhhRA8rejjRw4seQfSIokcSPbLoUUSPKno00aOL/o3oMUSPKXos0WOLHkf0uKLHEz2+6AlETyh6ItETi55E9KSiJxM9uegpRE8peirRU4v+rehpRP9O9LSify96OtHTi/6D6BlEzyh6JtEzi55F9KyiZxM9u+g5RM8pei7Rc4ueR/S8oucTPb/oBUT/UfSCohcSvbDoRUQvKnox0YuLXkL0kqKXEr206GVELyt6OdHLi15B9Iqi/yT6z6JXEv0X0SuL/qvoVUT/TfSqolcTvbroNUSvKXot0WuLXkf0uqLXE72+6A1E/130hqI3Er2x6E1Ebyp6M9Gbi95C9JaitxK9tehtRG8rejvR24veQfSOoncSvbPoXUTvKno30buL3kP0nqL3Er236H1E7yt6P9H7iz5A9IGiDxJ9sOhDRB8q+jDRh4s+QvSRoo8SfbToY0QfK/o40ceLPkH0iaJPEn2y6FNEnyr6NNGniz5D9JmizxJ9tuhzRJ8r+jzR54u+QPSFov8h+p+iLxJ9sehLRF8q+jLRl4u+QvS/RF8p+irRV4u+RvS1oq8Tfb3oG0TfKPom0TeLvkX0raJvE3276DtE/1v0naLvEn236HtE3yv6PtH3i35A9IOiHxL9sOhHRP9H9KOiHxP9uOgnRD8p+inRT4t+RvSzop8T/bzoF0S/KPol0S+LfkX0q6JfE/266DdEvyn6LdFvi35H9Lui3xP9vugPRH8o+iPRH4v+RPSnoj8T/bnoL0R/Kfor0V+L/kb0t6K/E/296B9E/yj6J9E/K/2/v/npoocQPVj0kKKHEj206GFEDyt6ONHDix5B9IiiRxI9suhRRI8qejTRo4v+jegxRI8peizRY4seR/S4oscTPb7oCURPKHoi0ROLnkT0pKInEz256ClETyl6KtFTi/6t6GlE/070tKJ/L3o60dOL/oPoGUTPKHom0TOLnkX0rKJnEz276DlEzyl6LtFzi55H9Lyi5xM9v+gFRP9R9IKiFxK9sOhFRC8qejHRi4teQvSSopcSvbToZUQvK3o50cuLXkH0iqL/JPrPolcS/RfRK4v+q+hVRP9N9KqiVxO9uug1RK8pei3Ra4teR/S6otcTvb7oDUT/XfSGojcSvbHoTURvKnoz0ZuL3kL0lqK3Er216G1Ebyt6O9Hbi95B9I6idxK9s+hdRO8qejfRu4veQ/SeovcSvbfofUTvK3o/0fuLPkD0gaIPEn2w6ENEHyr6MNGHiz5C9JGijxJ9tOhjRB8r+jjRx4s+QfSJok8SfbLoU0SfKvo00aeLPkP0maLPEn226HNEnyv6PNHni75A9IWi/yH6n6IvEn2x6EtEXyr6MtGXi75C9L9EXyn6KtFXi75G9LWirxN9vegbRN8o+ibRN4u+RfStom8TfbvoO0T/W/Sdou8Sfbfoe0TfK/o+0feLfkD0g6IfEv2w6EdE/0f0o6IfE/246CdEPyn6KdFPi35G9LOinxP9vOgXRL8o+iXRL4t+RfSrol8T/broN0S/Kfot0W+Lfkf0u6LfE/2+6A9Efyj6I9Efi/5E9KeiPxP9uegvRH8p+ivRX4v+RvS3or8T/b3oH0T/KPon0T9rYND/AOaSEScAAHicY2BiAAKmPSy+QEqUgYFRUURcTFzMyNzM3MxEXU1dTYmdjZ2NccK/K5oaLm6L3Fw0NOEMZoVAFD6IAQD4PA9iAAAAeJxjYGRgYADirq+zjOP5bb4ycLNfAIowXCttkUWmmfaw+AIpDgYmEA8ANPUJwQAAeJxjYGRgYL/AAATMCiCSaQ8DIwMqYAIAK/QBvQAAAAADIAAAAAAAAAAoAAB4nGNgZGBgYGIQA2IGMIuBgQsIGRj+g/kMAArUATEAAHicjY69TsMwFIWP+4doJYSKhMTmoUJIqOnPWIm1ZWDq0IEtTZw2VRpHjlu1D8A7MPMczAw8DM/AifFEl9qS9d1zzr3XAK7xBYHqCHTdW50aLlj9cZ1057lBfvTcRAdPnlvUnz23mXj13MEN3jhBNC6p9PDuuYYrfHquU//23CD/eG7iVnQ9t9ATD57bWIgXzx3ciw+rDrZfqmhnUnvsx2kZzdVql4Xm1DhVFsqUqc7lKBiemjOVKxNaFcvlUZb71djaRCZGb+VU51ZlmZaF0RsV2WBtbTEZDBKvB5HewkLhwLePkhRhB4OU9ZFKTCqpzems6GQI6Z7TcU5mQceQUmjkkBghwPCszhmd3HWHLh+ze8mEpLvnT8dULRLWCTMaW9LUbanSGa+mUjhv47ZY7l67rgITDHiTf/mAKU76BTuXfk8AAHicY2BigAARBuyAiZGJkZmBJSWzOJmBAQALQwHHAAAA) format("woff"); } .numeric-password { font-family: password-mask; } .numeric-password::placeholder { font-family: initial; } </style>
@tejaswinikhambe

This comment has been minimized.

Copy link

@tejaswinikhambe tejaswinikhambe commented Apr 3, 2020

Hello ,
I tried above mentioned solutions , but none are working for me in Firefox,
Has anyone got any working solution to off auto complete , which works for all browsers or at least Chrome and FF?

@robertuniqid

This comment has been minimized.

Copy link

@robertuniqid robertuniqid commented Apr 14, 2020

jQuery example, can be easily changed for vanilla JS.

jQuery(document).ready(function(){
  setTimeout( function() {
      jQuery("form").find( '[autocomplete="off"]' ).val( '' );
  }, 500 );
});
@sinha2773

This comment has been minimized.

Copy link

@sinha2773 sinha2773 commented Apr 19, 2020

Worked for me with readonly="" onfocus="this.removeAttribute('readonly');"

For Example:
<form autocomplete="off">
<input type="email" readonly="" onfocus="this.removeAttribute('readonly');" name="email_address" value="">
</form>

@jonathan-rosa

This comment has been minimized.

Copy link

@jonathan-rosa jonathan-rosa commented Apr 24, 2020

FOOL-PROOF IMPLEMENTATION THAT'LL LAST YOU MAYBE 2+YRS:

  1. Get away from type=password, use font-family to make it look like a password.

-moz-text-security: disc was removed from Firefox, so this a cross-platform solution.

@font-face {
	font-family: '<random or static bizarre string>';
	src: url(data:font/woff;base64,d09GRgABAAAAAAusAAsAAAAAMGgAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADsAAABUIIslek9TLzIAAAFEAAAAPgAAAFZjRmM5Y21hcAAAAYQAAAgCAAArYmjjYVVnbHlmAAAJiAAAAEEAAABQiOYj2mhlYWQAAAnMAAAALgAAADYOxVFUaGhlYQAACfwAAAAcAAAAJAqNAyNobXR4AAAKGAAAAAgAAAAIAyAAAGxvY2EAAAogAAAABgAAAAYAKAAAbWF4cAAACigAAAAeAAAAIAEOACJuYW1lAAAKSAAAAUIAAAKOcN63t3Bvc3QAAAuMAAAAHQAAAC5lhHRpeJxjYGRgYOBiMGCwY2BycfMJYeDLSSzJY5BiYGGAAJA8MpsxJzM9kYEDxgPKsYBpDiBmg4gCACY7BUgAeJxjYGScwDiBgZWBgSGVtYKBgVECQjMfYEhiYmFgYGJgZWbACgLSXFMYHIAq/rNfAHK3gEmgASACAIekCT4AAHic7dhl0zDVmUXh5+XFHYK7E0IguFtwt4QQgmtwd3d3d7cED+4SXIO7u7vbsNfaUzU1fyGcu66u1adOf+6uHhgYGGpgYGDwL37/iyEHBoZZcWDQLzUw9NK/7A5if/DA8OwPOfQknBky+0P8/PPPOcd1UJ785frr/Dq/zq/z6/w3zsCgoX/xX74GRsxbcYpRB1iDB/7PGvT/DFGDenBwe8hKD1XpoSs9TKWHrfRwlR6+0iNUesRKj1TpkSs9SqVHrfRolR690r+p9BiVHrPSY1V67EqPU+lxKz1epcev9ASVnrDSE1V64kpPUulJKz1ZpSev9BSVnrLSU1V66kr/ttLTVPp3lZ62/KJSerpKT1/pP1R6hkrPWOmZKj1zpWep9KyVnq3Ss1d6jkrPWem5Kj13peep9LyVnq/S81d6gUr/sdILVnqhSi9c6UUqvWilF6v04pVeotJLVnqpSi9d6WUqvWyll6v08pVeodIrVvpPlf5zpVeq9F8qvXKl/1rpVSr9t0qvWunVKr16pdeo9JqVXqvSa1d6nUqvW+n1Kr1+pTeo9N8rvWGlN6r0xpXepNKbVnqzSm9e6S0qvWWlt6r01pXeptLbVnq7Sm9f6R0qvWOld6r0zpXepdK7Vnq3Su9e6T0qvWel96r03pXep9L7Vnq/Su9f6QMqfWClD6r0wZU+pNKHVvqwSh9e6SMqfWSlj6r00ZU+ptLHVvq4Sh9f6RMqfWKlT6r0yZU+pdKnVvq0Sp9e6TMqfWalz6r02ZU+p9LnVvq8Sp9f6QsqfWGl/1Hpf1b6okpfXOlLKn1ppS+r9OWVvqLS/6r0lZW+qtJXV/qaSl9b6esqfX2lb6j0jZW+qdI3V/qWSt9a6dsqfXul76j0vyt9Z6XvqvTdlb6n0vdW+r5K31/pByr9YKUfqvTDlX6k0v+p9KOVfqzSj1f6iUo/WemnKv10pZ+p9LOVfq7Sz1f6hUq/WOmXKv1ypV+p9KuVfq3Sr1f6jUq/Wem3Kv12pd+p9LuVfq/S71f6g0p/WOmPKv1xpT+p9KeV/qzSn1f6i0p/WemvKv11pb+p9LeV/q7S31f6h0r/WOmfKv1zDfI26KKHED1Y9JCihxI9tOhhRA8rejjRw4seQfSIokcSPbLoUUSPKno00aOL/o3oMUSPKXos0WOLHkf0uKLHEz2+6AlETyh6ItETi55E9KSiJxM9uegpRE8peirRU4v+rehpRP9O9LSify96OtHTi/6D6BlEzyh6JtEzi55F9KyiZxM9u+g5RM8pei7Rc4ueR/S8oucTPb/oBUT/UfSCohcSvbDoRUQvKnox0YuLXkL0kqKXEr206GVELyt6OdHLi15B9Iqi/yT6z6JXEv0X0SuL/qvoVUT/TfSqolcTvbroNUSvKXot0WuLXkf0uqLXE72+6A1E/130hqI3Er2x6E1Ebyp6M9Gbi95C9JaitxK9tehtRG8rejvR24veQfSOoncSvbPoXUTvKno30buL3kP0nqL3Er236H1E7yt6P9H7iz5A9IGiDxJ9sOhDRB8q+jDRh4s+QvSRoo8SfbToY0QfK/o40ceLPkH0iaJPEn2y6FNEnyr6NNGniz5D9JmizxJ9tuhzRJ8r+jzR54u+QPSFov8h+p+iLxJ9sehLRF8q+jLRl4u+QvS/RF8p+irRV4u+RvS1oq8Tfb3oG0TfKPom0TeLvkX0raJvE3276DtE/1v0naLvEn236HtE3yv6PtH3i35A9IOiHxL9sOhHRP9H9KOiHxP9uOgnRD8p+inRT4t+RvSzop8T/bzoF0S/KPol0S+LfkX0q6JfE/266DdEvyn6LdFvi35H9Lui3xP9vugPRH8o+iPRH4v+RPSnoj8T/bnoL0R/Kfor0V+L/kb0t6K/E/296B9E/yj6J9E/K/2/v/npoocQPVj0kKKHEj206GFEDyt6ONHDix5B9IiiRxI9suhRRI8qejTRo4v+jegxRI8peizRY4seR/S4oscTPb7oCURPKHoi0ROLnkT0pKInEz256ClETyl6KtFTi/6t6GlE/070tKJ/L3o60dOL/oPoGUTPKHom0TOLnkX0rKJnEz276DlEzyl6LtFzi55H9Lyi5xM9v+gFRP9R9IKiFxK9sOhFRC8qejHRi4teQvSSopcSvbToZUQvK3o50cuLXkH0iqL/JPrPolcS/RfRK4v+q+hVRP9N9KqiVxO9uug1RK8pei3Ra4teR/S6otcTvb7oDUT/XfSGojcSvbHoTURvKnoz0ZuL3kL0lqK3Er216G1Ebyt6O9Hbi95B9I6idxK9s+hdRO8qejfRu4veQ/SeovcSvbfofUTvK3o/0fuLPkD0gaIPEn2w6ENEHyr6MNGHiz5C9JGijxJ9tOhjRB8r+jjRx4s+QfSJok8SfbLoU0SfKvo00aeLPkP0maLPEn226HNEnyv6PNHni75A9IWi/yH6n6IvEn2x6EtEXyr6MtGXi75C9L9EXyn6KtFXi75G9LWirxN9vegbRN8o+ibRN4u+RfStom8TfbvoO0T/W/Sdou8Sfbfoe0TfK/o+0feLfkD0g6IfEv2w6EdE/0f0o6IfE/246CdEPyn6KdFPi35G9LOinxP9vOgXRL8o+iXRL4t+RfSrol8T/broN0S/Kfot0W+Lfkf0u6LfE/2+6A9Efyj6I9Efi/5E9KeiPxP9uegvRH8p+ivRX4v+RvS3or8T/b3oH0T/KPon0T9rYND/AOaSEScAAHicY2BiAAKmPSy+QEqUgYFRUURcTFzMyNzM3MxEXU1dTYmdjZ2NccK/K5oaLm6L3Fw0NOEMZoVAFD6IAQD4PA9iAAAAeJxjYGRgYADirq+zjOP5bb4ycLNfAIowXCttkUWmmfaw+AIpDgYmEA8ANPUJwQAAeJxjYGRgYL/AAATMCiCSaQ8DIwMqYAIAK/QBvQAAAAADIAAAAAAAAAAoAAB4nGNgZGBgYGIQA2IGMIuBgQsIGRj+g/kMAArUATEAAHicjY69TsMwFIWP+4doJYSKhMTmoUJIqOnPWIm1ZWDq0IEtTZw2VRpHjlu1D8A7MPMczAw8DM/AifFEl9qS9d1zzr3XAK7xBYHqCHTdW50aLlj9cZ1057lBfvTcRAdPnlvUnz23mXj13MEN3jhBNC6p9PDuuYYrfHquU//23CD/eG7iVnQ9t9ATD57bWIgXzx3ciw+rDrZfqmhnUnvsx2kZzdVql4Xm1DhVFsqUqc7lKBiemjOVKxNaFcvlUZb71djaRCZGb+VU51ZlmZaF0RsV2WBtbTEZDBKvB5HewkLhwLePkhRhB4OU9ZFKTCqpzems6GQI6Z7TcU5mQceQUmjkkBghwPCszhmd3HWHLh+ze8mEpLvnT8dULRLWCTMaW9LUbanSGa+mUjhv47ZY7l67rgITDHiTf/mAKU76BTuXfk8AAHicY2BigAARBuyAiZGJkZmBJSWzOJmBAQALQwHHAAAA) format("woff")
}
/* target the input field inexplicably to throw Chrome's AI off.
 * feel free to use a more complicated selector */
.blah-blah ~ *:nth-child(2) {
	font-family: '<random or static bizarre string>';
}

2. Don't use type=password type=text, type=search, type=tel, etc.

The Chrome Team may eventually catch onto type=search being used as a password field.

I suggest using type=<random string>. According to the spec, unknown types will act just like type=text!

const crypto = require('crypto');

const getRandomInputType = (function*() {
	let chars = '';
	for (let i = 0; i < 8; i++) {
		chars += 'abcdefghijklmnopqrstuvwxyz-12345';
	}
	const cached = [
		// prevent collisions with types >= 8 chars long, see the Math.round line
		'password', 'new-password', 'datetime', 'datetime-local', 'checkbox'
	];
	while (true) {
		yield (function(cached) {
			let type, b = Buffer.allocUnsafe(Math.round(8+Math.random()*10));
			do {
				type = [...crypto.randomFillSync(b)].map(t => chars[t]).join('');
			} while (type.startsWith('-') || cached.includes(type));
			cached.push(type);
			return type;
		})(cached);
	}
})();
console.log(`<input type=${getRandomInputType.next().value}>`);
// <input type=k5be1t-oglczpam4hu>
@Vanderson7593

This comment has been minimized.

Copy link

@Vanderson7593 Vanderson7593 commented May 13, 2020

Thanks a lot!

@srghma

This comment has been minimized.

Copy link

@srghma srghma commented May 22, 2020

@runspired could you release your gists under MIT license like this guy does it https://gist.github.com/martinbuberl/c0de29e623a1e34d1cda7e817d18bafe

and please write This license applies to all public gists and comments https://gist.github.com/runspired

@robertuniqid

This comment has been minimized.

Copy link

@robertuniqid robertuniqid commented May 22, 2020

@runspired could you release your gists under MIT license like this guy does it https://gist.github.com/martinbuberl/c0de29e623a1e34d1cda7e817d18bafe

and please write This license applies to all public gists and comments https://gist.github.com/runspired

Why would someone need to license simple markup code ? Or any of the comments with scraps of code in here ?

@srghma

This comment has been minimized.

Copy link

@srghma srghma commented May 22, 2020

@rusuandreirobert

bro, - I hear you. Unfortunately, I didn't create copyright law, which can be a pain in the a..
In short - the github does not regulate (at least I don't see it from the Terms of Service) how gists and comments are licenses. Ideally they would by default be licensed under a permissive license (like MIT/BSD).

As this is not the case it would be a good practise for every developer to add a copyright note to each file or a general license for his gists.

Have a look at this thread which discusses the matter: https://softwareengineering.stackexchange.com/questions/26548/what-is-the-default-software-license/26607#26607

@robertuniqid

This comment has been minimized.

Copy link

@robertuniqid robertuniqid commented May 22, 2020

@rusuandreirobert

bro, - I hear you. Unfortunately, I didn't create copyright law, which can be a pain in the a..
In short - the github does not regulate (at least I don't see it from the Terms of Service) how gists and comments are licenses. Ideally they would by default be licensed under a permissive license (like MIT/BSD).

As this is not the case it would be a good practise for every developer to add a copyright note to each file or a general license for his gists.

Have a look at this thread which discusses the matter: https://softwareengineering.stackexchange.com/questions/26548/what-is-the-default-software-license/26607#26607

I don't want to ruin this gist with offtopic "trash", but that whole argument makes 0 sense in this case, this is a freaking GIST, the code is so minuscule, that it makes 0 sense to even bring the argument, NOBODY CAN PROVE YOU USED THIS, or anything that is not composed by more than a few files, or a few hundreds of lines of code.

Copyright laws are there when you're doing BAD STUFF, not when you're getting some code scraps on the public internet, take any 50 - 100 lines script on the internet, change the variable names and the logic, and you've got yourself your brand new "owned code", this is entirelly different when you're talking about a library and that's a whole different argument, but spreading this kind of propaganda for a HTML markup ( or some CSS, or some JS in the gist comments ) is BAD PRACTICE, and you're the one making the "problem" real, by giving it importance.

@srghma

This comment has been minimized.

Copy link

@srghma srghma commented May 22, 2020

NOBODY CAN PROVE YOU USED THIS

in our project we have linked this gist in the codebase, for the future reference

          -# new-password disables autocomplete in chrome (https://gist.github.com/runspired/b9fdf1fa74fc9fb4554418dea35718fe)
          = f.input :password, input_html: { autocomplete: "new-password", required: true, disabled: !presenter.show_change_password }

it's now in the history, and, if we will sell our code to the other company, there is a probability that this other company will find these two words autocomplete: "new-password" and penalize us

yes, we can remove this comment, yes, we can rewrite the history of the repository to remove any trace, but even so, we don't want to remove this comment, we want to leave it for the future reference

@richlv

This comment has been minimized.

Copy link

@richlv richlv commented May 22, 2020

People messing with autocomplete should be penalised anyway ;P

@srghma

This comment has been minimized.

Copy link

@srghma srghma commented May 22, 2020

@richlv it's very improbable that we will sell to google)

@Bebedee

This comment has been minimized.

Copy link

@Bebedee Bebedee commented Jun 9, 2020

Hi @tejaswinikhambe

I have used the hidden input type password but it is working only in Firefox. Do you mind sharing to me your solution for Chrome?
Im in Firefox 33.1 and Chrome 81

@lucacerza

This comment has been minimized.

Copy link

@lucacerza lucacerza commented Jun 9, 2020

@Bebedee

This comment has been minimized.

Copy link

@Bebedee Bebedee commented Jun 11, 2020

Hi @lucacerza

thank you for your reply. We actually can't use jquery since our webserver is restricted. do you have other option?

@lucacerza

This comment has been minimized.

Copy link

@lucacerza lucacerza commented Jun 11, 2020

@SajjadLuqman

This comment has been minimized.

Copy link

@SajjadLuqman SajjadLuqman commented Jun 16, 2020

Simple Solution:
Change Textbox Name e.g Password to MyPassword , Email to MyEmail.
Autofill not work...
It's Called Jughar

@Bebedee

This comment has been minimized.

Copy link

@Bebedee Bebedee commented Jun 26, 2020

Hi @lucacerza

Sorry for the late response. It didn't work. We are unable to login to our site. It just keeps on refreshing after clicking the submit button. Im going nuts with this problem.

@lucacerza

This comment has been minimized.

Copy link

@lucacerza lucacerza commented Jun 26, 2020

@lucacerza

This comment has been minimized.

Copy link

@lucacerza lucacerza commented Jun 26, 2020

@Bebedee

This comment has been minimized.

Copy link

@Bebedee Bebedee commented Jun 26, 2020

Hi @lucacerza

Yes im trying to stop the autofill of the username and password. But im actullay working on 3 browsers (Google Chrome, Internet Explorer and Firefox).
I tried to use the code below that you sent but it is not working as we are unable to login to the application. Once we click the submit button, the page just keep on refreshing.

  • <script> document.addEventListener("DOMContentLoaded", function(event)

{ document.getElementById("username").autocomplete = "off"; }); </script>
*

I tried the hidden password type input but it is not working on Google Chrome.
I also tried the readonly="" onfocus="this.removeAttribute('readonly');" but it is not working in Internet Explorer.
Seems like i can't find an approach that would work on the 3 browsers that we are using.

Im sorry but is there another option that i can try?

@lucacerza

This comment has been minimized.

Copy link

@lucacerza lucacerza commented Jun 26, 2020

@Bebedee

This comment has been minimized.

Copy link

@Bebedee Bebedee commented Jun 29, 2020

Hi @lucacerza

No error showed up. Its just keep on refreshing the page.

Let me try the random string and i will give you an update on the result.

Its really difficult to make a work around for this especially if working on different platforms.

@cassiobueno90

This comment has been minimized.

Copy link

@cassiobueno90 cassiobueno90 commented Jul 5, 2020

for me it works:
<input type="text" name="password" onfocus="this.type='password'" />

@Bebedee

This comment has been minimized.

Copy link

@Bebedee Bebedee commented Jul 8, 2020

Hi @cassiobueno90

What version of google chrome you are using?

@esaesa

This comment has been minimized.

@billywatsy

This comment has been minimized.

Copy link

@billywatsy billywatsy commented Aug 26, 2020

for me it works:
<input type="text" name="password" onfocus="this.type='password'" />
thanks for this @cassiobueno90

have you tested this on modern browsers

@cassiobueno90

This comment has been minimized.

Copy link

@cassiobueno90 cassiobueno90 commented Sep 3, 2020

Hi @cassiobueno90

What version of google chrome you are using?

Hi @Bebedee
version chrome: 85.0.4183.83

@sumsv50

This comment has been minimized.

Copy link

@sumsv50 sumsv50 commented Dec 3, 2020

Thank you very must

@dranitski

This comment has been minimized.

Copy link

@dranitski dranitski commented Dec 9, 2020

this helped me https://stackoverflow.com/a/63989246/10099510

I had the same problem it seems difficult to solve I found a solution To solve the problem the input in initialization must be equal to type="text" and then change to type="password" with the first focus or insert input

function changeTypeInput(inputElement){ 
   inputElement.type="password" 
}
<input type="text"
   id="anyUniqueId"  
   onfocus="changeTypeInput(this)"
   oninput="changeTypeInput(this)"
/>
@hkmaly

This comment has been minimized.

Copy link

@hkmaly hkmaly commented Jan 23, 2021

@richlv: I would be completely satisfied if the browser WAITED WITH FILLING THE PASSWORD until user clicks on it.

(Which is actually what Firefox does ...)

@richlv

This comment has been minimized.

Copy link

@richlv richlv commented Jan 25, 2021

@richlv: I would be completely satisfied if the browser WAITED WITH FILLING THE PASSWORD until user clicks on it.

(Which is actually what Firefox does ...)

Heya, if some browsers don't seem to work satisfactory, it might be best to report that to browser developers.

@jidanni

This comment has been minimized.

Copy link

@jidanni jidanni commented Feb 22, 2021

Heya, if some browsers don't seem to work satisfactory, it might be best to report that to browser developers.

https://crbug.com/1178049

@lucacerza

This comment has been minimized.

Copy link

@lucacerza lucacerza commented Feb 25, 2021

@parsasamandi

This comment has been minimized.

Copy link

@parsasamandi parsasamandi commented Mar 14, 2021

That was great, thanks

@lucacerza

This comment has been minimized.

Copy link

@lucacerza lucacerza commented Mar 15, 2021

@lucacerza

This comment has been minimized.

Copy link

@lucacerza lucacerza commented Mar 16, 2021

@geomago

This comment has been minimized.

Copy link

@geomago geomago commented Mar 24, 2021

None of the above solution worked for me in Chrome for Mac; in particular an input field generated by the "typeahead.js" library (that was not a password field) insisted to display the password suggestion when the field gets empty. At last I found that by simply putting the field inside a

tag makes it work, with no need to specify autocomplete=off in the field itself.

@tranbinhvn

This comment has been minimized.

Copy link

@tranbinhvn tranbinhvn commented Apr 6, 2021

With the reason for using the type="password" in mind: why not using type="text" and give it a font-family which makes the text unreadable? Like dots, or what ever.

<style>
    input.key {
        -webkit-text-security: disc;
    }
</style>
<script>
    var tagArr = document.getElementsByTagName("form");
    for (let i = 0; i < tagArr.length; i++) {
        tagArr[i].autocomplete = 'off';
    }
    var tagArrInput = document.getElementsByTagName("input");
    for (let i = 0; i < tagArrInput.length; i++) {
        tagArrInput[i].autocomplete = 'off';
        if (tagArrInput[i].type == "password") {
            tagArrInput[i].type = "text";
            tagArrInput[i].classList.add("key");
        }
        console.log('name=', tagArrInput[i].name);
    }
</script>
@killmenot

This comment has been minimized.

Copy link

@killmenot killmenot commented Aug 4, 2021

For everyone who may need it there is a library that was created to resolve this problem
https://github.com/noppa/text-security

This solution works for me well (I adapted it for jss)

{
  password: {
    fontFamily: 'text-security-disc',
    WebkitTextSecurity: 'disc',
    '&::placeholder': {
      fontFamily: theme.typography.fontFamily,
    }
  }
}
@tomwjerry

This comment has been minimized.

Copy link

@tomwjerry tomwjerry commented Aug 31, 2021

One thing that worked for me was to use httprequest to register users, I had to remove the password elements before calling location.href. No idea if it works in chrome. Browsers getting smarter so I guess it is just a question of time before this no longer works.

@MariaEduardaDaSilva

This comment has been minimized.

Copy link

@MariaEduardaDaSilva MariaEduardaDaSilva commented Oct 15, 2021

That worked for me and my friend (@amandasantiagu), we are using the latest Chrome version 94.0.4606.81
We used it in React and it worked perfectly

<form autocomplete="off" style="100%">
        <input autocomplete="false" type="search" style=" overflow: hidden; display: none " />

        <input autocomplete="new-password">Your input info here </input>
</form>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment