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

Strange comments in SSR renderer output and hydration mismatch warning #7011

Closed
Alexis2004 opened this issue Nov 2, 2022 · 2 comments
Closed

Comments

@Alexis2004
Copy link

Vue version

v3.2.41

Link to minimal reproduction

https://sfc.vuejs.org/#__DEV____SSR__eNqlUsFuwjAM/ZUol4JEE7HtVEWIaaf9Qy4dNaMbcSMnZZNQ/31uaBkUaRLaJZHtZz8/20f57L06tCALaSI4vy8jrCzaaF4RgV4a5xsEjCujJw6LRl9moAkbqn0fqBlDURxFBdsa4ZwjOrGlxomMCbMz7LrugFATur5HTrEI3ymJK5ftPv2XDLOjRSGwdFCIjKVli97ejOFQiAQQE9KE6tIbILZ+Nh9xxCbhaHUJZ7Gb9+oHvXIhT0pyV3r1ERrkYaYEOwSClWdiK1lJb1u5i9GHQusW/ee74ib1mmOaWoy1g7xq3PpRPainpa7qEC/9CoLL36j5CkDMaGVqfSiu2XkAygmwAgL6k2yCvSKcxG5Ix2HwAG6XNTkoIcxuuUqw33UYzb7/39FdR3Hd6ek+7t+5Rdn9AL2UI2A=

Steps to reproduce

  1. Open the repro link (it contains simplest app with one child component containing one DOM node)
  2. You will see a warning banner "Hydration completed but contains mismatches." and message in browser console:
VM5971 about:srcdoc:160 [Vue warn]: Hydration node mismatch:
- Client vnode: h1 
- Server rendered DOM: <!---->  
  at <InnerComponent> 
  at <Repl>

What is expected?

The fact that hydration will occur without errors.

Either there should be no comments in the SSR rendering output, or when hydrating on the client comments should be expected in the places indicated by the warning.

What is actually happening?

I see hydration warning in console.

System Info

System:
    OS: macOS 12.5.1
    CPU: (16) x64 Intel(R) Core(TM) i9-9980HK CPU @ 2.40GHz
    Memory: 766.59 MB / 32.00 GB
    Shell: 5.8 - /usr/local/bin/zsh
  Binaries:
    Node: 16.17.1 - /usr/local/opt/node@16/bin/node
    Yarn: 1.22.17 - /usr/local/bin/yarn
    npm: 8.15.0 - /usr/local/opt/node@16/bin/npm
  Browsers:
    Chrome: 107.0.5304.87
    Firefox: 97.0.1
    Safari: 15.6.1

Any additional comments?

The problem does not reproduce if you use <script setup> (see example).

@edison1105 edison1105 added 🐞 bug Something isn't working scope: ssr labels Nov 3, 2022
@zhangzhonghe
Copy link
Member

zhangzhonghe commented Nov 3, 2022

I think it is not a bug, because here is good. Maybe the playground had a bug.

I tried to start a playground server locally and also good:

image

@edison1105
Copy link
Member

edison1105 commented Nov 3, 2022

@zhangzhonghe I also found it. the currentRenderingInstance got undefined when I debugged and the code jump into the runtime-dom module in the SFC playground. It's weird.

Please provide a fresh local repro if you can reproduce this problem.

@edison1105 edison1105 removed 🐞 bug Something isn't working scope: ssr labels Nov 3, 2022
@github-actions github-actions bot locked and limited conversation to collaborators Sep 19, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants