Tuesday, May 1, 2018

How to prevent Chrome auto-fill input box

There are various discussions on stackoverflow regarding how to prevent Chrome auto-fill text input, and the final solution is using fake fields (as of May 2018)

<!-- fake fields are a workaround for chrome autofill getting the wrong fields -->
<input style="opacity: 0;position: absolute;">
<input type="password" style="opacity: 0;position: absolute;">

The most mentioned solution is using hidden fields, but Chrome now ignores hidden fields, so above solution is the final, below solution might not work any more in latest Chrome browser.

<input style="display:none" type="text" name="fakeusernameremembered"/>
<input style="display:none" type="password" name="fakepasswordremembered"/>

Discussed solutions might work in certain case
1. Set autocomplete to text or email input
autocomplete="new-password" for type=password

2. Set form action to GET instead of POST

3. Set input to readonly, then remove readonly attribute later after UI rendered

4. Set autocomplete="false" to form
For instance, in AngularJS, uses
<ng-form autocomplete="false">


No comments:

Post a Comment