clauderic / clauderic/dnd-kit

Vue multiple list example throws StructuredClone errors

Open
#1,931 2 comments 1 reaction 0 assignees View on GitHub
bug triage:done vue
Dominant language
TypeScript
Stars
17.6k
Forks
924
Avg merge
2d 10h
Merged PRs (30d)
2

Description

Applicable [here](https://experimental--5fc05e08a4a65d0021ae0bf2.chromatic.com/?path=/story/vue_sortable-multiple-lists--basic-setup)

To trigger the error, reorder item A1 to column B and move it back to column A, as soon as the second drag starts the error gets triggered

Making the `items` a `shallowRef` instead of a `ref` works

Image

Contributor guide

Open the contributing guide

Research direction

Start with the linked Vue Storybook example and reproduce the error by moving item A1 to column B and back to column A. Compare the behavior when items uses ref versus shallowRef, then trace the StructuredClone failure during the second drag. Done means the sequence completes without the error while preserving multi-list dragging.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.