search

ethanselzer / react-cursor-position

A React component that decorates its children with mouse and touch coordinates relative to itself.
https://ethanselzer.github.io/react-cursor-position
MIT License
143 stars 35 forks source link

Incorrect position after mouse-wheel scroll #22

Closed aronhelser closed 6 years ago

aronhelser commented 6 years ago

I'm seeing some incorrect y-positions after I scroll using my mouse wheel - the cursor remains inside the component. If I scroll by dragging the scroll bar, it's correct.

ReactCursorPosition and the component it's wrapping are inside a divwith overfow-y: auto.

I'm happy to provide more detail if needed.

ethanselzer commented 6 years ago

@aronhelser - Thanks for opening this issue. I'm wondering if the incorrect y-position you are experiencing persists after moving the mouse or only before the mouse is moved. Please let me know.

aronhelser commented 6 years ago

It does persist after I move the mouse, but it's corrected if I exit the element and then re-enter. I'm guessing that something that happens during mouse-leave or mouse-enter needs to be triggered when the element is scrolled.

What I'm not sure about is if you can get scroll events for your element when it's just inside another element that's scrolled? (since that's what's happening here).

On Fri, Mar 16, 2018 at 12:57 AM, Ethan Selzer notifications@github.com wrote:

@aronhelser https://github.com/aronhelser - Thanks for opening this issue. I'm wondering if the incorrect y-position you are experiencing persists after moving the mouse or only before the mouse is moved. Please let me know.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/ethanselzer/react-cursor-position/issues/22#issuecomment-373603605, or mute the thread https://github.com/notifications/unsubscribe-auth/AS_pnXZL1oSALPa8EfGMFW2uhIWMvQZFks5te0YngaJpZM4SfN3a .

aronhelser commented 6 years ago

@ethanselzer I had a chance to illustrate the problem, thanks for providing a playground pen!

https://codepen.io/ahelser/pen/JvPwPR

If you mouse-wheel scroll, the position is reported as if it's unscrolled. But if you exit and re-enter, the position is corrected.

Looking though your very clean and modular code, I see that you don't listen to scroll events at all. Seems like that would be necessary to fix this problem?

ethanselzer commented 6 years ago

Hi @aronhelser - Thanks for creating a reduced test case. That is very helpful. I'm working on an improvement that may correct the issue you have identified. I will post here when it is released.

ethanselzer commented 6 years ago

Hi @aronhelser - The latest release of react-cursor-position introduces the reset method, which may correct the problem you identified in this issue. Please see the demo example for details. Thanks again for opening this issue. I appreciate it.

ethanselzer commented 6 years ago

@aronhelser - I'm closing this issue for now. If you find your use case is not corrected by v2.5.0, please reopen the issue. Thanks!

aronhelser commented 6 years ago

Thanks! Sorry I haven't been able to confirm - I should be able to test soon.

On Tue, Jul 24, 2018 at 3:32 PM Ethan Selzer notifications@github.com wrote:

@aronhelser https://github.com/aronhelser - I'm closing this issue for now. If you find your use case is not corrected by v2.5.0, please reopen the issue. Thanks!

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/ethanselzer/react-cursor-position/issues/22#issuecomment-407525205, or mute the thread https://github.com/notifications/unsubscribe-auth/AS_pnebmIcgE9Jt7B0xDtxPgvN2IHN6Iks5uJ3ZdgaJpZM4SfN3a .