Repository navigation
Copies are added after quickly dragging elements in the subgrid #2560
Description
If you quickly drag elements between nested blocks, duplicates of the same element appear.
Your environment
- Gridstack 10.0.0
- Chrome 119.0.6045.200/Windows 11
Steps to reproduce
-
We set up two nested grids as in the screenshot. Number of elements on the first level = 1.
-
Quickly drag the element “1” to the area outside the nested block. After several repetitions, the number of elements on the first level is already 19. And as you can see in the screenshot, id="1" is duplicated.
-
Reproduce on jsfiddle - https://jsfiddle.net/ironvd/54t6hnr1/60/
screencast-jsfiddle.net-2023.12.06-19_01_46.mp4
Expected behavior
The number of elements on the first level does not change after quick dragging
Activity
v1talii-dev commentedon Dec 7, 2023
I roughly figured out the cause of the bug: at the dragging stage, an engine method is called, which adds a pseudo node to draw the future place for insertion. If you quickly move the mouse, a situation arises when nodes are added to the engine that should not be there. When a pseudo element is deleted, another method restores the original nodes, and there are duplicates in the original nodes. That is, the reason is the false filling of the original nodes.
https://github.com/gridstack/gridstack.js/blob/master/src/gridstack.ts#L2038
v1talii-dev commentedon Dec 12, 2023
I think I managed to solve the problem. As you can see in pr, when quickly dragging,
nodedoes not appear:And I don’t delete
gridstackNodeso that the engine’saddNodemethod works correctly and the duplicate is detected correctly.nested grid fix gridstack#2560
Merge pull request #2600 from adumesny/master
Fix quickly drag elements between nested blocks (gridstack#2573)