Ember-Drag-Sort: Usage of "handle" selector results in dragEnd params being passed undefined

Question

Whenever I assign a class selector to the "handle" selector and drag, all the params being passed to the DragEndAction are undefined my code below

    = drag-sort-list [
                items=sortedSections
                group='sections'
                dragEndAction=(action 'dragEnd')
                handle=".drag-handle"
            ] as | item |

handle code :

        i.material-icons.drag-handle draggable="true"
          | drag_indicator

which results in this error: console_error *note I am using emblem template syntax

for additional context, heres what my dragEnd action looks like:

        dragEnd({ sourceList, sourceIndex, targetList, targetIndex }) {
          console.log(sourceList, sourceIndex, targetList, targetIndex);
          if (sourceList === targetList && sourceIndex === targetIndex) return;

          const item = sourceList.objectAt(sourceIndex)
          sourceList.removeAt(sourceIndex); 
          targetList.insertAt(targetIndex, item)

everything works when i take the handle selector off, unsure whats going on.

Answer 1

Here's how it's supposed to work:

{{#drag-sort-list
  items         = items
  handle        = ".handle"
  dragEndAction = (action 'dragEnd')
  as |item|
}}
  <span class="handle" draggable=true>
    [handle]
  </span>

  {{item.name}}
{{/drag-sort-list}}

Working demo.

I've checked with the code, the handle parameter is not involved with invoking the action at all, and there's no way the action can be invoked with every argument as undefined.

My bet is that you've messed up with Emblem and provided an extra argument to the action, e. g. (action 'dragEnd' 'foo') instead of (action 'dragEnd').

You can check if that's the case via console.log(arguments) in your action. Normally arguments should contain a single item which is a hash.

If this doesn't help, please provide a reproduction demo of your problem and I'll update my answer.

After you update your question, make sure to reply with a comment to my answer, so that I get notified.