bokuweb/react-rnd

BUG Drag improperly started on scroll or click w/modifier

twall opened this issue · 1 comments

twall commented

Overview of the problem

Drags are initiated by clicks in a content scroll thumb or on a click w/keyboard modifier.

I'm using react-rnd version 10.3.5

My browser is Chrome, Safari.

I am sure this issue is not a duplicate.

Description

The component should not start dragging in the following conditions (by default)

  • Scrolling primary content via scroll bar. A click on the scroll thumb will cause the window to be repositioned once the button is released.
  • Dragging should only be triggered by button 1 with no key modifiers. Right-click on OS X may be effected by holding the control key with button 1; this should not trigger a drag, but does.

Steps to Reproduce

a) Use content bigger than the rnd component so that a scrollbar is present. Scroll by clicking and dragging on the scroll thumb. When the button is released, the rnd component jumps position.
b) Hold down the control key and click on the component. On OS X, this brings up a context menu, select "Inspect Element". When the mouse/focus returns to the rnd window/view, the rnd component is still tracking an active drag.

Expected behavior

A click on a scrollbar thumb should not initiate a drag.
A click with a keyboard modifier should not initiate a drag.

Actual behavior

A click on a scrollbar thumb initiates a drag, with the rnd component jumping when the button is released.
A click with a keyboard modifier initiates a drag, with drag behavior varying depending on whether focus is changed.

I think this is related to: #712
Removing 'bounds' property works, but bounds is usually needed. Suggested fixes there may work but only on windows and it's not so maintainable if you have different components with different scroll bars.