diff options
Diffstat (limited to 'templates/base/disable_form_autofill.tmpl')
| -rw-r--r-- | templates/base/disable_form_autofill.tmpl | 31 |
1 files changed, 31 insertions, 0 deletions
diff --git a/templates/base/disable_form_autofill.tmpl b/templates/base/disable_form_autofill.tmpl new file mode 100644 index 0000000..6f06395 --- /dev/null +++ b/templates/base/disable_form_autofill.tmpl @@ -0,0 +1,31 @@ +{{/* +Why we need to disable form autofill: +1. Many pages contain different password inputs for different usages, eg: repo setting, autofill will make a mess. +2. We have `areYouSure` confirm dialog if a user leaves a pages without submit. +Autofill will make the form changed even if the user didn't input anything. Then the user keeps seeing annoying confirm dialog. + +In history, Gitea put `<input class="fake" type="password">` in forms to bypass the autofill, +but there were still many forms suffered the autofill problem. + +Now we improve it. + +Solutions which do NOT work: +1. Adding `autocomplete=off` doesn't help. New Chrome completely ignores it. +2. Use a JavaScript to run in a few seconds later after the page is loaded to process the autofilled inputs, it doesn't work. +Because for security reason, the inputs won't be filled before the user makes an interaction in the page. +So we can not predict the correct time to run the JavaScript code. + +Solutions which work: +1. Some hacky methods like: https://github.com/matteobad/detect-autofill +2. This solution: use invisible inputs. Be aware of: +(a) The inputs must be at the beginning of the form, and can not be hidden. +(b) The input for username must have a valid name. +(c) There should be no negative word (eg: fake) in the `name` attribute. +(d) Chrome seems to use a weighted algorithm to choose an input to fill text, so the using "username" as input name is better than using "user". +We make the names of these dummy inputs begin with an underline to indicate it is for special usage, +and these dummy form values won't be used by backend code. +*/}} +<div class="autofill-dummy" aria-hidden="true"> + <input type="text" name="_autofill_dummy_username" class="ays-ignore" tabindex="-1"> + <input type="password" name="_autofill_dummy_password" class="ays-ignore" tabindex="-1"> +</div> |