Issue with drag shadow

[mayank-ms088]

I have cloned the repo and run the landing example. And this is dragging the user components like in the video.
Can anyone help me to sort this out?
I want to use this library in my project.

OS: ubuntu 20.04 LTS

see the video

Screencast.from.12-06-21.08_32_56.AM.IST.mp4

[prevwong]

Can't reproduce on my machine, might be OS related perhaps. @ankri @matdru Any ideas? 🤔

[mayank-ms088]

YES I have checked it.

• It is Working Correctly on Mac OS.

• In Windows Drag shadow is not there but while dragging, the component is not at the cursor position. It is dragging from some other position. (SEE THE ATTACHED SS)

• In Linux As I have mentioned above, having an error with drag shadow.

[mayank-ms088]

Can anyone help me to sort this please?

[iojcde]

Having the same issue here.

I see no shadow for craft.js.org, but I can confirm that there is a shadow when I run it locally (even in production). I also running a Linux distribution (Arch btw). There is a white translucent background for every component when you drag them.

Really weird because craft.js.org should work exactly the same as when you run it locally in production..

[laofaKB]

Having same issue as @JcdeA

on ubuntu20.04,
https://craft.js.org/examples/basic/ works properly
run locally, chrome and firefox both have shadows when drag,
and on firefox further, the component is not at the cursor position

[ankri]

Sadly this is an issue with Chrome that has been open for 6 years now 😔

A suggested solution would be to not render the container which has width: 100% and height: 100% but render only the shadow itself.

Beware that in the next branch we have support for multi-select.

[zwg-zero]

change the container to

e.dataTransfer.setDragImage(shadow, 0, 0);

fix the problem on ubuntu20.4, not tested on other systems and not sure how much impact on other scenes.