JedWatson / JedWatson/react-select
Issue with input type="number" on Firefox/Safari
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 28k
- Forks
- 4.1k
- PR merge metrics
- No merged PRs in 30d
Description
I am trying to replace the Input component in order to use a <input type="number" />. This works well in chrome, but I'm hitting an issue on Firefox and Safari: when typing a non-number character, the input gets cleared out and it's impossible to type anything else nor to clear the input (have to refresh the page in order to get unstuck).
Here is a minimal reproduction (has to be opened in Firefox or Safari):
https://codesandbox.io/p/sandbox/youthful-lamport-c39lv6
And here is a gif of the issue (using Firefox):
In the gif above, I first type "123" then the letter "a" which triggers the input to be cleared. From that point forward, everything I type (letters, numbers, backspace) has no effect.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the linked CodeSandbox reproduction and the Input component replacement described in the issue, testing it in Firefox and Safari. Trace what happens after an invalid character is entered; done means the custom number input remains usable and can accept further input or be cleared without refreshing.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 42/100