Vue version

3.4.8

Link to minimal reproduction

https://stackblitz.com/edit/nuxt-starter-fnlumb?file=app.vue

Steps to reproduce

Sorry for adding a new hydration issue... But latest vue v3.4.8 does not seem to have fixed all hydration issues that appeared after the 3.4 upgrade.

The repro shows a hydration style mismatch using a simple application layout from vuetify.

Related vuetify issue here

Maintainer from vuetify is pointing to vuejs/core#5300 which is closed...

Thanks in advanced

What is expected?

No hydration warnings.

What is actually happening?

Hydration warnings are thrown.

System Info

No response

Any additional comments?

No response

@jianggangsheng this is a separate issue fixed in dcc68ef7d

For this specific warning in Vuetify, it is indeed related to #5300 because Vuetify uses computed to manage nested z-index for layouts, so this is no longer an issue with the hydration mismatch detection logic itself, but rather the detection is revealing real issues in other areas.

Thanks for the clarification!

@jianggangsheng这是dcc68ef中修复的一个单独问题

但好像没有完全解决这个问题，el-form组件写出来的错误是没有了，不过el-dialog和el-alert的警告还在

These are z-index issues probably with the same cause (#5300 computed z-index not updated during SSR)

Hi @yyx990803

Sorry to bother... but I just realized that this issue has being marked as low priority ("edge case that only affects a very specific use case") and I don't think that is the case since is heavily affecting nuxt + vuetify users (seems like element users as well).

You cannot make a simple "getting started" vuetify layout without bumping into this issue so I guess is affecting many applications at the moment.

So, are there any plans on addressing this issue short term? The related #5300 is marked as closed and limited to collaborators so any update will be really appreciated.

Thanks in advanced!

no fix

@yyx990803 any updates on this? Style mismatch is triggered anytime client-side logic adds/removes classes to the element (for example hide something if user is logged in - due to various reasons check has to be made client-side)