SortableJS/Sortable

[bug] Can't cancel swap once an item has been hovered over

Open

#1,866 opened on Jul 15, 2020

View on GitHub
 (13 comments) (5 reactions) (0 assignees)JavaScript (30,389 stars) (3,731 forks)batch import
Swapenhancementgood first issue

Description

Describe the bug

When using the Swap plugin, it's impossible to cancel a swap once the swap threshold has been met for an item. You can't drag the item back to its original place to prevent a swap. This happens with or without the revertOnSpill: true option.

To Reproduce Steps to reproduce the behavior:

  1. Go to https://sortablejs.github.io/Sortable/#swap
  2. Drag "Item 1" to hover over "Item 2", triggering Item 2 to get highlighted. Don't drop "Item 1", but instead try to prevent a swap by moving Item 1 back to its original place.
  3. See: It's not possible to prevent a swap.

Expected behavior

Dragging Item 1 back to its original place, or off of the list, should deactivate the swap.

Information

Sortable.version == 1.10.2

I didn't include a code sandbox since it's visible with Sortable.js's own Github site.

Thank you so much for your work on this library!

Contributor guide

Tech stack
javascript
Domain
frontend
Issue type
bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
Basic understanding of Sortable.js swap plugin
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
70
Research direction
Investigate the Swap plugin's event handling in the Sortable.js codebase. The issue is that once the swap threshold is met, the swap cannot be undone. Look at the `onDrag` or `onMove` callbacks in the plugin's source code, likely in `plugins/Swap.js`. Check if there is a condition that prevents reverting when `revertOnSpill` is true. The fix might involve allowing a cancellation of the swap when the dragged item returns to its original position or leaves the list.
[bug] Can't cancel swap once an item has been hovered over · SortableJS/Sortable#1866 | Good First Issue