Is there a way to hide value from input with password in React?

Question

I have this code for input with type="password"

<input
  type="password"
  id="password"
  value={form.password}
  onChange={handlePasswordChange}
/>

It works, but I noticed, that in develeopers console "Elements"you can actually see value of password field:

<input type="password" class="form-control undefined" value="qwerty">

Is it ok, that it shows password like this? Is there a way to hide it? Should i use uncontrolled componenets instead of controlled?

As long as you're not setting the value to an actual password, all the user would be able to see is the value they've entered. — David
– David, Commented Sep 3, 2021 at 10:40
That's good question. Even in the Google SignUp we can see that. Since you use this feature whenever user fills up the form him/her-self this is not a problem. — Yaya
– Yaya, Commented Sep 3, 2021 at 10:56

Itay Ganor · Accepted Answer · 2021-09-03 10:39:31Z

6

type="password" only cosmetically hides the password. The input value is always accessible via JS (using it's .value property). So when someone opens DevTools, he or she will be able to get the password regardless.

answered Sep 3, 2021 at 10:39

Itay Ganor

4,2053 gold badges28 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Is there a way to hide value from input with password in React?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related