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 does not render a single line comment but DOES render a multiline one, causing a hydration mismatch on the client #5355

Closed
AaronBeaudoin opened this issue Feb 2, 2022 · 0 comments
Labels
🐞 bug Something isn't working scope: ssr

Comments

@AaronBeaudoin
Copy link

Version

3.2.29

Reproduction link

https://github.com/AaronBeaudoin/vite-vue-ssr-bug-repr/tree/multiline-comment

Steps to reproduce

  1. npm i to install dependencies then npm run dev to run.
  2. In your browser go to http://localhost:3001.
  3. Assuming you are in Chrome, go to the "Network" tab in Devtools.
  4. Look at the response for the document. The #app element should look like this:
    <div id="app"><div><!--[--><!--]--></div></div>
  5. Note that the <!-- test --> comment is missing.
  6. In your code editor go to src/App.vue.
  7. Add a space in the comment, like for example before test like so:
    <Test>
      <!-- 
        test -->
    </Test>
  8. Reload the browser. Note the hydration mismatch error in the console.
  9. Check the document response again. The #app element should look like this:
    <div id="app"><div><!--[--><!-- 
      test --><!--]--></div></div>

What is expected?

No hydration mismatch occurs and either one of the two following things happens:

  1. The single line comment is rendered as well (I'm pretty sure this is what should happen).
  2. The multiline comment is not rendered.

What is actually happening?

The single line comment does not get rendered in the HTML the server sends to the browser, but the multiline comment does get rendered. This results in a hydration mismatch on the client side when the comment is multiline.

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

No branches or pull requests

2 participants