back round 0 view raw

appview/pages (knot/spindle): fix firefox autofilling "add member" modal with autocomplete=off #750

merged
opened by evan.jarrett.net targeting master from evan.jarrett.net/core: modal-input-prefill

Summary#

Fixes Firefox-specific bug where "add member" modal input is prefilled with registration hostname for knots and spindles. (doesn't happen in chromium)

Issue:

  1. User enters hostname in registration form
  2. Registration succeeds and triggers HxRefresh (full page reload)
  3. Firefox aggressively restores form state after refresh
  4. User then clicks "add member" on the newly created knot/spindle
  5. Firefox incorrectly auto-fills the modal member input with the registration form value

Solution#

Add autocomplete="off" to prevent browser from auto-filling or restoring values in member input fields. Since this is not a login field, and users should be adding new members each time there is no reason to let the browser autofill.

Changes#

  • Added autocomplete="off" to member input in appview/pages/templates/knots/fragments/addMemberModal.html
  • Added autocomplete="off" to member input in appview/pages/templates/spindles/fragments/addMemberModal.html
  • Added autocapitalize="none" and autocorrect="off" to knots modal for consistency with spindles
options
unified split
Changed files
+4
appview
pages
templates
knots
fragments
addMemberModal.html
spindles
fragments
addMemberModal.html
+3
appview/pages/templates/knots/fragments/addMemberModal.html 
···

       
30

       
30

       
 

       
  </label>


     

       
31

       
31

       
 

       
  <p class="text-sm text-gray-500 dark:text-gray-400">Members can create repositories and run workflows on this knot.</p>


     

       
32

       
32

       
 

       
  <input


     

       

       
33

       
+

       
    autocapitalize="none"


     

       

       
34

       
+

       
    autocorrect="off"


     

       

       
35

       
+

       
    autocomplete="off"


     

       
33

       
36

       
 

       
    type="text"


     

       
34

       
37

       
 

       
    id="member-did-{{ .Id }}"


     

       
35

       
38

       
 

       
    name="member"
+1
appview/pages/templates/spindles/fragments/addMemberModal.html 
···

       
32

       
32

       
 

       
  <input


     

       
33

       
33

       
 

       
    autocapitalize="none"


     

       
34

       
34

       
 

       
    autocorrect="off"


     

       

       
35

       
+

       
    autocomplete="off"


     

       
35

       
36

       
 

       
    type="text"


     

       
36

       
37

       
 

       
    id="member-did-{{ .Id }}"


     

       
37

       
38

       
 

       
    name="member"