Skip to content

[Teleport] TypeError: Cannot read properties of null (reading 'subTree') during Suspense resolve — regression in 3.5.32 #14701

@lichunju1

Description

@lichunju1

Vue version

3.5.32

Link to minimal reproduction

https://play.vuejs.org/#eNp9Uk1PAjEQ/SuTekAT042iF7KQqPGg8SvKsYlZdgco7LZN2wUM4b877bKAUbn1zXszffOxZjfG8EWNrMdSl1tpPDj0tRkIJSujrYdnXdQlwtjqCjo8aWBI6QiVJk0OqQl4rEyZeQzIpx+1M6hcgwhv6yQtbtVwMs7KcpTl88GTzgqpJpzzNPlZLDmodsCxc+ZdrtVYTvjMaUVdrIUCECzXlZEl2lfjpVZOsB5EJnD0nV4+xpi3NZ638XyK+fyP+MytQkywN4sO7QIF23E+sxP0DX3/8YIreu/IKrZ8lHxHp8s6eGxkt7UqyPaBLrp9iLug2Qzd/crTINqmgtGg3ES9YLSXuyOt7+12+VXME2pDU9xv9f9DWMMUNts7aNYvFM3eeQg/Qp8EFlWBtgenZ9AfwPS0U8hF5yx8IlS2zKSHi+NHQ/rBnVbUIe08gBgdYonRgtd9wUa6+BIMCumyUYlFe09h41pRIvSkI1kwRbLm3tKkrfHrgD4XaMM4qfEuv+bdS7b5BjnJDFw=

Steps to reproduce

  1. Open the reproduction link (Vue 3.5.32)
  2. Open browser console
  3. See TypeError: Cannot read properties of null (reading 'subTree') on page load
  4. Switch Vue version to 3.5.31 → error disappears

What is expected?

No error. The page renders correctly (works in 3.5.31).

What is actually happening?

Crash on page load:
Uncaught (in promise) TypeError: Cannot read properties of null (reading 'subTree') at move (runtime-dom.esm-browser.js:8744:28) at Object.moveTeleport [as move] (runtime-dom.esm-browser.js:3443:9) at move (runtime-dom.esm-browser.js:8752:12) at move (runtime-dom.esm-browser.js:8744:7) at move (runtime-dom.esm-browser.js:8758:9) at move (runtime-dom.esm-browser.js:8744:7) at Object.resolve (runtime-dom.esm-browser.js:9498:11)

System Info

...

Any additional comments?

Regression introduced by PR #14642.

Root cause: queuePendingMount() in Teleport.ts defers mount when parentSuspense.pendingBranch exists (including for disabled Teleports). During Suspense.resolve(), move(pendingBranch) runs before the deferred mount job. When moveTeleport encounters a disabled Teleport in REORDER mode, it iterates children — but children's vnode.component is null because mountChildren was never called.

PR #14642's test cases only covered element children (h('div', 'text')) inside Teleport. This bug requires component children (h(Comp)) inside a disabled Teleport, inside a Suspense-wrapped async component with a multi-root (Fragment) template.

Trigger conditions (all required):

  1. <Suspense> wrapping an async component (with await in setup)
  2. Multi-root template (Fragment) in the async component
  3. <Teleport disabled> as a root sibling
  4. Component child (not element) inside the Teleport
  • 3.5.30: No error
  • 3.5.31: No error
  • 3.5.32: Crash

I'd like to submit a fix PR for this.

Metadata

Metadata

Assignees

No one assigned

    Labels

    🔨 p3-minor-bugPriority 3: this fixes a bug, but is an edge case that only affects very specific usage.scope: teleport

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions