Skip to content

data-allow-mismatch does not suppress mismatch caused by v-ifΒ #12782

Open
@typed-sigterm

Description

@typed-sigterm

Vue version

3.5.13

Link to minimal reproduction

https://play.vuejs.org/#__SSR__eNp9UclOwzAQ/ZWRL7RSmx7gVNIiinoAiUXA0ZcomTQu3mSP06Iq/46dqKVIqDd73uL3PAd2b23WBmRzlvvSCUvgkYJdci2UNY7gAA7rCRi9wto4fDZBE3RQO6PgKiqvuOa6NNoTNN+VKwgrWCTNqC6kx/Et13+0o9EYFks4cA0gahjthK7M7i6rTBkUahonAE5eWVvIgNGRXMDo1SXDfDZkjSnjhVBZGbnxBpBbqAoqpoWUZjdVwquCygbaqagXnB1dOVs2Ip+lmvnsTM8mjHwsU4tNtvVGx2/pg3JWGmWFRPdqScSynM2HCgnr33rqZynl5DgvGyy//plv/T7NOHtz6NG1yNkJo8JtkAZ4/fGC+3g+gcpUQUb2BfAdvZEhZRxoq6CrGPuM16d97Jcr9ObTr/eE2h9LpaCJ2fV8zuKGHy5U/417nd30urgi1v0AG1nJXg==

Steps to reproduce

Just see checkout the link. None of data-allow-mismatch = text children class style attribute can suppress the hydration error/warning. (if no errors/warnings are displayed after editing, you will see them after refreshing)

What is expected?

It should suppress the error/warning.

What is actually happening?

It does not suppress them.

System Info

System:
    OS: Windows 11 10.0.22631
    CPU: (6) x64 AMD Ryzen 5 4500U with Radeon Graphics
    Memory: 1.50 GB / 7.23 GB
  Binaries:
    Node: 22.11.0 - C:\nodejs\node.EXE
    Yarn: 1.22.22 - ~\AppData\Local\pnpm\yarn.CMD
    npm: 10.9.0 - C:\nodejs\npm.CMD
    pnpm: 9.13.2 - ~\AppData\Local\pnpm\pnpm.CMD
    bun: 1.2.0 - ~\.bun\bin\bun.EXE
  Browsers:
    Edge: Chromium (128.0.2739.79), ChromiumDev (132.0.2945.0)
    Internet Explorer: 11.0.22621.3527
  npmPackages:
    vue: ^3.5.13 => 3.5.13

Any additional comments?

No response

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions