Skip to content

Conditional children inside an optional Teleport (with disabled) doesn't work #11230

Open
@TotomInc

Description

@TotomInc

Vue version

3.4.30

Link to minimal reproduction

https://play.vuejs.org/#__PROD____SSR__eNqlVF1r2zAU/Su3HqMbNE5Kxx48t+yDPmywdWx5NAzHvnbVyJKQ5DQh5L/vSHbSDEJelrxYOveec+6R5W3yyZh01XOSJbmrrDCeHPvekCxVe1sk3hXJXaFEZ7T1tCXLDe2osbqjS7RdfihUoSqtnCfPkkPVXNNtqHvTq5obobh+i6qhRrgHw2rEm1I6Dlg+HaQhhIXnzsjSM1ZEeS1WVMnSuWBmVOB6Umk4Uqx8tEf45Yvee63IbwyjdlgVCX2spKiW2DloXwxP6Jxb0bZsqWPV59OhJZqIhPNRjjKvj9TnGqxZLVy5kFwDuDhGRjej89VENAdptO0nCYKYQfkS+dijLvSZu+9AERVpNKVpmk/NC+sUtPuJp3uHQ1QjlE+PEsTS+Y1kchXYauykp1KkbWDATOjbZNRIXuNcKD5MamG58kKrjCot+05F6FnU/jGj69nsNda7IHWaejyXqNCVthXgmeF//d6saRa5QKttRgtZVsu4scBDazXeoIxeNU1zXiH9N85B6v8ozEDiee0npRRtmB11bE/5BS9e4RAz8k2ucGlA1Ig2fXJa4WZFqiIJakKyfTAhTFysbBAJWCmlfv4W97zt+Wq/Xz1ytTyx/+TWYa9Iflp2bFdcJAfMI2TGxQjw/e8fGOEI7HTdS1SfAX+xwzEHj0PZZ2QI20d10e3X+E0Qqp27+7Vn5fZDBaOhchfriwTfiS9nRn+xe5O+i31IFCn+WbENnAgQQHozS3Z/ATS+lug=

Steps to reproduce

Click on the "Trigger menu" button

What is expected?

The menu should open when clicking on the button.

What is actually happening?

An error is thrown after clicking on the button. The menu isn't opened.

TypeError: Cannot read properties of null (reading 'nextSibling')
    at nextSibling (runtime-dom.esm-browser.prod.js:5:85798)
    at es (runtime-dom.esm-browser.prod.js:5:50509)
    at k (runtime-dom.esm-browser.prod.js:5:38480)
    at D (runtime-dom.esm-browser.prod.js:5:41025)
    at Object.process (runtime-dom.esm-browser.prod.js:5:60549)
    at k (runtime-dom.esm-browser.prod.js:5:38781)
    at D (runtime-dom.esm-browser.prod.js:5:41025)
    at $ (runtime-dom.esm-browser.prod.js:5:40411)
    at I (runtime-dom.esm-browser.prod.js:5:39377)
    at k (runtime-dom.esm-browser.prod.js:5:38728)

System Info

System:
    OS: macOS 14.5
    CPU: (8) arm64 Apple M1 Pro
    Memory: 95.19 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.14.0 - ~/.nvm/versions/node/v20.14.0/bin/node
    Yarn: 1.22.19 - ~/.yarn/bin/yarn
    npm: 10.7.0 - ~/.nvm/versions/node/v20.14.0/bin/npm
    pnpm: 8.15.1 - ~/Library/pnpm/pnpm
  Browsers:
    Brave Browser: 126.1.67.123
    Chrome: 126.0.6478.126
    Safari: 17.5
  npmPackages:
    vitepress: 1.2.3 => 1.2.3

Any additional comments?

I've first created an issue on VitePress thinking it was related to SSR: vuejs/vitepress#3987

It looks like <Teleport /> isn't supposed to work with non-existing targets, even when using :disabled.

However, there are no mentions of that anywhere in the official documentation.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions