Skip to content

Instantly share code, notes, and snippets.

@jasonk
Last active February 4, 2023 19:34
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jasonk/c577a3475b3b533cc820235166820e05 to your computer and use it in GitHub Desktop.
Save jasonk/c577a3475b3b533cc820235166820e05 to your computer and use it in GitHub Desktop.
DIsable 1password on your website

First off, let me say that 1password is a great tool that I use every single day.

That being said, however, as a web developer it has one very obnoxious problem that they are unwilling to fix: There is no way for a developer to indicate that a field that 1password thinks should be filled from it's vault should in fact not prompt the user to autofill it.

Some examples of completely valid use cases made absurdly painful by this refusal include:

  • Admin tools that let you change passwords for other people getting accidentally filled with passwords from 1password
  • Fields that aren't even asking for passwords that are using type=password to cause the input to be hidden

There are standard attributes like autocomplete="off" that they intentionally ignore. Other password managers provide specific attributes you can use to tell them to ignore that field (Lastpass, for example, will ignore fields marked with data-lpignore="true")

Why would they refuse to fix this problem that plagues web developers? In their own words it's because they are afraid that some developers will use that to disable 1password on their site. As a web developer I think that if I want to do that then that's something I should totally be able to do. I also think that is a stupid argument, because adding an attribute like this (or at the very least not intentionally ignoring autocomplete="off") is not required for developers to completely disable 1password.

Here is how you can disable 1password completely on an entire web page.

If you are one of the developers that they are afraid of who would use this to promote your favorite password manager instead of 1password, then this is how you can do it now, without waiting for them to honor web standards or help developers (also, despite their fears, I don't believe you actually exist).

If you are a regular, every day web developer just trying to get 1password to stop messing things up, then I encourage you to use this on every page that has a form, except for your login or signup pages where you would actually want 1password to work.

For more details on this problem, visit https://1password.community/discussion/117501/as-a-web-developer-how-can-i-disable-1password-filling-for-a-specific-field (for the record, that's also where the original version of this code came from, I didn't write it, I'm just storing it here to make it easy for me to find when I need it again and to help boot it's visibility).

Place the script at the top of your body before other content.

<script type="text/javascript">
  // Remove 1Password from page
  new MutationObserver( mutations => {
    for ( const { addedNodes } of mutations ) {
      for ( const node of addedNodes ) {
        if ( node.tagName.indexOf( 'COM-1PASSWORD' ) === 0 ) {
          node.parentNode.removeChild( node );
          // console.log( 'Removed 1Password' );
        }
      }
    }
  } ).observe( document.body, { childList: true } );
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment