Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save niksumeiko/360164708c3b326bd1c8 to your computer and use it in GitHub Desktop.
Save niksumeiko/360164708c3b326bd1c8 to your computer and use it in GitHub Desktop.
Disable HTML form input autocomplete and autofill

Disable HTML Form Input Autocomplete and Autofill

  1. Add autocomplete="off" onto <form> element;
  2. Add hidden <input> with autocomplete="false" as a first children element of the form.
<form autocomplete="off" method="post" action="">
    <input autocomplete="false" name="hidden" type="text" style="display:none;">
    ...

This formation is going to prevent Chrome and Firefox to offer autofill and autocomplete for all input fields inside the form.

@moosefaceee
Copy link

moosefaceee commented Aug 24, 2024

If you want a true fix, please go mark as impacted here. This needs attention from the Chromium dev team.

Everything in this thread is a hack to work around it, and is likely to break or cause bugs in your application down the line. Better to get it fixed at the source, no?

These workarounds are also be very misleading for Jnr developers. :(

@valentimmx
Copy link

This still working in Chrome:
Using a non-standard value may trick the browser into not automatically filling in the field.

<input type="text" autocomplete="new-text" />
<input type="number" autocomplete="new-number" />
<input type="password" autocomplete="new-password" />

@moosefaceee
Copy link

Hi @valentimmx, please also drop your comment here: https://issues.chromium.org/issues/40910184?pli=1

Mark yourself as impacted. This needs attention from the Chromium dev team for a proper fix.

@rawaby88
Copy link

I hope this could be helpful for someone:
form structure:

  • name
  • email
  • phone
  • billing address // <== I had a problem here, where it was auto-suggesting email address autocomplete
  • password

I tried all of the above but with no luck, then
when I change the form to:

  • name
  • email
  • password // moved it up
  • phone
  • billing address // <== auto suggestions stoped 🫨

chrome 128.0.6613.138

@tlevivsoft
Copy link

None of these works for me. Feels like you have to hack it up by adding read only and later remove after rendering the component. This is stupid....

@moosefaceee
Copy link

Couldn’t agree more @tlevivsoft, would you mind sharing your frustrations with the Chromium team here? https://issues.chromium.org/issues/40910184?pli=1

Better yet, mark yourself as affected. More traction we can get on the ticket the better.

@moosefaceee
Copy link

@rawaby88 you too if you’re open to it please

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment