[Vue] Hydration error in `FlexRender` when column is an empty string

[benjamincanac]

TanStack Table version

v8.21.3

Framework/Library version

Nuxt v4.0.3

Describe the bug and the steps to reproduce it

When using the @tanstack/vue-table FlexRender component in SSR, an hydration error occurs inside <td> when the column is an empty string.

Your Minimal, Reproducible Example - (Sandbox Highly Recommended)

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

Screenshots or Videos (Optional)

Do you intend to try to help solve this bug with your own PR?

None

Terms & Code of Conduct

• I agree to follow this project's Code of Conduct
• I understand that if my bug cannot be reliable reproduced in a debuggable environment, it will probably not be fixed and this issue may even be closed.

[vincerubinetti]

Ran into this myself. A single space makes the mismatch go away, and for me is good enough as it looks the same.

[isaackaara]

Submitted a fix in #6186. The root cause is that Vue's SSR renders nothing for empty strings while the client creates a text node. The fix returns null instead of empty/nullish values in FlexRender, ensuring consistent rendering between server and client.