motiondivision / motiondivision/motion
[BUG] `Reorder.Item` gets a random offset if it's scaled during whileDrag
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 33.7k
- Forks
- 1.4k
- Avg merge
- 1d 10h
- Merged PRs (30d)
- 14
Description
Describe the bug
In my app I have a table where you can reorder items and while you drag them around, they are slightly scaled. However on some drag events a negative translateX is applied to the Reorder Item, that should not be there. I created a minimal reproducible example in Codesandbox where the issue seems very small (max. 1px) but in my original code the offset sometimes incrementally increases over 100px (≈10px at a time).
Provide a CodeSandbox reproduction of the bug
https://codesandbox.io/s/red-frog-7ol68d
Steps to reproduce
- Open the codesandbox link in a Chromium based browser
- Reorder one item a couple of times
- See that the reordered item is not aligned with the other ones.
Expected behavior
Item should be aligned with items that were not reordered.
Screenshot
Environment details
mac OS, Google Chrome 107
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the linked CodeSandbox reproduction in Chromium and inspect Reorder.Item behavior when scaled during whileDrag. Reorder the item repeatedly and compare its transform and alignment with untouched items. Done means the reordered item remains aligned and no unexpected negative translateX accumulates.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100