[bug] Sortable applied on a css display: contents container behave erratically in certain scenarios
#1.853 aberto em 16 de jun. de 2020
Métricas do repositório
- Stars
- (30.389 stars)
- Métricas de merge de PR
- (Nenhuma PRs mesclada em 30d)
Description
If you use sortable on a display: contents inside a display: grid and the rows are incomplete, moving from the first half of a top row will place the element at the end of the grid.
To Reproduce Steps to reproduce the behavior:
- Go to https://codepen.io/cronco/pen/KKVzVLg
- Drag the first element to the right.
- After dragging over the 3rd element you should see it replacing it.
- Actually see the element get positioned at the end of the
Expected behavior
The first element should be placed as the third element, but instead it is the last one.
Information
Manually setting direction: horizontal OR applying the sortable directly to the display: grid container and skipping the display: contents intermediary element seems to fix it (that is not an option for my use case). My intuition is that the direction setting algorithm is somehow confused by the behaviour of display: contents.
This is a highly specific bug, so I understand if it gets marked as won't fix.
Versions - Look in your package.json for this information:
sortablejs = ^1.10.2
@types/sortablejs = ^x.x.x
Additional context Add any other context about the problem here.
Reproduction codesandbox: https://codepen.io/cronco/pen/KKVzVLg