Store sets DOM elements to `undefined` on its own after they have changed

[piscopancer]

Objective

Storing DOM element in a ref in a store to access it via .current anywhere

Error case

If DOM element cohabits with other values in store

export const selectedWordsStore = store({
  words: [] as SelectedWord[],
  buttonRef: createRef() as RefObject<HTMLButtonElement>, // this will be set to undefined by store whenever changed to any value
})

Current workaround

If DOM element exists in a separate store alone. Having it so does not cause unwanted purge

export const lastWordSelectorStore = store({
  ref: createRef() as RefObject<HTMLButtonElement>,
})

export const selectedWordsStore = store({
  words: [] as SelectedWord[],
})

Possible reason

Assuming it only happens to DOM elements while any else data types cohabit nicely, there must be some peculiarities of DOM elements that cause this issue