Selecting does not work after calling .stop() and .start()

[dbougan]

Describe the bug
Hi @ThibaultJanBeyer, thank you for maintaining this great library! I recently created a prototype with v3 following the "Custom Drag and Drop" guided example. My use case is to implement a web file system with select/drag/drop functionality, so I need to handle drags outside of DragSelect. The issue is that once I resume DragSelect by calling .start(), I can no longer click/drag to select new items. I created a codepen with the following minor changes:

1. I subscribe to the 'DS:start:pre' event and call .stop() when dragging begins
2. I added an event listener for the 'mouseup' event, and call .start() when dragging has ended

To Reproduce
Steps to reproduce the behavior:

1. Visit the codepen below
2. Click on the white space and drag to select at least one item
3. Click on the selected item(s) and attempt to drag (the console will indicate that DragSelect has stopped)
4. Release the items (the console will indicate that DragSelect has started again)
5. Try to select new items again, however DragSelect no longer responds

Expected behavior
After dragging and releasing an item, I should be able to drag/select new items

Code Example
https://codepen.io/dbougan/pen/abProMo?editors=1111

Desktop (please complete the following information):

• OS: Windows 11
• Browser: Firefox 117.0.1 (64-bit)
• Version: DragSelect 3.0.3 (https://unpkg.com/[email protected]/dist/DragSelect.esm.js)

Additional context
I spent a little time studying the code and believe the issue is in the Interaction module and the isInteracting flag. It seems that when the Interaction.stop() method is triggered by DragSelect.stop(), it should explicitly set isInteracting = false. Because when DragSelect.start() is subsequently called and a new selection drag is attempted, the Interaction._start() method can never get past this code: if (!this._canInteract(event)) return; since isInteracting is still true from before DragSelect.stop() was called.

I tested the theory by adding line 173 in the screenshot below, which seems to have resolved the issue for me. However this is probably a naive approach, so I am hoping you can provide feedback. I'd be happy to submit a PR once we get to the root cause.

Thank you for your time!

[dbougan]

Hi @ThibaultJanBeyer, have you had a chance to read this one yet? I was hoping for your input before putting forward a PR since I don't understand the internals of DragSelect as well as you.

For what it's worth, I found a workaround. By calling the internal Interaction._reset(event) method immediately before stopping DragSelect, I can effectively set the isInteracting flag to false. However it doesn't feel like a good long-term solution. Thank you for your time!

[ThibaultJanBeyer]

Sorry I did not have the time yet, I'll try to make some time this or next week. In the long run I would love to have a very proper way to integrate 3rd party tools but that's a lot of work maybe we can find a quick fix like what you proposed. Thanks a lot so far for raising this, the workaround and your patience!!