Adding
data-lpignore="true"
to an input field disabled the grey LastPass [...] box for me.
Sourced from LastPass.com
Answer from whatismybrowser.com on Stack OverflowAdding
data-lpignore="true"
to an input field disabled the grey LastPass [...] box for me.
Sourced from LastPass.com
Three conditions have to be met:
- The form (not the element) needs to have
autocomplete="off"attribute - Input fields need to have the attribute
data-lpignore="true" - Lastpass user needs to have this option enabled:
- (old)
Settings > Advanced > Allow pages to disable autofill - (new)
Account Options > Extension Preferences > Advanced > Respect AutoComplete=off: allow websites to disable Autofill
- (old)
So this depends on both user and the developer.
Official documentation from LastPass confirms this method is the way to go.
Videos
I'm one of the author's of FormKit, a framework for building forms in Vue. I've tried every way from Sunday to stop Lastpass from attempting to autofill the inputs on our documentation site (specifically the ones in the primary mega-nav) but I cannot get it to stop.
I have tried:
adding
autocomplete="off"to both the wrappingformelement and the inputs themselves. (this seems like the most sane standards-based way to go)adding a name and id that includes
searchin the name to discourage the Lastpass from autofilling out of fear of leaking sensitive information. (I think this one got patched out)using the
data-lpignore="trueattribute (I'm really not a fan of this one because it's so vendor specific, but it also didn't work).
If anyone knows a way as a developer to prevent Lastpass from autofilling on a website you control I would love to hear it! We've gotten multiple messages from users who visit our site who have Lastpass installed about this issue. When the pop-up appears it steals focus from the nav which closes the mega-nav panel and makes navigating the site very difficult.
Thanks for taking a look!
After re-reading the LastPass guidance, I realized I had not done this:
In your LastPass browser extension preferences (Advanced settings), enable the Respect AutoComplete=off setting, which will allow websites to disable the autofill feature.
Once I did, it started working as advertised. Yes, right after I posted this question
Otherwise, if you want to hide it on specific form of specific input, you can use CSS. Something like :
svg[data-lastpass-icon=true]{
visibility:none;
}