Vue version
3.4.29
Link to minimal reproduction
https://stackblitz.com/edit/github-npi9cl-n4gf8a?file=src%2Fmain.ts
Steps to reproduce
Start the dev server and open the page.
What is expected?
No "Hydration mismatch" warnings in the console
What is actually happening?
You will see the warning in the console:
entry-client.ts:6 [Vue warn]: Hydration class mismatch on <div class="test b-red">Hello World!</div>
- rendered on server: class="test b-red"
- expected on client: class="test"
Note: this mismatch is check-only. The DOM will not be rectified in production due to performance overhead.
You should fix the source of the mismatch.
at <App>
System Info
No response
Any additional comments?
Works fine in Vue 3.3.12 - https://stackblitz.com/edit/github-iswjxq-cp4swh?file=src%2Fmain.ts
props here https://github.com/vuejs/core/blame/main/packages/runtime-core/src/hydration.ts#/L462C29 never contains the class attribute modified inside the directive.
Vue version
3.4.29
Link to minimal reproduction
https://stackblitz.com/edit/github-npi9cl-n4gf8a?file=src%2Fmain.ts
Steps to reproduce
Start the dev server and open the page.
What is expected?
No "Hydration mismatch" warnings in the console
What is actually happening?
You will see the warning in the console:
System Info
No response
Any additional comments?
Works fine in Vue 3.3.12 - https://stackblitz.com/edit/github-iswjxq-cp4swh?file=src%2Fmain.ts
propshere https://github.com/vuejs/core/blame/main/packages/runtime-core/src/hydration.ts#/L462C29 never contains theclassattribute modified inside the directive.