SortableJS with Ionic

Ionic Framework
#1

Has anyone used SortableJS (or its Vue incarnation Vue.draggable) with Ionic? It’s working nicely in Chrome but on an iOS device I’m experiencing two issues:

  1. If the page has been scrolled, the vertical location of dragged items is off (I believe by the amount the page has been scrolled by).
  2. Dragging an item to the top of bottom of the viewport doesn’t scroll the page as it should.
#2

Hello, I am using this

<draggable ...>
    <template #item="{element}">
        <div :ref="(el) => enableAutoscrollOnMove(el)">
           ...
        </div>
    </template>
</draggable>

    const scrollOffset = 10;
    const scrollMargin = 60;

    const enableAutoscrollOnMove = (el) => {
      if (!el) {
        return;
      }

      const draggableGesture = createGesture({
        el: el.$el,
        threshold: 0,
        onMove: async (ev) => {
          const draggingEl = document.getElementsByClassName('sortable-drag')[0];
          if (!draggingEl) {
            return;
          }

          const posFingerY = ev.currentY;

          const content = el.$el.closest('ion-content');
          const scrollEl = await content.getScrollElement();

          const {
            top: scrollElTop,
            bottom: scrollElBottom,
          } = scrollEl.getBoundingClientRect();

          let amount = 0;

          if (posFingerY < scrollElTop + scrollMargin) {
            amount = -scrollOffset;
          }
          else if (posFingerY > scrollElBottom - scrollMargin) {
            amount = scrollOffset;
          }

          if (amount !== 0) {
            scrollEl.scrollBy(0, amount);
          }

          const makeMatrix = (x, y) => `matrix(1, 0, 0, 1, ${x}, ${y})`;

          draggingEl.style.transform = makeMatrix(
              ev.currentX - ev.startX,
              ev.currentY - ev.startY + scrollEl.scrollTop
          );
        },
      });

      draggableGesture.enable(true);
    }