Bugfix: hide password on shortcuts

[lukasstorck]

Bugfix

• A: passwords on the login page are briefly revealed when pasting with Ctrl+V
• B: when using shortcut to autofill (e.g. Ctrl+Shift+L for Bitwarden), which opens a new window to unlock the password manager, the password is not hidden again, as the Control keyup event is not send to the login page

Expected Behavior

Password should only be visible when the user intentionally holds down a modifier key for quick inspection, and should never remain visible longer than intended.

Fixes

• A: when "V" is pressed while "Ctrl" is pressed, reset the input field to type="password"
• B: listen to "blur" event and hide password

Summary by CodeRabbit

• Bug Fixes
  • Password fields remain masked when pasting, preventing pasted content from being revealed accidentally.
  • Password inputs automatically re-mask when the application or window loses focus to protect sensitive input.
  • Improved modifier-key handling to reduce accidental password exposure and enhance input privacy, ensuring show/hide behavior is consistent across key and focus events.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai]

📝 Walkthrough

Walkthrough

Adds paste-hide behavior and a window blur effect to use-password-toggle: detects Ctrl/Cmd+V to re-mask pasted content and auto-hides the password when the window loses focus; existing Control key show/hide handlers remain unchanged.

Changes

Cohort / File(s)	Summary
Password security enhancements libs/hooks/src/hooks/use-password-toggle.ts	Detects Ctrl/Cmd+V in keydown to reset the input to password, adds a window blur effect that sets the input type to password on unfocus, and preserves existing Control keydown/keyup show-hide logic.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

• Verify Ctrl/Cmd+V detection does not conflict with existing Control keydown show behavior.
• Confirm window blur handler correctly re-masks input and is removed on cleanup.
• Check platform differences (Ctrl vs Cmd) and edge cases with modifier keys.

Poem

🐰 I peeked, then hid what eyes could see,
A paste slipped in — I tuck it, shh, quietly.
When windows wander or fingers flee,
Your secret stays snug, safe with me. ✨

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly summarizes the main changes: adding password hiding logic when shortcuts are used (Ctrl+V paste and window blur scenarios).
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

---

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 03d7cb3 and 0c78517.

📒 Files selected for processing (1)

• libs/hooks/src/hooks/use-password-toggle.ts (2 hunks)

🚧 Files skipped from review as they are similar to previous changes (1)

• libs/hooks/src/hooks/use-password-toggle.ts

---

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: 2

🧹 Nitpick comments (1)

libs/hooks/src/hooks/use-password-toggle.ts (1)

43-55: Consider extracting password hiding logic to reduce duplication.

The password hiding logic (lines 46-48) is duplicated in three places: the Ctrl+V handler (lines 13-15), the Control keyup handler (lines 30-32), and this blur handler. Extracting this to a helper function would improve maintainability.

Example refactor:

const hidePassword = () => {
  formRef.current
    ?.querySelector<HTMLInputElement>('input[name="password"]')
    ?.setAttribute("type", "password");
};

Then use hidePassword() in all three locations. This would also make the blur handler more concise:

// Hide Password when losing focus (e.g. unlocking password manager)
useEffect(() => {
  window.addEventListener("blur", hidePassword);
  return () => {
    window.removeEventListener("blur", hidePassword);
  };
}, [formRef]);

Note: The helper would need to be defined inside the hook to access formRef, or accept it as a parameter.

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 25021d1 and 785fd49.

📒 Files selected for processing (1)

• libs/hooks/src/hooks/use-password-toggle.ts (2 hunks)