HMR is broken in a very simple case when using JSX syntax

[fz6m]

Related plugins

• plugin-vue

• plugin-vue-jsx

Describe the bug

Reproduction Steps:

1. open src/a.tsx
2. change the first v.value to v, web page will lose the value
3. change v to v.value, HMR broken

Reproduction

https://stackblitz.com/~/github.com/MoeYc/vue-hmr-broken-simple-case

Steps to reproduce

No response

System Info

unrelated

Used Package Manager

pnpm

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[edison1105]

Maybe it should be compiled like this

export const A = defineComponent({
  render() {
-    return _createVNode("div", null, [v, _createVNode("button", {
+    return _createVNode("div", null, [toDisplayString(v), _createVNode("button", {
      "onClick": () => {
        v.value++;
      }
    }, [_createTextVNode("+1")])]);
  }
});