javascripthtmlangularjsinputlastpass

How to prevent LastPass (chrome extension) from auto-filling input field


I want to prevent LastPass from filling out an input field on my site. I'm using AngularJS and HTML5, and the extension is autofilling the following input field. This field is a search field inside my page; it's not a login page.

<input id="search-publishers-box" type="text" placeholder="Search Publishers" data-ng-model="publishersSearchQuery.name" class="search-field-text" autocomplete="off"/>

What can I do to prevent LastPass from doing its autofill? I've tried to change the placeholder, the model, adding autocomplete="off", and changed the id of the input field.

None have worked at all for me.


Solution

  • Here's my take on this, and usually what I do to solve the autofill problems (yes, they're obscure but they do happen) – I usually watch the fields for changes. Since you're using AngularJS, its pretty easy to do with $watch, or if you're using jQuery, just use .change

    And then, whenever there's a change of more than one character at one time, you can assume that its autofill and not someone typing.

    Note that this breaks if someone decides to paste into the field.

    Another workaround is to allow change on the field only when there's a keypress.

    EDIT Here's a fiddle