behaviors icon indicating copy to clipboard operation
behaviors copied to clipboard

Focus Zone, ArrowVertical does not take into account input elements that have step defined

Open 1951FDG opened this issue 2 years ago • 10 comments

For ArrowVertical does not take into account input elements of type "number" that have step defined, meaning it overrides the default behaviour making stepping with up and down key no longer working.

I think this can be fixable by adding some code to: https://github.com/primer/behaviors/blob/92e06b516eb3751bcf864c3678fd2722df885f4f/src/focus-zone.ts#L261

1951FDG avatar Dec 14 '23 20:12 1951FDG

Hi!

Thanks for taking the time to report this, do you mind creating adding a reproduction of the issue on codesandbox.io or stackblitz.com?

siddharthkp avatar Dec 15 '23 14:12 siddharthkp

Hi!

I hope this helps, since I don't have either

https://jsfiddle.net/2j6nr01x/

1951FDG avatar Dec 15 '23 17:12 1951FDG

So to have stepping of the number input working again with up and down arrow key, remove FocusKeys.ArrowVertical

1951FDG avatar Dec 16 '23 10:12 1951FDG

@camertron is going to take a quick look to see if we can validate this bug by looking at the test suite and we can go from there.

lesliecdubs avatar Dec 18 '23 22:12 lesliecdubs

Hey @1951FDG, I'm not sure what you mean by "remove FocusKeys.ArrowVertical." However I think you were correct to identify shouldIgnoreFocusHandling as the place to make the change. Can you try adding the following code to the end of that function?

if (activeElement instanceof HTMLInputElement && activeElement.type === 'number') {
  return true
}

camertron avatar Dec 18 '23 23:12 camertron

Hey @camertron, cool, I'll look into this as soon as I'm back next year, and maybe submit a pull request for it to be reviewed.

1951FDG avatar Dec 19 '23 14:12 1951FDG

Hi all! 👋 Just wanted to check-in to see if this issue is still relevant and close it, if not 👀

joshblack avatar Mar 26 '24 19:03 joshblack

Hi there, if I make the necessary changes, and submit a pull-request, will it be merged, or are these changes to be made on a per use case.

1951FDG avatar Mar 27 '24 15:03 1951FDG

PRs are always welcome, provided there is a motivating use case and the code is clean and well tested 👍

keithamus avatar Mar 27 '24 17:03 keithamus

Hi! This issue has been marked as stale because it has been open with no activity for 180 days. You can comment on the issue or remove the stale label to keep it open. If you do nothing, this issue will be closed in 7 days.

github-actions[bot] avatar Sep 23 '24 18:09 github-actions[bot]