atlassian / react-beautiful-dnd

Beautiful and accessible drag and drop for lists with React
https://react-beautiful-dnd.netlify.app
Other
33.4k stars 2.58k forks source link

No detection of dragging in virtual container if container is too wide #1655

Closed tariqporter closed 4 years ago

tariqporter commented 4 years ago

Expected behavior

Expect to be able to drag Draggables and have other Draggables react accordingly

Actual behavior

Allows to drag Draggable, but Droppable does not detect dragging behaviour and other Draggables will therefore not move

Steps to reproduce

Create a virtual table, and set the table to be arbitrarily wide. Dragging has no effect. Set the table to be slightly less wide and it will work correctly

What version of React are you using?

16.8.6 on codesandbox

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

12.1.1 on codesandbox

What browser are you using?

Chrome Version 78.0.3904.108 (Official Build) (64-bit)

Demo

https://codesandbox.io/s/clever-diffie-1qqtu

change line width={3000} to width={500} to have dragging working

Here is a demo with many columns also demonstrating the same problem

https://codesandbox.io/s/cocky-burnell-jh8dw

tariqporter commented 4 years ago

Is there any word on this or workaround? From the demos provided it seems like the library can't be used on a large screen width.

tariqporter commented 4 years ago

This issue has been resolved in version 12.2.0. In the 2 demos of the issue provided, simply change the version to the latest, and both will work 👍