`_sortablejs.AutoScroll is not a constructor`

[aried3r]

Reproduction

Scenario

https://codesandbox.io/s/dry-cloud-co2q9

Describe the bug

Plugins are missing from the default export. Some of the examples in the README do not work. I've seen https://github.com/SortableJS/sortablejs/issues/1929 and https://github.com/SortableJS/sortablejs/issues/1891 but none of them mention the plugins.

Expected behavior

I believe plugins should be available from the default export like described in the README. At the same time, using sortablejs/modular/sortable.core.esm.js as the import, makes TypeScript complain, however I don't exactly know how to make @types/sortablejs recognize this import as well. The error says to amend the types, but I don't know how, but I'm open to sending a PR their way. :)

Version

package	version
sortablejs	^1.12.0
@types/sortablejs	^1.10.6

[trullock]

Also got this issue, anyone got any ideas?

[aried3r]

@trullock, I forgot in which issue I found the information, but all the plugins are added by default in the latest version so you don't need to manually create an instance.

[trullock]

ok Great thanks, still can't get it to work though :( as you point out, the examples dont work either

[aried3r]

We've got it working with AutoScroll, MultiDrag and OnSpill, but haven't finished out implementation yet. Depending on what your issue is, this GitHub issue might not be the right place to ask.

I'd suggest by creating a codesandbox, jsfiddle or similar demonstrating your problem.

[trullock]

So it does work, now I understand what the default browser scroll is doing vs fallback mode.

To make Chrome scroll you need to be within a few px of the edge and then it scrolls really showly.

Quite shit.

[garrettlancaster]

Having the same issue - it's insanely finicky about whether it scrolls or not (even after increasing scrollSensitivity). Also often very slow scrolling even with scrollSpeed bumped. @trullock did you ever have any luck?

[trullock]

IIRC scrollSensitivity and related settings only apply to fallback mode

[ffxsam]

I'm confused as to why the AutoScroll plugin doesn't work as documented. The docs say:

import { Sortable, AutoScroll } from 'sortablejs';

Sortable.mount(new AutoScroll());

But I had to instead do:

import Sortable, { MultiDrag } from 'sortablejs';
import { AutoScroll } from 'sortablejs/modular/sortable.core.esm';

Sortable.mount(new MultiDrag());
Sortable.mount(new AutoScroll());

But this yields the error: sortable.esm.js?aa47:823 Uncaught Sortable: Cannot mount plugin scroll more than once

Ok, so I suppose auto scroll is mounted by default. But that doesn't seem to be the case, because auto scroll doesn't work at all.

This is my call to init Sortable:

      this.sortable = new Sortable(this.$refs.mediaList.$el, {
        animation: 150,
        bubbleScroll: true,
        // @ts-ignore
        forceAutoscrollFallback: true,
        ghostClass: 'v-hidden',
        handle: '.drag-handle.medium',
        multiDrag: true,
        scroll: true,
        scrollFn: () => {
          console.log('hello?');
        },
        scrollSensitivity: 100,
        selectedClass: 'selected-medium',
        onUpdate: this.reorder,
      });

[adobs]

also facing this same issue.

When I have forceFallback: false, then I can drag and drop but NOT scroll. When I have forceFallback: true, then I can drag and scroll but NOT drop.

Sortable.create(cells, {
      animation: 150,
      ghostClass: 'ghost-style',
      forceFallback: false,
      scroll: true,
      // @ts-ignore
      forceAutoscrollFallback: true,
      bubbleScroll: true,
      scrollSensitivity: 100,
      fallbackTolerance: 10,
    });