Skip to content

History ResizeObserver is not propery disconnected #569

Open
@theSilverFisch

Description

@theSilverFisch

It seems that whenever I unmount the component which contains vue-command with some history entries, I'll receive a console error stating that

Uncaught TypeError: Cannot read properties of null (reading 'scrollHeight') VueCommand.vue:525 

For what I understand this is due to what happens in the mounted hook

  // Scroll to bottom if history changes
  const resizeObsever = new ResizeObserver(() => {
    // TODO: Only scroll to bottom if user scrolled to bottom before
    vueCommandHistoryRef.value.scrollTop = vueCommandHistoryRef.value.scrollHeight <---- the line which throws the error
  })
  for (const vueCommandHistoryEntry of vueCommandHistoryRef.value.children) {
    resizeObsever.observe(vueCommandHistoryEntry)
  }
  // If history changes, unobserve all history entries and observe again
  watch(local.history, async () => {
    await nextTick()

    resizeObsever.disconnect()
    for (const vueCommandHistoryEntry of vueCommandHistoryRef.value.children) {
      resizeObsever.observe(vueCommandHistoryEntry)
    }
  })

As there is no unmounted hook in the component provided I assume that the resizeObsever is resubscribed after nextTick no matter if the component is still in the dom, and therefor vueCommandHistoryRef still available.

Am I missing something or is this a bug?

Regards

Christian

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions