[PR #16246] [MERGED] feat: Add password visibility toggle to password fields with SensitiveInput.svelte component #62935

Closed
opened 2026-05-06 07:25:10 -05:00 by GiteaMirror · 0 comments
Owner

📋 Pull Request Information

Original PR: https://github.com/open-webui/open-webui/pull/16246
Author: @silentoplayz
Created: 8/3/2025
Status: Merged
Merged: 8/4/2025
Merged by: @tjbck

Base: devHead: sensitiveinput-password-fields


📝 Commits (1)

  • 56eeed6 feat: Add password visibility toggle to password fields w SensitiveInput.svelte component

📊 Changes

4 files changed (+14 additions, -8 deletions)

View changed files

📝 src/lib/components/admin/Users/UserList/AddUserModal.svelte (+3 -1)
📝 src/lib/components/admin/Users/UserList/EditUserModal.svelte (+3 -1)
📝 src/lib/components/chat/Settings/Account/UpdatePassword.svelte (+5 -4)
📝 src/routes/auth/+page.svelte (+3 -2)

📄 Description

Pull Request Checklist

Note to first-time contributors: Please open a discussion post in Discussions and describe your changes before submitting a pull request.

  • Target branch: Please verify that the pull request targets the dev branch.
  • Description: Provide a concise description of the changes made in this pull request.
  • Changelog: Ensure a changelog entry following the format of Keep a Changelog is added at the bottom of the PR description.
  • Documentation: Have you updated relevant documentation Open WebUI Docs, or other documentation sources?
  • Dependencies: Are there any new dependencies? Have you updated the dependency versions in the documentation?
  • Testing: Have you written and run sufficient tests to validate the changes?
  • Code review: Have you performed a self-review of your code, addressing any coding standard issues and ensuring adherence to the project's coding standards?
  • Prefix: To clearly categorize this pull request, prefix the pull request title using one of the following:
    • BREAKING CHANGE: Significant changes that may affect compatibility
    • build: Changes that affect the build system or external dependencies
    • ci: Changes to our continuous integration processes or workflows
    • chore: Refactor, cleanup, or other non-functional code changes
    • docs: Documentation update or addition
    • feat: Introduces a new feature or enhancement to the codebase
    • fix: Bug fix or error correction
    • i18n: Internationalization or localization changes
    • perf: Performance improvement
    • refactor: Code restructuring for better maintainability, readability, or scalability
    • style: Changes that do not affect the meaning of the code (white space, formatting, missing semi-colons, etc.)
    • test: Adding missing tests or correcting existing tests
    • WIP: Work in progress, a temporary label for incomplete or ongoing work

Changelog Entry

Description

  • Replaced standard HTML <input> elements with the SensitiveInput component for improved security and consistent handling of sensitive data, specifically for password fields. This also involved updating related imports and adjusting props.

Added

  • Added import SensitiveInput from '$lib/components/common/SensitiveInput.svelte'; in multiple files.

Changed

  • Replaced <input> tags with <SensitiveInput> component in:
    • src/lib/components/admin/Users/UserList/AddUserModal.svelte
    • src/lib/components/admin/Users/UserList/EditUserModal.svelte
    • src/lib/components/chat/Settings/Account/UpdatePassword.svelte
    • src/routes/auth/+page.svelte (Login & Registration form inputs)

Removed

  • Removed several <input> elements.

Fixed

  • Improved handling of sensitive input fields by using a dedicated component.

Security

  • Enhanced security for password input fields by using SensitiveInput component.

Breaking Changes

  • BREAKING CHANGE: Direct usage of <input> for password fields has been replaced with SensitiveInput. Components that directly interacted with the previous <input> structure for passwords may need adjustments if not updated. I've tested my changes in this PR though and they generally look good and just work.

Additional Information

Screenshots or Videos

  • src/lib/components/admin/Users/UserList/AddUserModal.svelte
    image

  • src/lib/components/admin/Users/UserList/EditUserModal.svelte
    image

  • src/lib/components/chat/Settings/Account/UpdatePassword.svelte
    image

  • src/routes/auth/+page.svelte (Login & Registration form inputs)
    image
    image

Contributor License Agreement

By submitting this pull request, I confirm that I have read and fully agree to the Contributor License Agreement (CLA), and I am providing my contributions under its terms.


🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/open-webui/open-webui/pull/16246 **Author:** [@silentoplayz](https://github.com/silentoplayz) **Created:** 8/3/2025 **Status:** ✅ Merged **Merged:** 8/4/2025 **Merged by:** [@tjbck](https://github.com/tjbck) **Base:** `dev` ← **Head:** `sensitiveinput-password-fields` --- ### 📝 Commits (1) - [`56eeed6`](https://github.com/open-webui/open-webui/commit/56eeed62776241fbb092b69a2c2b7105442022d3) feat: Add password visibility toggle to password fields w SensitiveInput.svelte component ### 📊 Changes **4 files changed** (+14 additions, -8 deletions) <details> <summary>View changed files</summary> 📝 `src/lib/components/admin/Users/UserList/AddUserModal.svelte` (+3 -1) 📝 `src/lib/components/admin/Users/UserList/EditUserModal.svelte` (+3 -1) 📝 `src/lib/components/chat/Settings/Account/UpdatePassword.svelte` (+5 -4) 📝 `src/routes/auth/+page.svelte` (+3 -2) </details> ### 📄 Description # Pull Request Checklist ### Note to first-time contributors: Please open a discussion post in [Discussions](https://github.com/open-webui/open-webui/discussions) and describe your changes before submitting a pull request. - [X] **Target branch:** Please verify that the pull request targets the `dev` branch. - [X] **Description:** Provide a concise description of the changes made in this pull request. - [X] **Changelog:** Ensure a changelog entry following the format of [Keep a Changelog](https://keepachangelog.com/) is added at the bottom of the PR description. - [X] **Documentation:** Have you updated relevant documentation [Open WebUI Docs](https://github.com/open-webui/docs), or other documentation sources? - [X] **Dependencies:** Are there any new dependencies? Have you updated the dependency versions in the documentation? - [X] **Testing:** Have you written and run sufficient tests to validate the changes? - [X] **Code review:** Have you performed a self-review of your code, addressing any coding standard issues and ensuring adherence to the project's coding standards? - [X] **Prefix:** To clearly categorize this pull request, prefix the pull request title using one of the following: - **BREAKING CHANGE**: Significant changes that may affect compatibility - **build**: Changes that affect the build system or external dependencies - **ci**: Changes to our continuous integration processes or workflows - **chore**: Refactor, cleanup, or other non-functional code changes - **docs**: Documentation update or addition - **feat**: Introduces a new feature or enhancement to the codebase - **fix**: Bug fix or error correction - **i18n**: Internationalization or localization changes - **perf**: Performance improvement - **refactor**: Code restructuring for better maintainability, readability, or scalability - **style**: Changes that do not affect the meaning of the code (white space, formatting, missing semi-colons, etc.) - **test**: Adding missing tests or correcting existing tests - **WIP**: Work in progress, a temporary label for incomplete or ongoing work # Changelog Entry ### Description - Replaced standard HTML `<input>` elements with the `SensitiveInput` component for improved security and consistent handling of sensitive data, specifically for password fields. This also involved updating related imports and adjusting props. ### Added - Added `import SensitiveInput from '$lib/components/common/SensitiveInput.svelte';` in multiple files. ### Changed - Replaced `<input>` tags with `<SensitiveInput>` component in: - `src/lib/components/admin/Users/UserList/AddUserModal.svelte` - `src/lib/components/admin/Users/UserList/EditUserModal.svelte` - `src/lib/components/chat/Settings/Account/UpdatePassword.svelte` - `src/routes/auth/+page.svelte` (Login & Registration form inputs) ### Removed - Removed several `<input>` elements. ### Fixed - Improved handling of sensitive input fields by using a dedicated component. ### Security - Enhanced security for password input fields by using `SensitiveInput` component. ### Breaking Changes - **BREAKING CHANGE**: Direct usage of `<input>` for password fields has been replaced with `SensitiveInput`. Components that directly interacted with the previous `<input>` structure for passwords may need adjustments if not updated. I've tested my changes in this PR though and they generally look good and just work. ### Additional Information - This pull request fulfills a long standing feature request by an Open WebUI Discord server member. It also compliments the [`Confirm Password on Signup` commit](https://github.com/open-webui/open-webui/commit/b510f21a5b4b4f2039ac5c157dd27ac12ed185db). <img width="1375" height="112" alt="image" src="https://github.com/user-attachments/assets/970d50cc-8f06-4c1b-91c8-ab22b3c8aa32" /> ### Screenshots or Videos - `src/lib/components/admin/Users/UserList/AddUserModal.svelte` <img width="508" height="411" alt="image" src="https://github.com/user-attachments/assets/00941c5b-d001-462f-b2a9-e3ad3494f7d0" /> - `src/lib/components/admin/Users/UserList/EditUserModal.svelte` <img width="508" height="411" alt="image" src="https://github.com/user-attachments/assets/0891c34b-f0a8-4abf-8c9d-8b81e6bb8e2e" /> - `src/lib/components/chat/Settings/Account/UpdatePassword.svelte` <img width="927" height="608" alt="image" src="https://github.com/user-attachments/assets/cabeeb07-4716-433c-a289-a82d38cbd2f5" /> - `src/routes/auth/+page.svelte` (Login & Registration form inputs) <img width="927" height="608" alt="image" src="https://github.com/user-attachments/assets/81873269-2591-4965-92e0-2328a5b104b6" /> <img width="927" height="608" alt="image" src="https://github.com/user-attachments/assets/b1b2b24d-3f75-4c1f-acda-03ce25d92b46" /> ### Contributor License Agreement By submitting this pull request, I confirm that I have read and fully agree to the [Contributor License Agreement (CLA)](/CONTRIBUTOR_LICENSE_AGREEMENT), and I am providing my contributions under its terms. --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
GiteaMirror added the pull-request label 2026-05-06 07:25:10 -05:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/open-webui#62935