GrapesJS / GrapesJS/grapesjs

BUG: Cross-level reordering of blocks in Layer Manager causes Sorter errors and breaks further move attempts

Open
#6,669 2 comments 2 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
26.2k
Forks
4.6k
Avg merge
2d 21h
Merged PRs (30d)
6

Description

### GrapesJS version

- [x] I confirm to use the latest version of GrapesJS

### What browser are you using?

Chrome

### Reproducible demo link

https://grapesjs.com/demo.html

### Describe the bug

**How to reproduce the bug?**
1. Start from a fresh editor instance with an empty canvas
2. From the Blocks panel, drag a **"1 Column"** block into the canvas.
3. From the Blocks panel, drag a **"Text"** block into the canvas.
4. **In the Layer Manager**, perform the following moves in order:
- Move the Text block **inside** the 1 Column block.
- Move the Text block **outside and below** the 1 Column block (same hierarchy level, just below it).
- Move the 1 Column block **below** the Text block.
- Try to move the Text block **below** the 1 Column block again.

**What is the expected behavior?**
All drag & drop operations should be performed correctly and without errors.

**What is the current behavior?**
In the last repro step the element doesn't move from its position.

Inspecting the DevTools console, two errors appear: the first when the drag operation starts and the second when the user releases the mouse button.

Image

The Layer Manager enters into an inconsistent state and, since that moment, any other attempt to move the text block will fail with multiple errors in console.

**Note:**
_Performing the same steps directly inside the canvas is also affected, in a different way: in this case a duplicate Text element appears when performing the last repro step._

### Code of Conduct

- [x] I agree to follow this project's Code of Conduct

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.