jasonk/disable-1password-on-your-website.md

## disable-1password-on-your-website.md

      
    Raw
  

              disable-1password-on-your-website.md
            
          
    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>