Merge pull request #479 from oneblink/ON-33356

ON-33356 # reuse setTimeout in handling wheel event in number element
oneblink · Jul 23, 2023 · 406a449 · 406a449
2 parents 4e5e51d + 6150583
commit 406a449
Showing 1 changed file with 4 additions and 6 deletions.
diff --git a/src/form-elements/FormElementNumber.tsx b/src/form-elements/FormElementNumber.tsx
@@ -40,17 +40,15 @@ function FormElementNumber({
  [element, onChange],
  )
  const htmlInputElementRef = React.useRef<HTMLInputElement>(null)
- const [trigger, setTrigger] = React.useState<boolean>(false)
 
+ //this onWheel callback prevents numbers changing while scrolling
  const handleWheel = React.useCallback(() => {
  htmlInputElementRef.current?.blur()
- setTrigger((trigger) => !trigger)
+ setTimeout(() => {
+ htmlInputElementRef.current?.focus()
+ })
  }, [])
 
- React.useEffect(() => {
- htmlInputElementRef.current?.focus({ preventScroll: true })
- }, [trigger])
-
  return (
  <div className="cypress-number-element">
  <FormElementLabelContainer