Skip to content

[bug] container sentinel moves with last item after sort #2441

@jbruce-JHA

Description

@jbruce-JHA

When sorting list A.

A
...................
Apple
Banana
Cherry
"--container--"

B
..................
Cat
Dog
"--container--"

If I grab the second from the last item (Banana) and drag it to the last position (After Cherry), your "container" sentinel (I'm guessing) moves with the last item like below

Apple
Cherry
"--container--"
Banana

Now when I drag a new item from list B to the bottom of list A. the item is added above the contaner instead of being added to the end.

What I see:

Apple
Cherry
Cat
"--container--"
Banana

What I expect:

Apple
Cherry
Banana
Cat
"--container--"

It is my view that the container is incorrectly moving with the last item in the sort, then adding a new item via drag is inserting the drop in the incorrect location.

Versions
"sortablejs": "1.15.1",
"@types/sortablejs": "1.15.8",

Additional context

Adding this code to my 'onEnd' callback corrects the issue

    event.to.childNodes.forEach((value: ChildNode, key: number) => {

        // Find sentinel container
        if (value.nodeValue === "container") {

            // Remove sentinel container from current position and place it at the end.
            const container: ChildNode = event.to.removeChild(value);
            event.to.appendChild(container);
        }
    });

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions