Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

SSR problem with empty text node in render function #7215

Closed
skirtles-code opened this issue Nov 26, 2022 · 4 comments · Fixed by #7216
Closed

SSR problem with empty text node in render function #7215

skirtles-code opened this issue Nov 26, 2022 · 4 comments · Fixed by #7216
Labels
🔨 p3-minor-bug Priority 3: this fixes a bug, but is an edge case that only affects very specific usage. 🐞 bug Something isn't working scope: ssr

Comments

@skirtles-code
Copy link
Contributor

skirtles-code commented Nov 26, 2022

Vue version

3.2.45

Link to minimal reproduction

https://sfc.vuejs.org/#__SSR__eNp9UdtqwzAM/RXNL04gTd5DWxj7jHmMNFXWtPEF2ekKJf8+OZe226BgbF2OzpHkq3h1Lj/3KEqx9jW1LmyVabWzFOAKhwwIGxigIatBMk4qowxexvwem6rvGKcMgMfQu+Qz4yrf2eBhSKcEQG2NDxDwEmAT+RIp00gTc8RlZCBJYbNd8Lfo++IDHBK560OwRrLCPQxgzVvX1qdypogq+bnqemQteap21uoXbnqBDxnIsQA0yjT7JeCY+0ESHsju0Q9ufbYmY4gPX3zWxW2FIhPTFle6cvnRW8MbHhtXc8IrUS6jKMGrjb4ShxCcL4vCN3X8l6PPLX0VbOXUm9BqzNHr1Y7st0diYiXmIUaOgoNnpBWh2SMhPeP8A/3Hu8wlhh/WeawK

Steps to reproduce

Click the button in the Playground example above. Note the console error. The UI also does not update to show the new text.

What is expected?

No error.

What is actually happening?

Uncaught (in promise) TypeError: Cannot set properties of null (setting 'nodeValue')
    at setText (runtime-dom.esm-browser.js:9332:24)
    at processText (runtime-dom.esm-browser.js:6536:17)
    at patch (runtime-dom.esm-browser.js:6491:17)
    at patchKeyedChildren (runtime-dom.esm-browser.js:7274:17)
    at patchChildren (runtime-dom.esm-browser.js:7217:21)
    at patchElement (runtime-dom.esm-browser.js:6731:13)
    at processElement (runtime-dom.esm-browser.js:6592:13)
    at patch (runtime-dom.esm-browser.js:6509:21)
    at patchKeyedChildren (runtime-dom.esm-browser.js:7274:17)
    at patchChildren (runtime-dom.esm-browser.js:7217:21)

Any additional comments?

If you turn off SSR mode in the Playground then everything works fine.

The text node must be empty initially to hit the problem. Any other content seems to be enough to make it work.

I'd imagine there's a problem with the hydration process and the text node not being created for the empty string. However, there isn't a hydration warning, it only fails when trying to change the text.

I wasn't able to reproduce the problem using a template. Both {{ text }} and v-text="text" seemed to work fine.

While h('p', [text.value]) fails, similar attempts such as h('p', text.value) and h('p', [text.value, h('span')]) work fine.

@edison1105 edison1105 added 🐞 bug Something isn't working scope: ssr labels Nov 26, 2022
@haoqunjiang haoqunjiang added the 🔨 p3-minor-bug Priority 3: this fixes a bug, but is an edge case that only affects very specific usage. label Mar 27, 2023
@fungaren
Copy link

Hi, is this bug fixed now?

@fxzer
Copy link

fxzer commented Oct 27, 2023

Is it solved ? I'm having the same issue

@paro-paro
Copy link

paro-paro commented Jan 11, 2024

Are there any plans on fixing this?

This is still happening on 3.4.10 and is heavily affecting when using vuetify components.

Related vuetify issue

@github-actions github-actions bot locked and limited conversation to collaborators Jun 11, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
🔨 p3-minor-bug Priority 3: this fixes a bug, but is an edge case that only affects very specific usage. 🐞 bug Something isn't working scope: ssr
Projects
None yet
Development

Successfully merging a pull request may close this issue.

7 participants