Ionic beta.16 reorder list throws error. Using Ionic 4 with VueJs

[stripathix]

Bug Report

Ionic Info
Run ionic info from a terminal/cmd prompt and paste the output below.

Beta.16

Describe the Bug
Sometimes I get this error:

reorder node not found
ReorderGroup.canStart | @ | ej7i9is4.entry.js?db64:107
-- | -- | --
  | canStart | @ | ej7i9is4.entry.js?db64:82
  | pointerDown | @ | gesture.js?a52d:246
  | handleMouseDown | @ | gesture.js?a52d:69

And on doing drag/drop I get this

Uncaught TypeError: reorderGroup.complete is not a function
    at VueComponent.reorderedsss (RouteForm.js?e195:218)
    at invoker (vue.runtime.esm.js?2b0e:2023)
    at HTMLElement.fn._withTask.fn._withTask (vue.runtime.esm.js?2b0e:1822)
    at Object.Hn (ionic.core.js?1390:6)
    at Object.t.emit [as vn] (ionic.core.js?1390:6)
    at Object.emit (ionic.core.js?1390:6)
    at ReorderGroup.onEnd (ej7i9is4.entry.js?db64:201)
    at onEnd (ej7i9is4.entry.js?db64:85)
    at pointerUp (gesture.js?a52d:332)
    at HTMLDocument.handleMouseUp (gesture.js?a52d:88)

Steps to Reproduce
I have ion-reorder-group list in modal.

Related Code
In HTML

<ion-list>
      <ion-reorder-group @ionItemReorder="reorderedEvent" disabled="false">
      <ion-item>
        <ion-label>
          Item 1
        </ion-label>
        <ion-reorder slot="end"></ion-reorder>
      </ion-item>

      <ion-item>
        <ion-label>
          Item 2 (default ion-reorder slot="start")
        </ion-label>
        <ion-reorder slot="start"></ion-reorder>
      </ion-item>
    </ion-reorder-group>
  </ion-list>

In VueJs component I have method.

reorderedEvent(detail) {
            const reorderGroup = document.querySelector("ion-reorder-group");
            reorderGroup.complete();
        },

I have tried both .complete() with ion-reorder-group element selector and even (detail) parameter but for both I get

RouteForm.js?e195:218 Uncaught TypeError: reorderGroup.complete is not a function
    at VueComponent.reorderedsss (RouteForm.js?e195:218)
    at invoker (vue.runtime.esm.js?2b0e:2023)
    at HTMLElement.fn._withTask.fn._withTask (vue.runtime.esm.js?2b0e:1822)
    at Object.Hn (ionic.core.js?1390:6)
    at Object.t.emit [as vn] (ionic.core.js?1390:6)
    at Object.emit (ionic.core.js?1390:6)
    at ReorderGroup.onEnd (ej7i9is4.entry.js?db64:201)
    at onEnd (ej7i9is4.entry.js?db64:85)
    at pointerUp (gesture.js?a52d:332)
    at HTMLDocument.handleMouseUp (gesture.js?a52d:88)

Expected Behavior
A clear and concise description of what you expected to happen.

Additional Context
List any other information that is relevant to your issue. Stack traces, related issues, suggestions on how to fix, Stack Overflow links, forum links, screenshots, OS if applicable, etc.

[stripathix]

Hi @manucorporat, Please could look into this if I am doing anything wrong or ionic have a bug related to reorder list?
I am using reorder list in modal.

[manucorporat]

can you debug it further? what is detail? it might be the event itself

[high1]

This issue is not exclusive to Vue, same thing happens on @ionic/angular. Reorder node not found and list is frozen. Calling complete on ev.detail.complete() does not work. Same behaviour can be seen on the sample reorder page on beta documentation site.