[4.0.0-rc.0] ion-reorder-group Reorder node not found

[jepiqueau]

Bug Report

Ionic version:

[x] 4.x

Current behavior:

Expected behavior:

Steps to reproduce:

Related code:

insert short code snippets here

Other information:

Ionic info:

insert the output from ionic info here

[jepiqueau]

Ionic version 4.0.0-rc.0
Stencil 0.16.1

Current Behavior: When using ion-reorder-group i got sometimes in the console "reorder node not found when i pressed the ion-reorder icon before moving it upward or downward. It is not happening consistently and the item is moved successfully even if this message appears on the console

Expected behavior: should not get this error message

looking in the code it is happening in the canStart(ev) function which is calling the findReorderItem(reorderEl, this.el);

function findReorderItem(node, container) {
    let nested = 0;
    let parent;
    while (node && nested < 6) {
        parent = node.parentNode;
        if (parent === container) {
            return node;
        }
        node = parent;
        nested++;
    }
    return undefined;
}

looking at parent and container, container has sometines the offsetParent pointing to the ion-list or to null which is not the case of the parent offsetParent property which is always pointing to the ion-list. I think, if you compare the outerHTML property it should remove the error

function findReorderItem(node, container) {
    let nested = 0;
    let parent;
    while (node && nested < 6) {
        parent = node.parentNode;
        if (parent.outerHTML === container.outerHTML) {
            return node;
        }
        node = parent;
        nested++;
    }
    return undefined;
}

[manucorporat]

@jepiqueau can you share your markup?

[jepiqueau]

@manucorporat sorry my english is not that good, what do you want me to share with you ? if it is priority it should be in next release as it is just annoying to get a message in the console, but as the move is working it is not as urgent.
This is not happening the first time you enter in a page where the ion-list and ion-reorder-group are rendered, you can add and reorder items without getting the message. It is happening when you come back in the page and start reordering when the app has not been refreshed. I cannot share the code as it is a large pwa app where i render news and images stored in Firebase that the user can reorder. If you need to have some code i would have to try to reproduce the error on a smaller code. please feel free to tell me. It happens once that it was not the offsetParent which was wrong but the classList for the parent the classList was "reorder-enabled hydrated reorder-list-active" and for the container the classList was "reorder-enabled hydrated"

[jepiqueau]

@manucorporat i made a simple application demonstrating the issue . Please follow the link and look at the " Steps to reproduce " in the readme file. https://github.com/jepiqueau/ionic4.0.0-rc.4-issue-16974.git

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.