From a17503ca2fd4f1bbf1318618f9bc02587a59b032 Mon Sep 17 00:00:00 2001
From: wxiaoguang <wxiaoguang@gmail.com>
Date: Mon, 11 Oct 2021 19:29:54 +0800
Subject: [PATCH 1/5] disable form autofill

---
 modules/templates/helper.go                | 37 ++++++++++++++++++++++
 templates/admin/auth/edit.tmpl             |  2 +-
 templates/admin/auth/new.tmpl              |  1 +
 templates/admin/auth/source/ldap.tmpl      |  1 -
 templates/admin/user/edit.tmpl             |  2 +-
 templates/admin/user/new.tmpl              |  2 +-
 templates/repo/migrate/git.tmpl            |  2 +-
 templates/repo/migrate/onedev.tmpl         |  2 +-
 templates/repo/settings/options.tmpl       |  7 ++--
 templates/repo/settings/webhook/gitea.tmpl |  2 +-
 templates/repo/settings/webhook/gogs.tmpl  |  2 +-
 templates/user/settings/account.tmpl       |  3 +-
 web_src/less/_base.less                    |  4 ---
 13 files changed, 51 insertions(+), 16 deletions(-)

diff --git a/modules/templates/helper.go b/modules/templates/helper.go
index b935eb6cc097f..fdf82d9cb76e3 100644
--- a/modules/templates/helper.go
+++ b/modules/templates/helper.go
@@ -378,6 +378,7 @@ func NewFuncMap() []template.FuncMap {
 		"MermaidMaxSourceCharacters": func() int {
 			return setting.MermaidMaxSourceCharacters
 		},
+		"DisableFormAutofill": disableFormAutofill,
 	}}
 }
 
@@ -965,3 +966,39 @@ func mirrorRemoteAddress(m models.RemoteMirrorer) remoteAddress {
 
 	return a
 }
+
+func disableFormAutofill() template.HTML {
+	/*
+		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.
+	*/
+	return `
+<div style="position: absolute; width: 1px; height: 1px; overflow: hidden; z-index: -10000;">
+  <input type="text" name="_autofill_dummy_username" class="ays-ignore">
+  <input type="password" name="_autofill_dummy_password" class="ays-ignore">
+</div>
+`
+}
diff --git a/templates/admin/auth/edit.tmpl b/templates/admin/auth/edit.tmpl
index 2f77e9bd801dc..f0061afb80574 100644
--- a/templates/admin/auth/edit.tmpl
+++ b/templates/admin/auth/edit.tmpl
@@ -8,6 +8,7 @@
 		</h4>
 		<div class="ui attached segment">
 			<form class="ui form" action="{{.Link}}" method="post">
+				{{DisableFormAutofill}}
 				{{.CsrfTokenHtml}}
 				<input type="hidden" name="id" value="{{.Source.ID}}">
 				<div class="inline field">
@@ -55,7 +56,6 @@
 							<label for="bind_dn">{{.i18n.Tr "admin.auths.bind_dn"}}</label>
 							<input id="bind_dn" name="bind_dn" value="{{$cfg.BindDN}}" placeholder="e.g. cn=Search,dc=mydomain,dc=com">
 						</div>
-						<input class="fake" type="password">
 						<div class="field">
 							<label for="bind_password">{{.i18n.Tr "admin.auths.bind_password"}}</label>
 							<input id="bind_password" name="bind_password" type="password" value="{{$cfg.BindPassword}}">
diff --git a/templates/admin/auth/new.tmpl b/templates/admin/auth/new.tmpl
index 13e1366c874ef..7b135af341ca9 100644
--- a/templates/admin/auth/new.tmpl
+++ b/templates/admin/auth/new.tmpl
@@ -8,6 +8,7 @@
 		</h4>
 		<div class="ui attached segment">
 			<form class="ui form" action="{{.Link}}" method="post">
+				{{DisableFormAutofill}}
 				{{.CsrfTokenHtml}}
 				<!-- Types and name -->
 				<div class="inline required field {{if .Err_Type}}error{{end}}">
diff --git a/templates/admin/auth/source/ldap.tmpl b/templates/admin/auth/source/ldap.tmpl
index b553502b94025..9ea0fdf8c060f 100644
--- a/templates/admin/auth/source/ldap.tmpl
+++ b/templates/admin/auth/source/ldap.tmpl
@@ -30,7 +30,6 @@
 		<label for="bind_dn">{{.i18n.Tr "admin.auths.bind_dn"}}</label>
 		<input id="bind_dn" name="bind_dn" value="{{.bind_dn}}" placeholder="e.g. cn=Search,dc=mydomain,dc=com">
 	</div>
-	<input class="fake" type="password">
 	<div class="ldap field {{if not (eq .type 2)}}hide{{end}}">
 		<label for="bind_password">{{.i18n.Tr "admin.auths.bind_password"}}</label>
 		<input id="bind_password" name="bind_password" type="password" autocomplete="off" value="{{.bind_password}}">
diff --git a/templates/admin/user/edit.tmpl b/templates/admin/user/edit.tmpl
index 60cd8ad523219..0969bb99ef156 100644
--- a/templates/admin/user/edit.tmpl
+++ b/templates/admin/user/edit.tmpl
@@ -8,6 +8,7 @@
 		</h4>
 		<div class="ui attached segment">
 			<form class="ui form" action="{{.Link}}" method="post">
+				{{DisableFormAutofill}}
 				{{.CsrfTokenHtml}}
 				<div class="field {{if .Err_UserName}}error{{end}}">
 					<label for="user_name">{{.i18n.Tr "username"}}</label>
@@ -67,7 +68,6 @@
 					<label for="email">{{.i18n.Tr "email"}}</label>
 					<input id="email" name="email" type="email" value="{{.User.Email}}" autofocus required>
 				</div>
-				<input class="fake" type="password">
 				<div class="local field {{if .Err_Password}}error{{end}} {{if not (or (.User.IsLocal) (.User.IsOAuth2))}}hide{{end}}">
 					<label for="password">{{.i18n.Tr "password"}}</label>
 					<input id="password" name="password" type="password" autocomplete="new-password">
diff --git a/templates/admin/user/new.tmpl b/templates/admin/user/new.tmpl
index 0de1a5c7757e2..7bd773ba3809d 100644
--- a/templates/admin/user/new.tmpl
+++ b/templates/admin/user/new.tmpl
@@ -8,6 +8,7 @@
 		</h4>
 		<div class="ui attached segment">
 			<form class="ui form" action="{{.Link}}" method="post">
+				{{DisableFormAutofill}}
 				{{.CsrfTokenHtml}}
 				<!-- Types and name -->
 				<div class="inline required field {{if .Err_LoginType}}error{{end}}">
@@ -61,7 +62,6 @@
 					<label for="email">{{.i18n.Tr "email"}}</label>
 					<input id="email" name="email" type="email" value="{{.email}}" required>
 				</div>
-				<input class="fake" type="password">
 				<div class="required local field {{if .Err_Password}}error{{end}} {{if not (eq .login_type "0-0")}}hide{{end}}">
 					<label for="password">{{.i18n.Tr "password"}}</label>
 					<input id="password" name="password" type="password" autocomplete="new-password" value="{{.password}}" {{if eq .login_type "0-0"}}required{{end}}>
diff --git a/templates/repo/migrate/git.tmpl b/templates/repo/migrate/git.tmpl
index 6525a9b4f50c9..a3ce89b46674c 100644
--- a/templates/repo/migrate/git.tmpl
+++ b/templates/repo/migrate/git.tmpl
@@ -3,6 +3,7 @@
 	<div class="ui middle very relaxed page grid">
 		<div class="column">
 			<form class="ui form" action="{{.Link}}" method="post">
+				{{DisableFormAutofill}}
 				{{.CsrfTokenHtml}}
 				<h3 class="ui top attached header">
 					{{.i18n.Tr "repo.migrate.migrate" .service.Title}}
@@ -21,7 +22,6 @@
 						<label for="auth_username">{{.i18n.Tr "username"}}</label>
 						<input id="auth_username" name="auth_username" value="{{.auth_username}}" {{if not .auth_username}}data-need-clear="true"{{end}}>
 					</div>
-					<input class="fake" type="password">
 					<div class="inline field {{if .Err_Auth}}error{{end}}">
 						<label for="auth_password">{{.i18n.Tr "password"}}</label>
 						<input id="auth_password" name="auth_password" type="password" value="{{.auth_password}}">
diff --git a/templates/repo/migrate/onedev.tmpl b/templates/repo/migrate/onedev.tmpl
index def366f9d8da9..5c7cb7d1cbc1d 100644
--- a/templates/repo/migrate/onedev.tmpl
+++ b/templates/repo/migrate/onedev.tmpl
@@ -3,6 +3,7 @@
 	<div class="ui middle very relaxed page grid">
 		<div class="column">
 			<form class="ui form" action="{{.Link}}" method="post">
+				{{DisableFormAutofill}}
 				{{.CsrfTokenHtml}}
 				<h3 class="ui top attached header">
 					{{.i18n.Tr "repo.migrate.migrate" .service.Title}}
@@ -22,7 +23,6 @@
 						<label for="auth_username">{{.i18n.Tr "username"}}</label>
 						<input id="auth_username" name="auth_username" value="{{.auth_username}}" {{if not .auth_username}}data-need-clear="true"{{end}}>
 					</div>
-					<input class="fake" type="password">
 					<div class="inline field {{if .Err_Auth}}error{{end}}">
 						<label for="auth_password">{{.i18n.Tr "password"}}</label>
 						<input id="auth_password" name="auth_password" type="password" value="{{.auth_password}}">
diff --git a/templates/repo/settings/options.tmpl b/templates/repo/settings/options.tmpl
index 3a446611236e2..b13c2fd8e8758 100644
--- a/templates/repo/settings/options.tmpl
+++ b/templates/repo/settings/options.tmpl
@@ -9,6 +9,7 @@
 		</h4>
 		<div class="ui attached segment">
 			<form class="ui form" action="{{.Link}}" method="post">
+				{{DisableFormAutofill}}
 				{{.CsrfTokenHtml}}
 				<input type="hidden" name="action" value="update">
 				<div class="required field {{if .Err_RepoName}}error{{end}}">
@@ -104,6 +105,7 @@
 						<tr>
 							<td colspan="4">
 								<form class="ui form" method="post">
+									{{DisableFormAutofill}}
 									{{.CsrfTokenHtml}}
 									<input type="hidden" name="action" value="mirror">
 									<div class="inline field {{if .Err_EnablePrune}}error{{end}}">
@@ -132,7 +134,6 @@
 												<label for="mirror_username">{{.i18n.Tr "username"}}</label>
 												<input id="mirror_username" name="mirror_username" value="{{$address.Username}}" {{if not .mirror_username}}data-need-clear="true"{{end}}>
 											</div>
-											<input class="fake" type="password">
 											<div class="inline field {{if .Err_Auth}}error{{end}}">
 												<label for="mirror_password">{{.i18n.Tr "password"}}</label>
 												<input id="mirror_password" name="mirror_password" type="password" placeholder="{{if $address.Password}}{{.i18n.Tr "repo.mirror_password_placeholder"}}{{else}}{{.i18n.Tr "repo.mirror_password_blank_placeholder"}}{{end}}" value="" {{if not .mirror_password}}data-need-clear="true"{{end}} autocomplete="off">
@@ -195,11 +196,12 @@
 							<tr>
 								<td colspan="4">
 									<form class="ui form" method="post">
+										{{DisableFormAutofill}}
 										{{.CsrfTokenHtml}}
 										<input type="hidden" name="action" value="push-mirror-add">
 										<div class="field {{if .Err_PushMirrorAddress}}error{{end}}">
 											<label for="push_mirror_address">{{.i18n.Tr "repo.settings.mirror_settings.push_mirror.remote_url"}}</label>
-											<input id="push_mirror_address" name="push_mirror_address" value="{{.push_mirror_address}}" autocomplete="off" required>
+											<input id="push_mirror_address" name="push_mirror_address" value="{{.push_mirror_address}}" required>
 											<p class="help">{{.i18n.Tr "repo.mirror_address_desc"}}</p>
 										</div>
 										<details class="ui optional field" {{if or .Err_PushMirrorAuth .push_mirror_username}}open{{end}}>
@@ -211,7 +213,6 @@
 													<label for="push_mirror_username">{{.i18n.Tr "username"}}</label>
 													<input id="push_mirror_username" name="push_mirror_username" value="{{.push_mirror_username}}">
 												</div>
-												<input class="fake" type="password">
 												<div class="inline field {{if .Err_PushMirrorAuth}}error{{end}}">
 													<label for="push_mirror_password">{{.i18n.Tr "password"}}</label>
 													<input id="push_mirror_password" name="push_mirror_password" type="password" value="{{.push_mirror_password}}" autocomplete="off">
diff --git a/templates/repo/settings/webhook/gitea.tmpl b/templates/repo/settings/webhook/gitea.tmpl
index bd91ce9e9caf4..357c9e6f26b24 100644
--- a/templates/repo/settings/webhook/gitea.tmpl
+++ b/templates/repo/settings/webhook/gitea.tmpl
@@ -1,6 +1,7 @@
 {{if eq .HookType "gitea"}}
 	<p>{{.i18n.Tr "repo.settings.add_webhook_desc" "https://docs.gitea.io/en-us/webhooks/" | Str2html}}</p>
 	<form class="ui form" action="{{.BaseLink}}/gitea/{{or .Webhook.ID "new"}}" method="post">
+		{{DisableFormAutofill}}
 		{{.CsrfTokenHtml}}
 		<div class="required field {{if .Err_PayloadURL}}error{{end}}">
 			<label for="payload_url">{{.i18n.Tr "repo.settings.payload_url"}}</label>
@@ -30,7 +31,6 @@
 				</div>
 			</div>
 		</div>
-		<input class="fake" type="password">
 		<div class="field {{if .Err_Secret}}error{{end}}">
 			<label for="secret">{{.i18n.Tr "repo.settings.secret"}}</label>
 			<input id="secret" name="secret" type="password" value="{{.Webhook.Secret}}" autocomplete="off">
diff --git a/templates/repo/settings/webhook/gogs.tmpl b/templates/repo/settings/webhook/gogs.tmpl
index 05fcbe6a5e4bc..c2b1f5c07e243 100644
--- a/templates/repo/settings/webhook/gogs.tmpl
+++ b/templates/repo/settings/webhook/gogs.tmpl
@@ -1,6 +1,7 @@
 {{if eq .HookType "gogs"}}
 	<p>{{.i18n.Tr "repo.settings.add_webhook_desc" "https://docs.gitea.io/en-us/webhooks/" | Str2html}}</p>
 	<form class="ui form" action="{{.BaseLink}}/gogs/{{or .Webhook.ID "new"}}" method="post">
+		{{DisableFormAutofill}}
 		{{.CsrfTokenHtml}}
 		<div class="required field {{if .Err_PayloadURL}}error{{end}}">
 			<label for="payload_url">{{.i18n.Tr "repo.settings.payload_url"}}</label>
@@ -18,7 +19,6 @@
 				</div>
 			</div>
 		</div>
-		<input class="fake" type="password">
 		<div class="field {{if .Err_Secret}}error{{end}}">
 			<label for="secret">{{.i18n.Tr "repo.settings.secret"}}</label>
 			<input id="secret" name="secret" type="password" value="{{.Webhook.Secret}}" autocomplete="off">
diff --git a/templates/user/settings/account.tmpl b/templates/user/settings/account.tmpl
index 5be3d5dc51807..46cd49740933a 100644
--- a/templates/user/settings/account.tmpl
+++ b/templates/user/settings/account.tmpl
@@ -9,6 +9,7 @@
 		<div class="ui attached segment">
 			{{if or (.SignedUser.IsLocal) (.SignedUser.IsOAuth2)}}
 			<form class="ui form ignore-dirty" action="{{AppSubUrl}}/user/settings/account" method="post">
+				{{DisableFormAutofill}}
 				{{.CsrfTokenHtml}}
 				{{if .SignedUser.IsPasswordSet}}
 				<div class="required field {{if .Err_OldPassword}}error{{end}}">
@@ -178,8 +179,8 @@
 				{{ end }}
 			</div>
 			<form class="ui form ignore-dirty" id="delete-form" action="{{AppSubUrl}}/user/settings/account/delete" method="post">
+				{{DisableFormAutofill}}
 				{{.CsrfTokenHtml}}
-				<input class="fake" type="password">
 				<div class="required field {{if .Err_Password}}error{{end}}">
 					<label for="password-confirmation">{{.i18n.Tr "password"}}</label>
 					<input id="password-confirmation" name="password" type="password" autocomplete="off" required>
diff --git a/web_src/less/_base.less b/web_src/less/_base.less
index 4e2782a4c8ce4..e0399b0095e86 100644
--- a/web_src/less/_base.less
+++ b/web_src/less/_base.less
@@ -962,10 +962,6 @@ a.ui.card:hover,
   }
 
   .form {
-    .fake {
-      display: none !important;
-    }
-
     .sub.field {
       margin-left: 25px;
     }

From 8559fa3da6b528ac2b4a22053c1b85e609b9d5f1 Mon Sep 17 00:00:00 2001
From: wxiaoguang <wxiaoguang@gmail.com>
Date: Mon, 11 Oct 2021 20:19:45 +0800
Subject: [PATCH 2/5] fix css style

---
 modules/templates/helper.go | 2 +-
 web_src/less/_base.less     | 7 +++++++
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/modules/templates/helper.go b/modules/templates/helper.go
index fdf82d9cb76e3..f6fbcb8964c19 100644
--- a/modules/templates/helper.go
+++ b/modules/templates/helper.go
@@ -996,7 +996,7 @@ func disableFormAutofill() template.HTML {
 		   and these dummy form values won't be used by backend code.
 	*/
 	return `
-<div style="position: absolute; width: 1px; height: 1px; overflow: hidden; z-index: -10000;">
+<div class="auto-fill-dummy">
   <input type="text" name="_autofill_dummy_username" class="ays-ignore">
   <input type="password" name="_autofill_dummy_password" class="ays-ignore">
 </div>
diff --git a/web_src/less/_base.less b/web_src/less/_base.less
index e0399b0095e86..2984ff03826ad 100644
--- a/web_src/less/_base.less
+++ b/web_src/less/_base.less
@@ -962,6 +962,13 @@ a.ui.card:hover,
   }
 
   .form {
+    .auto-fill-dummy {
+      position: absolute;
+      width: 1px;
+      height: 1px;
+      overflow: hidden;
+      z-index: -10000;
+    }
     .sub.field {
       margin-left: 25px;
     }

From 36ba2abb41ba3b3a351b628c3d3d7d391f25da12 Mon Sep 17 00:00:00 2001
From: wxiaoguang <wxiaoguang@gmail.com>
Date: Tue, 12 Oct 2021 12:44:46 +0800
Subject: [PATCH 3/5] refactor css name

---
 modules/templates/helper.go | 2 +-
 web_src/less/_base.less     | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/modules/templates/helper.go b/modules/templates/helper.go
index f6fbcb8964c19..306a6823741a9 100644
--- a/modules/templates/helper.go
+++ b/modules/templates/helper.go
@@ -996,7 +996,7 @@ func disableFormAutofill() template.HTML {
 		   and these dummy form values won't be used by backend code.
 	*/
 	return `
-<div class="auto-fill-dummy">
+<div class="autofill-dummy">
   <input type="text" name="_autofill_dummy_username" class="ays-ignore">
   <input type="password" name="_autofill_dummy_password" class="ays-ignore">
 </div>
diff --git a/web_src/less/_base.less b/web_src/less/_base.less
index 2984ff03826ad..59585b39e4b81 100644
--- a/web_src/less/_base.less
+++ b/web_src/less/_base.less
@@ -962,7 +962,7 @@ a.ui.card:hover,
   }
 
   .form {
-    .auto-fill-dummy {
+    .autofill-dummy {
       position: absolute;
       width: 1px;
       height: 1px;

From 8d3ee39081923de58c7a0c548819f92a2df25892 Mon Sep 17 00:00:00 2001
From: wxiaoguang <wxiaoguang@gmail.com>
Date: Tue, 12 Oct 2021 13:43:45 +0800
Subject: [PATCH 4/5] fix aria-hidden and tabindex

---
 modules/templates/helper.go | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/modules/templates/helper.go b/modules/templates/helper.go
index 306a6823741a9..da4bf595efb39 100644
--- a/modules/templates/helper.go
+++ b/modules/templates/helper.go
@@ -996,9 +996,9 @@ func disableFormAutofill() template.HTML {
 		   and these dummy form values won't be used by backend code.
 	*/
 	return `
-<div class="autofill-dummy">
-  <input type="text" name="_autofill_dummy_username" class="ays-ignore">
-  <input type="password" name="_autofill_dummy_password" class="ays-ignore">
+<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>
 `
 }

From 0aebe8628e0b22f7bd28c56af3b722010a95b5ac Mon Sep 17 00:00:00 2001
From: wxiaoguang <wxiaoguang@gmail.com>
Date: Mon, 18 Oct 2021 23:53:29 +0800
Subject: [PATCH 5/5] use {{template "base/disable_form_autofill"}} instead of
 {{DisableFormAutofill}}

---
 modules/templates/helper.go                | 37 ----------------------
 templates/admin/auth/edit.tmpl             |  2 +-
 templates/admin/auth/new.tmpl              |  2 +-
 templates/admin/user/edit.tmpl             |  2 +-
 templates/admin/user/new.tmpl              |  2 +-
 templates/base/disable_form_autofill.tmpl  | 31 ++++++++++++++++++
 templates/repo/migrate/git.tmpl            |  2 +-
 templates/repo/migrate/onedev.tmpl         |  2 +-
 templates/repo/settings/options.tmpl       |  6 ++--
 templates/repo/settings/webhook/gitea.tmpl |  2 +-
 templates/repo/settings/webhook/gogs.tmpl  |  2 +-
 templates/user/settings/account.tmpl       |  4 +--
 12 files changed, 44 insertions(+), 50 deletions(-)
 create mode 100644 templates/base/disable_form_autofill.tmpl

diff --git a/modules/templates/helper.go b/modules/templates/helper.go
index 1991424e49de3..79195863599e5 100644
--- a/modules/templates/helper.go
+++ b/modules/templates/helper.go
@@ -379,7 +379,6 @@ func NewFuncMap() []template.FuncMap {
 		"MermaidMaxSourceCharacters": func() int {
 			return setting.MermaidMaxSourceCharacters
 		},
-		"DisableFormAutofill": disableFormAutofill,
 	}}
 }
 
@@ -967,39 +966,3 @@ func mirrorRemoteAddress(m models.RemoteMirrorer) remoteAddress {
 
 	return a
 }
-
-func disableFormAutofill() template.HTML {
-	/*
-		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.
-	*/
-	return `
-<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>
-`
-}
diff --git a/templates/admin/auth/edit.tmpl b/templates/admin/auth/edit.tmpl
index f0061afb80574..e7215e2e1af09 100644
--- a/templates/admin/auth/edit.tmpl
+++ b/templates/admin/auth/edit.tmpl
@@ -8,7 +8,7 @@
 		</h4>
 		<div class="ui attached segment">
 			<form class="ui form" action="{{.Link}}" method="post">
-				{{DisableFormAutofill}}
+				{{template "base/disable_form_autofill"}}
 				{{.CsrfTokenHtml}}
 				<input type="hidden" name="id" value="{{.Source.ID}}">
 				<div class="inline field">
diff --git a/templates/admin/auth/new.tmpl b/templates/admin/auth/new.tmpl
index 7b135af341ca9..b8e80dbcaaa01 100644
--- a/templates/admin/auth/new.tmpl
+++ b/templates/admin/auth/new.tmpl
@@ -8,7 +8,7 @@
 		</h4>
 		<div class="ui attached segment">
 			<form class="ui form" action="{{.Link}}" method="post">
-				{{DisableFormAutofill}}
+				{{template "base/disable_form_autofill"}}
 				{{.CsrfTokenHtml}}
 				<!-- Types and name -->
 				<div class="inline required field {{if .Err_Type}}error{{end}}">
diff --git a/templates/admin/user/edit.tmpl b/templates/admin/user/edit.tmpl
index 0969bb99ef156..fb0ccd22bb5f8 100644
--- a/templates/admin/user/edit.tmpl
+++ b/templates/admin/user/edit.tmpl
@@ -8,7 +8,7 @@
 		</h4>
 		<div class="ui attached segment">
 			<form class="ui form" action="{{.Link}}" method="post">
-				{{DisableFormAutofill}}
+				{{template "base/disable_form_autofill"}}
 				{{.CsrfTokenHtml}}
 				<div class="field {{if .Err_UserName}}error{{end}}">
 					<label for="user_name">{{.i18n.Tr "username"}}</label>
diff --git a/templates/admin/user/new.tmpl b/templates/admin/user/new.tmpl
index 7bd773ba3809d..27ad28842ad08 100644
--- a/templates/admin/user/new.tmpl
+++ b/templates/admin/user/new.tmpl
@@ -8,7 +8,7 @@
 		</h4>
 		<div class="ui attached segment">
 			<form class="ui form" action="{{.Link}}" method="post">
-				{{DisableFormAutofill}}
+				{{template "base/disable_form_autofill"}}
 				{{.CsrfTokenHtml}}
 				<!-- Types and name -->
 				<div class="inline required field {{if .Err_LoginType}}error{{end}}">
diff --git a/templates/base/disable_form_autofill.tmpl b/templates/base/disable_form_autofill.tmpl
new file mode 100644
index 0000000000000..6f06395bedb37
--- /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>
diff --git a/templates/repo/migrate/git.tmpl b/templates/repo/migrate/git.tmpl
index a3ce89b46674c..39f47b27c786c 100644
--- a/templates/repo/migrate/git.tmpl
+++ b/templates/repo/migrate/git.tmpl
@@ -3,7 +3,7 @@
 	<div class="ui middle very relaxed page grid">
 		<div class="column">
 			<form class="ui form" action="{{.Link}}" method="post">
-				{{DisableFormAutofill}}
+				{{template "base/disable_form_autofill"}}
 				{{.CsrfTokenHtml}}
 				<h3 class="ui top attached header">
 					{{.i18n.Tr "repo.migrate.migrate" .service.Title}}
diff --git a/templates/repo/migrate/onedev.tmpl b/templates/repo/migrate/onedev.tmpl
index 5c7cb7d1cbc1d..3dcc253d2ebf9 100644
--- a/templates/repo/migrate/onedev.tmpl
+++ b/templates/repo/migrate/onedev.tmpl
@@ -3,7 +3,7 @@
 	<div class="ui middle very relaxed page grid">
 		<div class="column">
 			<form class="ui form" action="{{.Link}}" method="post">
-				{{DisableFormAutofill}}
+				{{template "base/disable_form_autofill"}}
 				{{.CsrfTokenHtml}}
 				<h3 class="ui top attached header">
 					{{.i18n.Tr "repo.migrate.migrate" .service.Title}}
diff --git a/templates/repo/settings/options.tmpl b/templates/repo/settings/options.tmpl
index b13c2fd8e8758..211b7da8e7cfb 100644
--- a/templates/repo/settings/options.tmpl
+++ b/templates/repo/settings/options.tmpl
@@ -9,7 +9,7 @@
 		</h4>
 		<div class="ui attached segment">
 			<form class="ui form" action="{{.Link}}" method="post">
-				{{DisableFormAutofill}}
+				{{template "base/disable_form_autofill"}}
 				{{.CsrfTokenHtml}}
 				<input type="hidden" name="action" value="update">
 				<div class="required field {{if .Err_RepoName}}error{{end}}">
@@ -105,7 +105,7 @@
 						<tr>
 							<td colspan="4">
 								<form class="ui form" method="post">
-									{{DisableFormAutofill}}
+									{{template "base/disable_form_autofill"}}
 									{{.CsrfTokenHtml}}
 									<input type="hidden" name="action" value="mirror">
 									<div class="inline field {{if .Err_EnablePrune}}error{{end}}">
@@ -196,7 +196,7 @@
 							<tr>
 								<td colspan="4">
 									<form class="ui form" method="post">
-										{{DisableFormAutofill}}
+										{{template "base/disable_form_autofill"}}
 										{{.CsrfTokenHtml}}
 										<input type="hidden" name="action" value="push-mirror-add">
 										<div class="field {{if .Err_PushMirrorAddress}}error{{end}}">
diff --git a/templates/repo/settings/webhook/gitea.tmpl b/templates/repo/settings/webhook/gitea.tmpl
index 357c9e6f26b24..09c49500a4e1f 100644
--- a/templates/repo/settings/webhook/gitea.tmpl
+++ b/templates/repo/settings/webhook/gitea.tmpl
@@ -1,7 +1,7 @@
 {{if eq .HookType "gitea"}}
 	<p>{{.i18n.Tr "repo.settings.add_webhook_desc" "https://docs.gitea.io/en-us/webhooks/" | Str2html}}</p>
 	<form class="ui form" action="{{.BaseLink}}/gitea/{{or .Webhook.ID "new"}}" method="post">
-		{{DisableFormAutofill}}
+		{{template "base/disable_form_autofill"}}
 		{{.CsrfTokenHtml}}
 		<div class="required field {{if .Err_PayloadURL}}error{{end}}">
 			<label for="payload_url">{{.i18n.Tr "repo.settings.payload_url"}}</label>
diff --git a/templates/repo/settings/webhook/gogs.tmpl b/templates/repo/settings/webhook/gogs.tmpl
index c2b1f5c07e243..3a833ddbdcb03 100644
--- a/templates/repo/settings/webhook/gogs.tmpl
+++ b/templates/repo/settings/webhook/gogs.tmpl
@@ -1,7 +1,7 @@
 {{if eq .HookType "gogs"}}
 	<p>{{.i18n.Tr "repo.settings.add_webhook_desc" "https://docs.gitea.io/en-us/webhooks/" | Str2html}}</p>
 	<form class="ui form" action="{{.BaseLink}}/gogs/{{or .Webhook.ID "new"}}" method="post">
-		{{DisableFormAutofill}}
+		{{template "base/disable_form_autofill"}}
 		{{.CsrfTokenHtml}}
 		<div class="required field {{if .Err_PayloadURL}}error{{end}}">
 			<label for="payload_url">{{.i18n.Tr "repo.settings.payload_url"}}</label>
diff --git a/templates/user/settings/account.tmpl b/templates/user/settings/account.tmpl
index 46cd49740933a..9ed5d3a6dd1ad 100644
--- a/templates/user/settings/account.tmpl
+++ b/templates/user/settings/account.tmpl
@@ -9,7 +9,7 @@
 		<div class="ui attached segment">
 			{{if or (.SignedUser.IsLocal) (.SignedUser.IsOAuth2)}}
 			<form class="ui form ignore-dirty" action="{{AppSubUrl}}/user/settings/account" method="post">
-				{{DisableFormAutofill}}
+				{{template "base/disable_form_autofill"}}
 				{{.CsrfTokenHtml}}
 				{{if .SignedUser.IsPasswordSet}}
 				<div class="required field {{if .Err_OldPassword}}error{{end}}">
@@ -179,7 +179,7 @@
 				{{ end }}
 			</div>
 			<form class="ui form ignore-dirty" id="delete-form" action="{{AppSubUrl}}/user/settings/account/delete" method="post">
-				{{DisableFormAutofill}}
+				{{template "base/disable_form_autofill"}}
 				{{.CsrfTokenHtml}}
 				<div class="required field {{if .Err_Password}}error{{end}}">
 					<label for="password-confirmation">{{.i18n.Tr "password"}}</label>