SolidJS•15mo ago

document is not defined in HMR

I have some logic that is running in onMount and onCleanup that adds/removes a data-attribute from an element. It works. However when I make a change somewhere in my project, I get document is not defined error from HMR. It seems to be triggered by cleanNode so I am pretty sure it's from the onCleanup. The code itself looks like this shouldn't happen though because I use optional chaining. Any ideas?

onMount(() => {
  const outlet = document?.getElementById('main-outlet')
  outlet && (outlet.dataset.actionbar = 'true')
})

onCleanup(() => {
  const outlet = document?.getElementById('main-outlet')
  outlet?.dataset.actionbar && delete outlet.dataset.actionbar
})

onMount(() => {
  const outlet = document?.getElementById('main-outlet')
  outlet && (outlet.dataset.actionbar = 'true')
})

onCleanup(() => {
  const outlet = document?.getElementById('main-outlet')
  outlet?.dataset.actionbar && delete outlet.dataset.actionbar
})

Thank you 🙂

2 Replies

Martnart•15mo ago

Could this be a bug? Looking at the code I would never expect to get this error. If I change it to this it works

onCleanup(() => {
  const outlet = globalThis?.document?.getElementById('main-outlet')
  outlet?.dataset.actionbar && delete outlet.dataset.actionbar
})

onCleanup(() => {
  const outlet = globalThis?.document?.getElementById('main-outlet')
  outlet?.dataset.actionbar && delete outlet.dataset.actionbar
})

lxsmnsyc•15mo ago

Not a bug. There's just no document on the server. I would recommend moving your onCleanup inside onMount

Gaming

Programming

document is not defined in HMR