polaris
polaris copied to clipboard
Listbox debounce not working
Summary
Hello,
I was looking at the Listbox
code and found that debounce
is not wrapped in useCallback
so it won't work because the reference will change at each render.
The problem has been introduce in this PR.
I am not sure if we want to keep the debounce and useCallback
it. Or just remove the debounce wrapping.
I am hyped to push a PR once I know the solution we want :)
Thanks in advance.
Expected behavior
The callback handleScrollIntoView
should be called once.
Actual behavior
We can see that the function is executed multiple time. In the video, I increased the debounced delay to 1_000 ms
Steps to reproduce
- Put a console log in the function
handleScrollIntoView
- I used the code of the example "With search" https://polaris.shopify.com/components/lists/listbox?example=listbox-with-search
- Trigger the execution of the function -> focus first item and trigger down button multiple times
- See that the log is displayed multiple times
Note: it's possible to increase the delay to be sure that we are fast enough
Are you using React components?
None
Polaris version number
12.15.0
Browser
No response
Device
No response