search

prevwong / craft.js

🚀 A React Framework for building extensible drag and drop page editors
https://craft.js.org
MIT License
7.59k stars 740 forks source link

Ghosting effect while dragging elements #340

Open mauretto78 opened 2 years ago

mauretto78 commented 2 years ago

Hi team,

and thank you for your work!

So sorry for bothering you...

I am struggling for days with a weird issue, maybe you can help me.

I developed a custom HTML builder for my new Wordpress plugin. Everything is working fine, except for this weird thing. I attach you a screenshot.

As you can see there is a strange "ghosting" effect while dragging an element.

This happens ONLY with Google Chrome (version 94.0.4606.61) on Ubuntu (version 18.04).

The official craftjs demos are not affected by this problem, so I guess the problem could be in the Wordpress admin panel.

I tried to remove all the css and js but nothing. When the dragover event is fired the "ghost" immediately appears.

Does anyone experience something similar? Anyone can help me?

Thanks in advance!

ghosting

hugominas commented 2 years ago

Hi, yap its happening to me on PopOS as well, only on Chrome, but chrome has its issues with Linux so I didn't follow up on this error.

On another note, you are implementing craft inside WP, well done :D I was tempted to do that in the begging, but maintaining WP and all its plugins is a pain :)

ankri commented 2 years ago

Can you please try the next branch? @prevwong published a temporary fix for this in #304

With this commit today the changes have made their way into the develop branch, but have not been released yet.

mauretto78 commented 2 years ago

Thanks both for reply!

@hugominas yep, I integrated craftjs into my new plugin, which is a SPA in React, it was easy, it worked like a charm. I am writing the documentation right now :) @ankri so sorry, I'll do that but how can I install a specific branch from yarn install?

ankri commented 2 years ago

yarn add @craftjs/core@next or you wait until the changes from today are released :)

Fyi: @next only works because there's a next release pointing to tag v0.2.0-alpha.28

yarn add package@any-branch would not work (without there beeing a release/tag named any-branch)

mauretto78 commented 2 years ago

@ankri YESS!!!!!!!!! It worked like a charm!!

THANK YOU!!!!!

By the way, I had to change some logic in my code, because:

state.events.selected

Now returns a Set and not the id of currentNode.

Thank you so much!