React-beautiful-dnd: Cursor not on the right position when dragging an item.

[KhaldiAmer]

Expected behavior

The cursor is on the element being dragged.

Actual behavior

The cursor is away from the element which makes it hard sometimes to drag to the wanted position.

Steps to reproduce

1- Resize draggable elements when onBeforeCapture is triggered.
2- Drag second element to the last element and notice the cursor position while dragging.

Suggested solution?

None for now.

What version of React are you using?

16.11

What version of react-beautiful-dnd are you running?

12.2

What browser are you using?

Version 79.0.3945.130 (64 bits)

Demo

https://codesandbox.io/s/vertical-list-kgs03?fontsize=14&hidenavigation=1&theme=dark

[alexvcasillas]

Hey there, I believe onBeforeCapture should be asynchronous (should accept a done callback) to support asynchronous evaluations on components

[holmberd]

@alexvcasillas true, not much time to do anything worthwhile. Alternatively if there was a way to set custom dimensions on drag to avoid placing a callback in the critical path.

Reference:

https://github.com/atlassian/react-beautiful-dnd/blob/c8c86601b3666b8236ff46d56daeedaf9c41e566/src/state/middleware/responders/publisher.js#L89-L105

https://github.com/atlassian/react-beautiful-dnd/blob/c8c86601b3666b8236ff46d56daeedaf9c41e566/src/state/middleware/responders/responders-middleware.js#L26-L36

https://github.com/atlassian/react-beautiful-dnd/blob/c8c86601b3666b8236ff46d56daeedaf9c41e566/src/state/middleware/lift.js#L38-L55