ember-drag-drop
ember-drag-drop copied to clipboard
Need doc for using drag helper with sortable-objects
The README section for using the drag helper needs an example of using it with lists of {{#draggable-object}}
within {{#sortable-objects}}
. It isn't clear in this case what constitutes a valid drop target to supply for the await drag (draggable-selector, {drop: drop-target-selector})
- any draggable? - the container? if the latter, how do we specify which item we're dropping after? - or whether some other approach must be taken to perform the drop to reorder the list.
Yeah I should probably extend the docs. For now you should be able to get an idea of what to do from here -> https://github.com/mharris717/ember-drag-drop/blob/master/tests/integration/components/sortable-objects-test.js
Thanks - Using a few lines from that as a starting point, I've now got integration tests working on all browsers. With a few adjustments for it being a horizontal row of tabs, this was the needed piece:
let startDragSelector = '.my-container .my-button-drag:nth-child(1)',
dragOverSelector = '.my-container .my-button-drag:nth-child(2)';
const rect = find(dragOverSelector).getBoundingClientRect();
await drag(startDragSelector, {
drop: dragOverSelector,
dragOverMoves: [
[{ clientX: rect.left, clientY: rect.top }],
[{ clientX: rect.left + (rect.width / 2), clientY: rect.top + (rect.height / 2) }]
],
});