Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

prevent scroll on va-number-input from updating value when input is focused #801

Closed
wants to merge 8 commits into from

Conversation

it-harrison
Copy link
Contributor

@it-harrison it-harrison commented Aug 17, 2023

Chromatic

https://1989-va-number-input-scroll-bug--60f9b557105290003b387cd5.chromatic.com


Description

This PR prevents the value on the component from incrementing when the user scrolls on the input while the input is in focus.

Closes 1989

Testing done

local testing in chrome, edge, safari, firefox

Screenshots

Screen.Recording.2023-08-17.at.12.47.42.PM.mov

Acceptance criteria

  • input value does not increment when input is focused and user scrolls on it

Definition of done

  • Documentation has been updated, if applicable
  • A link has been provided to the originating GitHub issue (or connected to it via ZenHub)

@it-harrison it-harrison added the patch Patch change in semantic versioning label Aug 17, 2023
@it-harrison it-harrison requested a review from a team as a code owner August 17, 2023 17:49
@it-harrison it-harrison changed the title prevent scroll on va-number-input from updating value when onblur prevent scroll on va-number-input from updating value when input is focused Aug 17, 2023
@@ -211,6 +219,7 @@ export class VaNumberInput {
required={required || null}
onInput={handleInput}
onBlur={handleBlur}
onWheel={handleWheel}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Did this more organic solution not work?

from <input type="number"> to <input type="text" inputmode="numeric" pattern="[0-9]*">

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
patch Patch change in semantic versioning
Projects
None yet
Development

Successfully merging this pull request may close these issues.

VaNumberInput: prevent scrolling and changing value when input is focused
2 participants