fix: correct autocomplete attributes to enable password manager autofill

[prince0xdev]

📝 Pull Request Title

fix: enable password manager autofill on login form (#3735)

---

💡 Description

Summary

Fixes #3735

Password managers (Chrome, Firefox, Brave, etc.) were not detecting the email/username field in the login form.
As a result, users had to manually click the password field to see their saved credentials, making the login experience less intuitive.

This PR updates the autocomplete attributes on both fields to comply with HTML autofill standards, ensuring password managers correctly detect and autofill saved credentials.

---

Current Behavior (Before Fix)

• The username field used autoComplete="off", preventing autofill detection.
• Password managers ignored the field until the user interacted with the password input.
• Users needed an extra click to retrieve stored credentials.

Rendered HTML (before):

<input type="text" name="username" autocomplete="off" />

Result:
Password managers did not auto-suggest saved accounts.

---

New Behavior (After Fix)

• Updated username field: autocomplete="username".
• Updated password field: autocomplete="current-password".
• Both fields are now recognized and filled automatically by password managers.

Rendered HTML (after):

<input type="text" name="username" autocomplete="username" />
<input type="password" name="password" autocomplete="current-password" />

✅ Result:
Credentials are suggested and autofilled immediately across all major browsers.

---

Affected File

src/app/login/LoginForm.tsx

---

Testing

Browsers Tested

• ✅ Chrome 130+
• ✅ Firefox 130+
• ✅ Brave 1.70+

Verification Steps

1. Go to /login.
2. Make sure you have saved credentials in your browser.
3. Click on the email/username field.
4. Saved credentials are now detected instantly (no need to click on the password field).

---

Why This Matters

This fix improves login UX consistency and aligns with best practices for autofill and accessibility.
No impact on backend logic or authentication flow.

---

References

• Fixes issue: [#3735](Password managers unable to detect email field on login form #3735)
• [MDN autocomplete attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete)
• [WHATWG HTML Standard — Autofill field names](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill)

---

Reviewer Note

This change restores standard browser autofill behavior and improves user experience.
Tested across multiple browsers — safe to merge.

---

🧩 Commit message

fix: enable password manager autofill on login form (#3735)

[vercel]

Someone is attempting to deploy a commit to the umami-software Team on Vercel.

A member of the Team first needs to authorize it.

[greptile-apps]

Greptile Overview

Greptile Summary

This PR fixes password manager autofill detection on the login form by updating autocomplete attributes to comply with HTML standards.

Key Changes:

• Updated username field from autoComplete="off" to autoComplete="username"
• Added autoComplete="current-password" to the password field

Impact:

• Password managers (Chrome, Firefox, Brave) now correctly detect and autofill both fields
• Improves login UX by eliminating the need for manual password field interaction
• No changes to authentication logic or backend behavior

Confidence Score: 5/5

• This PR is safe to merge with no risk
• The changes only update HTML autocomplete attributes to standard values, with no impact on functionality, security, or authentication logic. The modification is minimal, well-tested across browsers, and aligns with web standards.
• No files require special attention

Important Files Changed

File Analysis

Filename	Score	Overview
src/app/login/LoginForm.tsx	5/5	Updated autocomplete attributes to enable password manager autofill detection

Sequence Diagram

sequenceDiagram
    participant Browser
    participant PasswordManager
    participant LoginForm
    participant TextField
    participant PasswordField

    Browser->>LoginForm: User navigates to /login
    LoginForm->>TextField: Render with autoComplete="username"
    LoginForm->>PasswordField: Render with autoComplete="current-password"
    
    TextField->>Browser: Renders input with autocomplete attribute
    PasswordField->>Browser: Renders input with autocomplete attribute
    
    Browser->>PasswordManager: Detect autocomplete="username" field
    Browser->>PasswordManager: Detect autocomplete="current-password" field
    
    PasswordManager->>Browser: Offer saved credentials
    Browser->>TextField: Autofill username
    Browser->>PasswordField: Autofill password
    
    Note over Browser,PasswordField: Password managers now detect<br/>and autofill both fields automatically

Loading

[greptile-apps]

_{1 file reviewed, no comments}

_{Edit Code Review Agent Settings | Greptile}