Hydration mismatch when adding a class in the directive

[enkot]

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.