CODEWITHSUNDEEP
html
code4kix
code4kix

Reputation: 4187

HTML - Disable Password Manager

Our security team requires us to disable the password manager for protected fields on the HTML form. As an example, here's an over simplified HTML form below. When I click the submit button, firefox (version 51.0.1) pops up the password manager. 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
</head>
<body>
    <form name="testform" action="disable-pwd-mgr.htm" method="post"
        autocomplete="off">

        <label for="protected-input">Protected Input</label> 
        <input type="password" size="16" maxlength="16" id="protected-input"  name="protected-input" accept="numbers" />
        <input type="password" id="disable-pwd-mgr-1" style="display: none;" value="stop-pwd-mgr-1"/>
        <input type="password" id="disable-pwd-mgr-2" style="display: none;" value="stop-pwd-mgr-2"/>

        <button name="next" id="next" type="submit" value="Next">
            NEXT
        </button>

    </form>
</body>
</html>

Note that all alternatives suggested here didn't work.

  1. autocomplete=off didn't work.
  2. Having another hidden input field of type password didn't work.

Using the two separate additional hidden password inputs, each with different dummy values seems to work for the case when the user actually inputs a value into the protected field and clicks submit. But if the field is left blank and the submit button is clicked, the password manager pops up again. Interestingly chrome (Version 55) doesn't pop up the password manager at all, which is good. Does anyone have a better solution to this problem?

Upvotes: 26

Views: 42566

Answers (9)

caseybettridge
caseybettridge

Reputation: 391

In addition to HTML's autcomplete attribute (which is usually ignored for password managers), specific password managers have their own custom attributes:

Thus:

<input type="text" … autocomplete="off" data-1p-ignore data-lpignore="true" data-protonpass-ignore="true">

Upvotes: 38

karthi kn
karthi kn

Reputation: 1

We can use the Div as an input and get the input from user by designing the div like a text field.

Most of the banking websites use this method to avoid the suggestions.

Upvotes: 0

olive007
olive007

Reputation: 850

There is a simple trick to disable them. Use custom CSS rules to hide their buttons.

Careful, the following is Sass! This work perfectly for ProtonPass and LastPass on Firefox.


form[autocomplete="off"]
  &, > input
    protonpass-control, div[data-lastpass-icon-root="true"]
      display: none

Upvotes: 0

TorontoJim
TorontoJim

Reputation: 11

I ran into this problem with Chrome 111 and found an easy workaround.

The password form loads in the page as type="input" but as soon as the user clicks on it, it changes to type="password". In my test with Bitwarden, it does not fill in the field.

<input type="text" name="pwd" class="loginotpinput" onclick="this.type='password';" required>

I've also tested in Edge V111 and Firefox V103. If you have a different browser/version/pwd manager and want to add a test result, that would be shiny!

Just to note as to why I'm doing this, the user is already logged in but I have a sensitive feature that I don't want them to activate <eyeroll> ACCIDENTALLY </eyeroll> so I have them re-enter their password.

Upvotes: 0

Danail Gabenski
Danail Gabenski

Reputation: 3620

None of these work as of 10/11/2022 - the extra password fields if hidden through display:none; or visibility:hidden; are ignored by last pass.

What I did was add the following to a fake password field

<input id="disable_autofill1" name="disable_autofill1" 
  style="height:0; width:0; background:transparent;
         border:none;padding:0.3px;margin:0;display:block;" 
type="password">

This seems to be enough to minimize the size this element takes on screen (pretty much 0 for me) while still not triggering last pass's vicious algorithm. I've put it before my real password field, that's not even the right "password" field for the site, but gets detected as one either way.

Upvotes: 0

Vikas Dwivedi
Vikas Dwivedi

Reputation: 5311

Simple hack (Feb 2022)

I tried many solutions nothing worked, simple hack is

  1. Use text-security-disc as font-family to display font of text field as disc
  2. Use webkit-text-security CSS property (for now it's only for Chrome, we can use that as fallback of text-security-disc font)

Example

<input type="text" name="password" class="password">

<style>
@font-face{
  font-family: text-security-disc;
  src: url("https://raw.githubusercontent.com/noppa/text-security/master/dist/text-security-disc.woff");
}
.password{
  -webkit-text-security: disc;
  font-family: text-security-disc;
}
</style>

In above example -webkit-text-security: disc; is used as fallback of font-family: text-security-disc. So in case text-security-disc is unavailable then -webkit-text-security: disc; will work.

Good Luck 👍

Upvotes: 2

LAXIT KUMAR
LAXIT KUMAR

Reputation: 469

Modern browsers respects autocomplete="new-password" on input password fields. But it is not supported in IE.

For browser support refer: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete

Upvotes: 5

NineBerry
NineBerry

Reputation: 28499

This works in the current Firefox (51), Chrome (55), Edge (38) and IE (11):

Use three different hidden password inputs with three different values. This seems to prevent the browser from activating the password manager because it cannot guess which of the three values is the new password to use.

<form name="testform" action="index" method="post"
      autocomplete="off">

    <input name="disable-pwd-mgr-1" type="password" id="disable-pwd-mgr-1" style="display: none;" value="disable-pwd-mgr-1" />
    <input name="disable-pwd-mgr-2" type="password" id="disable-pwd-mgr-2" style="display: none;" value="disable-pwd-mgr-2" />
    <input name="disable-pwd-mgr-3" type="password" id="disable-pwd-mgr-3" style="display: none;" value="disable-pwd-mgr-3" />

    <label for="protected-input">Protected Input</label>
    <input autocomplete="aus" type="password" size="16" maxlength="16" id="protected-input" name="protected-input" accept="numbers" />

    <button name="next" id="next" type="submit" value="Next">
        NEXT
    </button>
</form>

Over the last years, Browser manufacturers have started to ignore the "autocomplete=off" option for password forms. For example, see the change issue for Firefox.

The reasoning is simple: A lot of websites want to disable auto-complete for login forms based on a false understanding of security. Allowing users to store passwords in secure password managers (as provided today by current browsers) is not a security risk. In fact, it helps security by allowing users to use secure and individual passwords for different websites.

So, don't try to disable browser password managers because you think this would increase security for your users. It doesn't.

There might be scenarios where you don't want a password manager to pop up for example because the password entered is a one-time-password or tan that is of no use a second time. But in the case of a one-time-password / tan, why use a password input at all? Just use a normal input.

Discussion on the issue on Security Stackexchange

Upvotes: 21

Patrick Moore
Patrick Moore

Reputation: 13344

Some browsers may respect autocomplete="off" on the input fields themselves:

<form name="testform" action="disable-pwd-mgr.htm" method="post"
    autocomplete="off">

    <label for="protected-input">Protected Input</label> 
    <input type="password" size="16" maxlength="16" id="protected-input" accept="numbers" autocomplete="off" />
    <input type="password" id="disable-pwd-mgr-1" style="display: none;" value="stop-pwd-mgr-1"/>
    <input type="password" id="disable-pwd-mgr-2" style="display: none;" value="stop-pwd-mgr-2"/>

    <button name="next" id="next" type="submit" value="Next">
        NEXT
    </button>
</form>

However, in practice, the browser (and extensions) will often ignore this directive.

Upvotes: 3

Related Questions