Hydration mismatch with non-printable characters

[cernymatej]

Vue version

3.5.13

Link to minimal reproduction

https://play.vuejs.org/#__SSR__eNp9kUFLxDAQhf9KnMteli5SvSxVUFlQDyoqeAlIacfaNU1CMqmF0v/uJGW1B9nc8t6byTeTEa6szfqAsIXCV661JDxSsJdSV0Z7EoQDiQuxukWljHgzTtUnUrqV1MVmLuAoXwg7q0pCvglRxHrBZxznBtOU5E3Ui80iC2sgzy99tE2290YzxxijEirT2Vahe7TUMomErUhO9Epm+b5PGrmA64NefWL19Y++90PUJDw59Oh6lPDrUekapNnevTww7cLsTB0Up4+Yz+iNCpFxjl0HXTP2Ipdo7zprHLW6efW7gVD7w1ARNCanlJfAn3FzZPQ/3Dw7S3VST7zF9x5d7MkLzLPz7DSH6Qet+5ud

Steps to reproduce

1. Open the reproduction
2. Look into the console

What is expected?

No hydration mismatch should occur since Vue should recognize that by retrieving the content of an HTML element from the DOM, it will not receive these characters.

What is actually happening?

When Vue renders a string with non-printable characters on the server, a hydration mismatch appears on the client.
For example:

const text = 'Hello World!\r'

Edit: Actually, it seems that only \r is causing problems based on my testing.

System Info

No response

Any additional comments?

No response

[jh-leong]

Closing as a duplicate of #9229