catamphetamine / react-phone-number-input

React component for international phone number input
http://catamphetamine.gitlab.io/react-phone-number-input/
MIT License
915 stars 193 forks source link

Can still delete when input is readonly #398

Closed rmjwilbur closed 2 years ago

rmjwilbur commented 2 years ago

I am trying to make the field read only when the app isn't in edit mode. The field appears to be read only visibly, and I can't add digits, but I can delete digits and I can select and delete the value.

The cursor is not visible, but clicking in the value still works as I can click after a specific digit and press delete.

My component is a MUI v5 text field, and other fields work properly. The input does have readonly set on it. As per Chrome's inspect:

Credit goes to my wife for noticing this. Only she would try to delete in a read only field.

catamphetamine commented 2 years ago

Ha, good catch. Wouldn't imagine attempting to tamper with a readOnly input field, lol. Indeed, the input-format library didn't check the readonly HTML attribute when handling keydown/etc events. Fixed in react-phone-number-input@3.1.45