chore: Add autocomplete attribute to 2FA input fields

[Sarthakkad05]

Proposed changes (including videos or screenshots)

Adds autocomplete="one-time-code" attribute to the 2FA TOTP and Email code input fields to improve password manager compatibility (KeePassXC, Bitwarden, 1Password, etc.).

Changes

• TwoFactorTotpModal.tsx - Added autoComplete='one-time-code' to TextInput
• TwoFactorEmailModal.tsx - Added autoComplete='one-time-code' to TextInput

This follows the W3C recommendation for one-time code fields.

Issue(s)

Fixes #30025

Steps to test or reproduce

1. Enable 2FA on your account
2. Log out and log back in
3. When prompted for 2FA code, verify that password managers (KeePassXC, Bitwarden, etc.) now recognize the field and offer to autofill

Further comments

This is a minimal, focused fix addressing the accessibility issue. The autocomplete="one-time-code" attribute is the standard way to identify OTP fields per HTML specification.

Summary by CodeRabbit

• New Features
  • The 2FA (TOTP) verification field now supports browser and device autofill for one-time codes, making verification faster and more convenient—especially on mobile where code suggestions are available.
  • Works seamlessly with supported password managers and authenticator apps; manual entry remains available.
  • No changes to the overall 2FA flow or settings.

Task: COMM-148

[changeset-bot]

⚠️ No Changeset found

Latest commit: defd1ef

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[dionisio-bot]

Looks like this PR is ready to merge! 🎉
If you have any trouble, please check the PR guidelines

[CLAassistant]

All committers have signed the CLA.

[coderabbitai]

Walkthrough

Added autoComplete="one-time-code" to the TOTP authentication code TextInput in the 2FA security screen to support browser autofill for one-time codes. No other changes or API modifications.

Changes

Cohort / File(s)	Summary of Changes
2FA TOTP UI apps/meteor/client/views/account/security/TwoFactorTOTP.tsx	Set TextInput prop autoComplete="one-time-code" for the TOTP code field; no other logic or API changes.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~2 minutes

Poem

I sniff the breeze of one-time code,
A carrot-quick autofill, easing the load.
Tap-tap, hop—no typing spree,
The digits bloom for bun and me.
In fields of forms, I twirl with glee—
Two-factor safe, swift as can be. 🥕✨

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Docstring Coverage	✅ Passed	No functions found in the changes. Docstring coverage check skipped.
Title check	✅ Passed	The PR title accurately reflects the main change: adding the autocomplete attribute to the 2FA TOTP input field to enable browser autofill functionality.
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 0

🧹 Nitpick comments (3)

apps/meteor/client/views/account/security/TwoFactorTOTP.tsx (3)

161-161: Good fix: adds OTP autofill support.

KeePassXC and modern browsers key off autocomplete="one-time-code". Change looks correct.

Consider mobile UX and avoiding mis-parsing leading zeros. Add numeric hints without switching to type="number":

-<TextInput id={totpCodeId} mie='8px' {...register('authCode')} autoComplete="one-time-code"/>
+<TextInput
+  id={totpCodeId}
+  mie='8px'
+  {...register('authCode')}
+  autoComplete='one-time-code'
+  inputMode='numeric'
+  pattern='[0-9]*'
+  autoCapitalize='off'
+  autoCorrect='off'
+  spellCheck={false}
+/>

---

161-161: Minor: quote style consistency.

Elsewhere props use single quotes; switch "one-time-code" to 'one-time-code' for consistency.

---

161-161: Add autoComplete='one-time-code' to OTP inputs

Apply autoComplete="one-time-code" to the TextInput fields so platform OTP autofill works consistently:

• apps/meteor/client/components/TwoFactorModal/TwoFactorTotpModal.tsx — add autoComplete="one-time-code" to the TextInput.
• apps/meteor/client/components/TwoFactorModal/TwoFactorEmailModal.tsx — add autoComplete="one-time-code" to the TextInput.

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

Disabled knowledge base sources:

• Jira integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between e8b9f27 and f10c826.

📒 Files selected for processing (1)

• apps/meteor/client/views/account/security/TwoFactorTOTP.tsx (1 hunks)

[KevLehman]

@dougfabris do u know if this is still valid?

[dougfabris]

/jira COMM

[cubic-dev-ai]

1 issue found across 3 files (changes from recent commits).

Prompt for AI agents (unresolved issues)

Check if these issues are valid — if so, understand the root cause of each and fix them. If appropriate, use sub-agents to investigate and fix each issue separately.


<file name="apps/meteor/client/views/account/security/TwoFactorTOTP.tsx">

<violation number="1">
P3: The TOTP input lost `autoComplete="one-time-code"`, which can disable OTP autofill/password-manager detection for this flow. Re-add the attribute to preserve expected 2FA autofill behavior.</violation>
</file>

_{Reply with feedback, questions, or to request a fix. Tag @cubic-dev-ai to re-run a review.}

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 70.21%. Comparing base (448754d) to head (defd1ef).
⚠️ Report is 3 commits behind head on develop.

Additional details and impacted files

@@             Coverage Diff             @@
##           develop   #37014      +/-   ##
===========================================
- Coverage    70.26%   70.21%   -0.06%     
===========================================
  Files         3279     3280       +1     
  Lines       116798   116814      +16     
  Branches     20742    20667      -75     
===========================================
- Hits         82066    82017      -49     
- Misses       31457    31510      +53     
- Partials      3275     3287      +12     

Flag	Coverage Δ
e2e	59.69% <ø> (-0.07%)	⬇️
e2e-api	46.55% <ø> (-0.15%)	⬇️
unit	71.04% <ø> (-0.05%)	⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.