Subscribe on changes!

SSR hydration error when using dynamic slots inside a render function component

avatar
Jan 31st 2023

Vue version

3.2.45

Link to minimal reproduction

https://sfc.vuejs.org/#__SSR__eNqtVUtvnDAQ/itTegAkFlT1tmXTVlEq5ZpEvYQcHNYsTsBGtmE3WvHfO+axGHbTh1ROzMPz+Dzz+eh8r6qwqamzdmKVSlZpUFTX1VXCWVkJqeEIkmbQQiZFCS66ul9OtjvKt1TeHCrCFRP8VtNy8AujmTZ8UdaxvzkwJAJIeCq4wrIKoRVs4NHNKcGsbgDulmakLrT7hJ6jX6l26IU1e+79/R3kb1tJNEYFKqWQsH3jpGRpH871Ex5Hfd/YMQqYuiqIpigBxPmnq+Oxi9i2cYQS+ujYgAP4PeRMYSIDAWQ1T7ssqcAeOeUadqyhaplfrbvAURcDY11AsIuOprEUaFaZkJvE8UzNQVf5LZ46+MB430fiwPqVvqHPyYiqj49Gehqqxaxb1pwEAOzM2LG1k0M0ecTRHIrovUotOCiYa4OGSEYQgD0rihGfPdO5qDXCIbc2HBYaEJ8HR+V/h+EMiEtQ/AGMZaWWgxM4/ZivSlLh3AuOu3Xs7nQwYJ1r6DRGh4gZOXFyrSu1jiKVpQbGFxUKuYvwL5Q116ykIVXl6lmKvaISAydOYMWIUNlQuerxpvJ3MReuZ3FNWESixVaWW4y9RBH8xFv+PGw//BhH/+ZAEANqMUceAK4o4/R63IrAbGYAJZGvd2S/pJWE00N3dFjs0c8zFS0ieQOCHV15lRSVCjBlTxOtPwIMuJGGFkRF+cALGSkU9bt0vYfEEJKD58PmCh6nEcg9F2cAicbSvafFQkzmsCcnzx/uZjo0lwHc51prwd2FIw7jUgEg+HXB0lcs8IIRzdhb2JACb2UDHyap48/5156lO9e4D2K3K6g71887epqLVgVfJ4B6RIa79Hwf1sDrorBOWmEMh0/1tMjM5orORnB4q+b7aG2qvdpxt9TI93QzPhrRZOzxh2+pgRY5YwA5cSxq6JGY+LE/c2KFeV5kKJaZQAiGFcWuYnywxjKmEOPfjGpQ/IdHeXorLw27sZ5eqcVAvTdAyAHWA+m0vwBL6pYJ

Steps to reproduce

Open reproduction and see the error.

What is expected?

No hydration errors when using a render function component.

What is actually happening?

Hydration error

System Info

No response

Any additional comments?

Ran into this with a Quasar component, which are all render function components. Took ages to get it down to this minimal reproduction. It is quite a niche use case but it is one I am using inside my work project :)

avatar
Feb 1st 2023

duplicate of #7095