fix: Disable spellcheck on repo name field (#12506)

Fairly new to Forgejo but I just ran into this when trying to create a couple repositories.
I noticed that the input field for the repository name in several areas of the UI is prone to have annoying auto-capitalization, spellchecking and other browser features which try to correct the user input.

I as a user would like to not have the browser interfere with my input especially in dialogs where I want to have something "custom".
For fields where the repo name is used to validate an action (Danger Zone) this is even more frustrating.

So, to me, this is a quality of live improvement fix.

I checked the docs for these three attributes and none of them seem to have a negative side effect for the user:

1. https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/autocorrect
2. https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/autocapitalize
3. https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/spellcheck

## List of URLs where this applies:
1. `/repo/migrate`
2. `/repo/create`
3. `/<user>/<repo slug>/settings`
4. In general things in the "Danger zone" section where the repo name is used to validate the action
5. …

Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/12506
Reviewed-by: 0ko <0ko@noreply.codeberg.org>
Reviewed-by: Beowulf <beowulf@beocode.eu>
This commit is contained in:
moritzdietz 2026-05-10 21:42:21 +02:00 committed by Beowulf
parent e5eb5f8e63
commit a8cae6d511
14 changed files with 20 additions and 20 deletions

View file

@ -13,7 +13,7 @@
<form class="ui form ignore-dirty tw-flex-1 tw-flex" action="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/repo/add" method="post">
<div id="search-repo-box" data-uid="{{.Org.ID}}" class="ui search">
<div class="ui input">
<input class="prompt" name="repo_name" placeholder="{{ctx.Locale.Tr "search.repo_kind"}}" autocomplete="off" required>
<input class="prompt" name="repo_name" placeholder="{{ctx.Locale.Tr "search.repo_kind"}}" autocomplete="off" autocorrect="off" autocapitalize="none" spellcheck="false" required>
</div>
</div>
<button class="ui primary button tw-ml-2">{{ctx.Locale.Tr "add"}}</button>

View file

@ -35,7 +35,7 @@
</label>
<label {{if .Err_RepoName}}class="field error"{{end}}>
{{ctx.Locale.Tr "repo.repo_name"}}
<input name="repo_name" value="{{.repo_name}}" required maxlength="100">
<input name="repo_name" value="{{.repo_name}}" required maxlength="100" autocorrect="off" autocapitalize="none" spellcheck="false">
<span class="help">{{ctx.Locale.Tr "repo.repo_name_helper"}}</span>
</label>
<label>

View file

@ -88,7 +88,7 @@
<div class="inline required field {{if .Err_RepoName}}error{{end}}">
<label for="repo_name">{{ctx.Locale.Tr "repo.repo_name"}}</label>
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required maxlength="100">
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required maxlength="100" autocorrect="off" autocapitalize="none" spellcheck="false">
</div>
<div class="inline field">
<label>{{ctx.Locale.Tr "repo.visibility"}}</label>

View file

@ -56,7 +56,7 @@
<div class="inline required field {{if .Err_RepoName}}error{{end}}">
<label for="repo_name">{{ctx.Locale.Tr "repo.repo_name"}}</label>
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required maxlength="100">
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required maxlength="100" autocorrect="off" autocapitalize="none" spellcheck="false">
</div>
<div class="inline field">
<label>{{ctx.Locale.Tr "repo.visibility"}}</label>

View file

@ -104,7 +104,7 @@
<div class="inline required field {{if .Err_RepoName}}error{{end}}">
<label for="repo_name">{{ctx.Locale.Tr "repo.repo_name"}}</label>
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required maxlength="100">
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required maxlength="100" autocorrect="off" autocapitalize="none" spellcheck="false">
</div>
<div class="inline field">
<label>{{ctx.Locale.Tr "repo.visibility"}}</label>

View file

@ -100,7 +100,7 @@
<div class="inline required field {{if .Err_RepoName}}error{{end}}">
<label for="repo_name">{{ctx.Locale.Tr "repo.repo_name"}}</label>
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required maxlength="100">
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required maxlength="100" autocorrect="off" autocapitalize="none" spellcheck="false">
</div>
<div class="inline field">
<label>{{ctx.Locale.Tr "repo.visibility"}}</label>

View file

@ -102,7 +102,7 @@
<div class="inline required field {{if .Err_RepoName}}error{{end}}">
<label for="repo_name">{{ctx.Locale.Tr "repo.repo_name"}}</label>
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required maxlength="100">
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required maxlength="100" autocorrect="off" autocapitalize="none" spellcheck="false">
</div>
<div class="inline field">
<label>{{ctx.Locale.Tr "repo.visibility"}}</label>

View file

@ -99,7 +99,7 @@
<div class="inline required field {{if .Err_RepoName}}error{{end}}">
<label for="repo_name">{{ctx.Locale.Tr "repo.repo_name"}}</label>
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required maxlength="100">
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required maxlength="100" autocorrect="off" autocapitalize="none" spellcheck="false">
</div>
<div class="inline field">
<label>{{ctx.Locale.Tr "repo.visibility"}}</label>

View file

@ -99,7 +99,7 @@
<div class="inline required field {{if .Err_RepoName}}error{{end}}">
<label for="repo_name">{{ctx.Locale.Tr "repo.repo_name"}}</label>
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required maxlength="100">
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required maxlength="100" autocorrect="off" autocapitalize="none" spellcheck="false">
</div>
<div class="inline field">
<label>{{ctx.Locale.Tr "repo.visibility"}}</label>

View file

@ -74,7 +74,7 @@
</div>
<div class="required field">
<label for="repo_name_to_delete">{{ctx.Locale.Tr "repo.settings.confirmation_string"}}</label>
<input id="repo_name_to_delete" name="repo_name" required>
<input id="repo_name_to_delete" name="repo_name" autocorrect="off" autocapitalize="none" spellcheck="false" required>
</div>
</div>
<div class="actions">

View file

@ -88,7 +88,7 @@
<div class="inline required field {{if .Err_RepoName}}error{{end}}">
<label for="repo_name">{{ctx.Locale.Tr "repo.repo_name"}}</label>
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required maxlength="100">
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required maxlength="100" autocorrect="off" autocapitalize="none" spellcheck="false">
</div>
<div class="inline field">
<label>{{ctx.Locale.Tr "repo.visibility"}}</label>

View file

@ -22,7 +22,7 @@
</div>
<div class="inline required field {{if .Err_RepoName}}error{{end}}">
<label for="repo_name">{{ctx.Locale.Tr "repo.repo_name"}}</label>
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required maxlength="100">
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required maxlength="100" autocorrect="off" autocapitalize="none" spellcheck="false">
</div>
{{template "repo/migrate/options" .}}
<div id="migrate_items">

View file

@ -40,7 +40,7 @@
</div>
<div class="inline required field {{if .Err_RepoName}}error{{end}}">
<label for="repo_name">{{ctx.Locale.Tr "repo.repo_name"}}</label>
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required>
<input id="repo_name" name="repo_name" value="{{.repo_name}}" required autocorrect="off" autocapitalize="none" spellcheck="false">
</div>
<div class="inline field">
<label>{{ctx.Locale.Tr "repo.visibility"}}</label>

View file

@ -9,7 +9,7 @@
<input type="hidden" name="action" value="update">
<div class="required field {{if .Err_RepoName}}error{{end}}">
<label>{{ctx.Locale.Tr "repo.repo_name"}}</label>
<input name="repo_name" value="{{.Repository.Name}}" data-repo-name="{{.Repository.Name}}" autofocus required>
<input name="repo_name" value="{{.Repository.Name}}" data-repo-name="{{.Repository.Name}}" autofocus required autocorrect="off" autocapitalize="none" spellcheck="false">
</div>
<div class="inline field">
<label>{{ctx.Locale.Tr "repo.repo_size"}}</label>
@ -578,7 +578,7 @@
</div>
<div class="required field">
<label>{{ctx.Locale.Tr "repo.settings.confirmation_string"}}</label>
<input name="repo_name" required maxlength="100">
<input name="repo_name" required maxlength="100" autocorrect="off" autocapitalize="none" spellcheck="false">
</div>
</div>
<div class="actions">
@ -609,7 +609,7 @@
</div>
<div class="required field">
<label>{{ctx.Locale.Tr "repo.settings.confirmation_string"}}</label>
<input name="repo_name" required>
<input name="repo_name" required autocorrect="off" autocapitalize="none" spellcheck="false">
</div>
</div>
<div class="actions">
@ -641,7 +641,7 @@
</div>
<div class="required field">
<label>{{ctx.Locale.Tr "repo.settings.confirmation_string"}}</label>
<input name="repo_name" required>
<input name="repo_name" required autocorrect="off" autocapitalize="none" spellcheck="false">
</div>
<div class="required field">
<label for="new_owner_name">{{ctx.Locale.Tr "repo.settings.transfer_owner"}}</label>
@ -679,7 +679,7 @@
</div>
<div class="required field">
<label for="repo_name_to_delete">{{ctx.Locale.Tr "repo.settings.confirmation_string"}}</label>
<input id="repo_name_to_delete" name="repo_name" required>
<input id="repo_name_to_delete" name="repo_name" autocorrect="off" autocapitalize="none" spellcheck="false" required>
</div>
</div>
<div class="actions">
@ -711,7 +711,7 @@
</div>
<div class="required field">
<label>{{ctx.Locale.Tr "repo.settings.confirmation_string"}}</label>
<input name="repo_name" required>
<input name="repo_name" required autocorrect="off" autocapitalize="none" spellcheck="false">
</div>
</div>
<div class="actions">
@ -744,7 +744,7 @@
</div>
<div class="required field">
<label>{{ctx.Locale.Tr "repo.settings.confirmation_string"}}</label>
<input name="repo_name" required>
<input name="repo_name" required autocorrect="off" autocapitalize="none" spellcheck="false">
</div>
</div>
<div class="actions">