From dcc68ef7d48973abd8dd3178b46e50e3b0785ea4 Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Thu, 11 Jan 2024 16:18:00 +0800
Subject: [PATCH 1/9] fix(hydration): do not warn against bindings w/ object
 values

---
 .../runtime-core/__tests__/hydration.spec.ts  | 34 ++++++++++------
 packages/runtime-core/src/hydration.ts        | 39 ++++++++++++-------
 2 files changed, 48 insertions(+), 25 deletions(-)

diff --git a/packages/runtime-core/__tests__/hydration.spec.ts b/packages/runtime-core/__tests__/hydration.spec.ts
index cd0c61982b8..17d7b8dbcee 100644
--- a/packages/runtime-core/__tests__/hydration.spec.ts
+++ b/packages/runtime-core/__tests__/hydration.spec.ts
@@ -1080,13 +1080,11 @@ describe('SSR hydration', () => {
   })
 
   test('force hydrate prop with `.prop` modifier', () => {
-    const { container } = mountWithHydration(
-      '<input type="checkbox" :indeterminate.prop="true">',
-      () =>
-        h('input', {
-          type: 'checkbox',
-          '.indeterminate': true,
-        }),
+    const { container } = mountWithHydration('<input type="checkbox">', () =>
+      h('input', {
+        type: 'checkbox',
+        '.indeterminate': true,
+      }),
     )
     expect((container.firstChild! as any).indeterminate).toBe(true)
   })
@@ -1475,6 +1473,16 @@ describe('SSR hydration', () => {
       mountWithHydration(`<select multiple></div>`, () =>
         h('select', { multiple: 'multiple' }),
       )
+      expect(`Hydration attribute mismatch`).not.toHaveBeenWarned()
+
+      mountWithHydration(`<div></div>`, () => h('div', { id: 'foo' }))
+      expect(`Hydration attribute mismatch`).toHaveBeenWarnedTimes(1)
+
+      mountWithHydration(`<div id="bar"></div>`, () => h('div', { id: 'foo' }))
+      expect(`Hydration attribute mismatch`).toHaveBeenWarnedTimes(2)
+    })
+
+    test('attr special case: textarea value', () => {
       mountWithHydration(`<textarea>foo</textarea>`, () =>
         h('textarea', { value: 'foo' }),
       )
@@ -1483,11 +1491,10 @@ describe('SSR hydration', () => {
       )
       expect(`Hydration attribute mismatch`).not.toHaveBeenWarned()
 
-      mountWithHydration(`<div></div>`, () => h('div', { id: 'foo' }))
+      mountWithHydration(`<textarea>foo</textarea>`, () =>
+        h('textarea', { value: 'bar' }),
+      )
       expect(`Hydration attribute mismatch`).toHaveBeenWarned()
-
-      mountWithHydration(`<div id="bar"></div>`, () => h('div', { id: 'foo' }))
-      expect(`Hydration attribute mismatch`).toHaveBeenWarnedTimes(2)
     })
 
     test('boolean attr handling', () => {
@@ -1504,5 +1511,10 @@ describe('SSR hydration', () => {
       )
       expect(`Hydration attribute mismatch`).not.toHaveBeenWarned()
     })
+
+    test('should not warn against object values', () => {
+      mountWithHydration(`<input />`, () => h('input', { from: {} }))
+      expect(`Hydration attribute mismatch`).not.toHaveBeenWarned()
+    })
   })
 })
diff --git a/packages/runtime-core/src/hydration.ts b/packages/runtime-core/src/hydration.ts
index 8f095f6167f..4df4eecece9 100644
--- a/packages/runtime-core/src/hydration.ts
+++ b/packages/runtime-core/src/hydration.ts
@@ -21,6 +21,7 @@ import {
   isBooleanAttr,
   isKnownHtmlAttr,
   isKnownSvgAttr,
+  isObject,
   isOn,
   isReservedProp,
   isString,
@@ -759,12 +760,17 @@ function propHasMismatch(
       expected = includeBooleanAttr(clientValue)
     } else {
       // #10000 some attrs such as textarea.value can't be get by `hasAttribute`
-      actual = el.hasAttribute(key)
-        ? el.getAttribute(key)
-        : key in el
-          ? el[key as keyof typeof el]
-          : ''
-      expected = clientValue == null ? '' : String(clientValue)
+      if (el.hasAttribute(key)) {
+        actual = el.getAttribute(key)
+      } else if (key in el) {
+        const serverValue = el[key as keyof typeof el]
+        if (!isObject(serverValue)) {
+          actual = serverValue == null ? '' : String(serverValue)
+        }
+      }
+      if (!isObject(clientValue)) {
+        expected = clientValue == null ? '' : String(clientValue)
+      }
     }
     if (actual !== expected) {
       mismatchType = `attribute`
@@ -775,15 +781,20 @@ function propHasMismatch(
   if (mismatchType) {
     const format = (v: any) =>
       v === false ? `(not rendered)` : `${mismatchKey}="${v}"`
-    warn(
-      `Hydration ${mismatchType} mismatch on`,
-      el,
+    const preSegment = `Hydration ${mismatchType} mismatch on`
+    const postSegment =
       `\n  - rendered on server: ${format(actual)}` +
-        `\n  - expected on client: ${format(expected)}` +
-        `\n  Note: this mismatch is check-only. The DOM will not be rectified ` +
-        `in production due to performance overhead.` +
-        `\n  You should fix the source of the mismatch.`,
-    )
+      `\n  - expected on client: ${format(expected)}` +
+      `\n  Note: this mismatch is check-only. The DOM will not be rectified ` +
+      `in production due to performance overhead.` +
+      `\n  You should fix the source of the mismatch.`
+    if (__TEST__) {
+      // during tests, log the full message in one single string for easier
+      // debugging.
+      warn(`${preSegment} ${el.tagName}${postSegment}`)
+    } else {
+      warn(preSegment, el, postSegment)
+    }
     return true
   }
   return false

From cd419aec3cb615eaea8b2324356f38f4c0ff1fcc Mon Sep 17 00:00:00 2001
From: cyx <30902641+Duncanxyz@users.noreply.github.com>
Date: Thu, 11 Jan 2024 17:11:35 +0800
Subject: [PATCH 2/9] fix(runtime-dom): unify behavior for v-show + style
 display binding (#10075)

close #10074
---
 packages/runtime-dom/src/modules/style.ts | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/packages/runtime-dom/src/modules/style.ts b/packages/runtime-dom/src/modules/style.ts
index ce112ab87ed..6341c8a120e 100644
--- a/packages/runtime-dom/src/modules/style.ts
+++ b/packages/runtime-dom/src/modules/style.ts
@@ -7,6 +7,7 @@ type Style = string | Record<string, string | string[]> | null
 
 export function patchStyle(el: Element, prev: Style, next: Style) {
   const style = (el as HTMLElement).style
+  const currentDisplay = style.display
   const isCssString = isString(next)
   if (next && !isCssString) {
     if (prev && !isString(prev)) {
@@ -20,7 +21,6 @@ export function patchStyle(el: Element, prev: Style, next: Style) {
       setStyle(style, key, next[key])
     }
   } else {
-    const currentDisplay = style.display
     if (isCssString) {
       if (prev !== next) {
         // #9821
@@ -33,12 +33,12 @@ export function patchStyle(el: Element, prev: Style, next: Style) {
     } else if (prev) {
       el.removeAttribute('style')
     }
-    // indicates that the `display` of the element is controlled by `v-show`,
-    // so we always keep the current `display` value regardless of the `style`
-    // value, thus handing over control to `v-show`.
-    if (vShowOldKey in el) {
-      style.display = currentDisplay
-    }
+  }
+  // indicates that the `display` of the element is controlled by `v-show`,
+  // so we always keep the current `display` value regardless of the `style`
+  // value, thus handing over control to `v-show`.
+  if (vShowOldKey in el) {
+    style.display = currentDisplay
   }
 }
 

From 07b19a53a5f313a219ea87546846b79d89e39e96 Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Thu, 11 Jan 2024 17:14:49 +0800
Subject: [PATCH 3/9] test: test case for style binding w/ object value +
 v-show

ref #10074
---
 .../__tests__/directives/vShow.spec.ts        | 26 +++++++++++++++++++
 1 file changed, 26 insertions(+)

diff --git a/packages/runtime-dom/__tests__/directives/vShow.spec.ts b/packages/runtime-dom/__tests__/directives/vShow.spec.ts
index 5e837650854..70b69f2df1c 100644
--- a/packages/runtime-dom/__tests__/directives/vShow.spec.ts
+++ b/packages/runtime-dom/__tests__/directives/vShow.spec.ts
@@ -151,6 +151,32 @@ describe('runtime-dom: v-show directive', () => {
     expect($div.style.display).toEqual('')
   })
 
+  test('the value of `display` set by v-show should not be overwritten by the style attribute when updated (object value)', async () => {
+    const style = ref({
+      display: 'block',
+      width: '100px',
+    })
+    const display = ref(false)
+    const component = defineComponent({
+      render() {
+        return withVShow(h('div', { style: style.value }), display.value)
+      },
+    })
+    render(h(component), root)
+
+    const $div = root.children[0]
+
+    expect($div.style.display).toEqual('none')
+
+    style.value.width = '50px'
+    await nextTick()
+    expect($div.style.display).toEqual('none')
+
+    display.value = true
+    await nextTick()
+    expect($div.style.display).toEqual('block')
+  })
+
   // #2583, #2757
   test('the value of `display` set by v-show should not be overwritten by the style attribute when updated (with Transition)', async () => {
     const style = ref('width: 100px')

From bcda96b525801eb7a1d397300fb3f2f9b827ddfb Mon Sep 17 00:00:00 2001
From: edison <daiwei521@126.com>
Date: Thu, 11 Jan 2024 17:27:53 +0800
Subject: [PATCH 4/9] fix(suspense): avoid double-patching nested suspense when
 parent suspense is not resolved (#10055)

close #8678
---
 .../__tests__/components/Suspense.spec.ts     | 135 ++++++++++++++++++
 .../runtime-core/src/components/Suspense.ts   |  12 ++
 2 files changed, 147 insertions(+)

diff --git a/packages/runtime-core/__tests__/components/Suspense.spec.ts b/packages/runtime-core/__tests__/components/Suspense.spec.ts
index 7c3f8ff8b3d..928da872faf 100644
--- a/packages/runtime-core/__tests__/components/Suspense.spec.ts
+++ b/packages/runtime-core/__tests__/components/Suspense.spec.ts
@@ -1641,6 +1641,141 @@ describe('Suspense', () => {
     expect(serializeInner(root)).toBe(expected)
   })
 
+  //#8678
+  test('nested suspense (child suspense update before parent suspense resolve)', async () => {
+    const calls: string[] = []
+
+    const InnerA = defineAsyncComponent(
+      {
+        setup: () => {
+          calls.push('innerA created')
+          onMounted(() => {
+            calls.push('innerA mounted')
+          })
+          return () => h('div', 'innerA')
+        },
+      },
+      10,
+    )
+
+    const InnerB = defineAsyncComponent(
+      {
+        setup: () => {
+          calls.push('innerB created')
+          onMounted(() => {
+            calls.push('innerB mounted')
+          })
+          return () => h('div', 'innerB')
+        },
+      },
+      10,
+    )
+
+    const OuterA = defineAsyncComponent(
+      {
+        setup: (_, { slots }: any) => {
+          calls.push('outerA created')
+          onMounted(() => {
+            calls.push('outerA mounted')
+          })
+          return () =>
+            h(Fragment, null, [h('div', 'outerA'), slots.default?.()])
+        },
+      },
+      5,
+    )
+
+    const OuterB = defineAsyncComponent(
+      {
+        setup: (_, { slots }: any) => {
+          calls.push('outerB created')
+          onMounted(() => {
+            calls.push('outerB mounted')
+          })
+          return () =>
+            h(Fragment, null, [h('div', 'outerB'), slots.default?.()])
+        },
+      },
+      5,
+    )
+
+    const outerToggle = ref(false)
+    const innerToggle = ref(false)
+
+    /**
+     *  <Suspense>
+     *    <component :is="outerToggle ? outerB : outerA">
+     *      <Suspense>
+     *        <component :is="innerToggle ? innerB : innerA" />
+     *      </Suspense>
+     *    </component>
+     *  </Suspense>
+     */
+    const Comp = {
+      setup() {
+        return () =>
+          h(Suspense, null, {
+            default: [
+              h(outerToggle.value ? OuterB : OuterA, null, {
+                default: () =>
+                  h(Suspense, null, {
+                    default: h(innerToggle.value ? InnerB : InnerA),
+                  }),
+              }),
+            ],
+            fallback: h('div', 'fallback outer'),
+          })
+      },
+    }
+
+    const root = nodeOps.createElement('div')
+    render(h(Comp), root)
+    expect(serializeInner(root)).toBe(`<div>fallback outer</div>`)
+
+    // mount outer component
+    await Promise.all(deps)
+    await nextTick()
+
+    expect(serializeInner(root)).toBe(`<div>outerA</div><!---->`)
+    expect(calls).toEqual([`outerA created`, `outerA mounted`])
+
+    // mount inner component
+    await Promise.all(deps)
+    await nextTick()
+    expect(serializeInner(root)).toBe(`<div>outerA</div><div>innerA</div>`)
+
+    expect(calls).toEqual([
+      'outerA created',
+      'outerA mounted',
+      'innerA created',
+      'innerA mounted',
+    ])
+
+    calls.length = 0
+    deps.length = 0
+
+    // toggle both outer and inner components
+    outerToggle.value = true
+    innerToggle.value = true
+    await nextTick()
+
+    await Promise.all(deps)
+    await nextTick()
+    expect(serializeInner(root)).toBe(`<div>outerB</div><!---->`)
+
+    await Promise.all(deps)
+    await nextTick()
+    expect(serializeInner(root)).toBe(`<div>outerB</div><div>innerB</div>`)
+
+    // innerB only mount once
+    expect(calls).toEqual([
+      'outerB created',
+      'outerB mounted',
+      'innerB created',
+      'innerB mounted',
+    ])
+  })
+
   // #6416
   test('KeepAlive with Suspense', async () => {
     const Async = defineAsyncComponent({
diff --git a/packages/runtime-core/src/components/Suspense.ts b/packages/runtime-core/src/components/Suspense.ts
index ac023ae60cd..9b3d6765d9c 100644
--- a/packages/runtime-core/src/components/Suspense.ts
+++ b/packages/runtime-core/src/components/Suspense.ts
@@ -91,6 +91,18 @@ export const SuspenseImpl = {
         rendererInternals,
       )
     } else {
+      // #8678 if the current suspense needs to be patched and parentSuspense has
+      // not been resolved. this means that both the current suspense and parentSuspense
+      // need to be patched. because parentSuspense's pendingBranch includes the
+      // current suspense, it will be processed twice:
+      //  1. current patch
+      //  2. mounting along with the pendingBranch of parentSuspense
+      // it is necessary to skip the current patch to avoid multiple mounts
+      // of inner components.
+      if (parentSuspense && parentSuspense.deps > 0) {
+        n2.suspense = n1.suspense
+        return
+      }
       patchSuspense(
         n1,
         n2,

From 92514db70821fce5aaa7dd903bfcb19252b26c4c Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Thu, 11 Jan 2024 18:04:32 +0800
Subject: [PATCH 5/9] build: add node production/development condition in
 package exports (#10036)

follow up of #9977
---
 packages/compiler-core/package.json   | 14 ++++++++++++++
 packages/compiler-dom/package.json    | 14 ++++++++++++++
 packages/compiler-sfc/package.json    | 10 ++++++++++
 packages/reactivity/package.json      | 14 ++++++++++++++
 packages/runtime-core/package.json    | 14 ++++++++++++++
 packages/runtime-dom/package.json     | 14 ++++++++++++++
 packages/server-renderer/package.json | 14 ++++++++++++++
 packages/shared/package.json          | 14 ++++++++++++++
 packages/vue-compat/package.json      | 14 ++++++++++++++
 packages/vue/package.json             |  5 +++++
 10 files changed, 127 insertions(+)

diff --git a/packages/compiler-core/package.json b/packages/compiler-core/package.json
index a5ff635918f..d5ef8b4d300 100644
--- a/packages/compiler-core/package.json
+++ b/packages/compiler-core/package.json
@@ -9,6 +9,20 @@
     "index.js",
     "dist"
   ],
+  "exports": {
+    ".": {
+      "types": "./dist/compiler-core.d.ts",
+      "node": {
+        "production": "./dist/compiler-core.cjs.prod.js",
+        "development": "./dist/compiler-core.cjs.js",
+        "default": "./index.js"
+      },
+      "module": "./dist/compiler-core.esm-bundler.js",
+      "import": "./dist/compiler-core.esm-bundler.js",
+      "require": "./index.js"
+    },
+    "./*": "./*"
+  },
   "buildOptions": {
     "name": "VueCompilerCore",
     "compat": true,
diff --git a/packages/compiler-dom/package.json b/packages/compiler-dom/package.json
index 2e7206e14e1..bc7b9a8c65b 100644
--- a/packages/compiler-dom/package.json
+++ b/packages/compiler-dom/package.json
@@ -11,6 +11,20 @@
     "index.js",
     "dist"
   ],
+  "exports": {
+    ".": {
+      "types": "./dist/compiler-dom.d.ts",
+      "node": {
+        "production": "./dist/compiler-dom.cjs.prod.js",
+        "development": "./dist/compiler-dom.cjs.js",
+        "default": "./index.js"
+      },
+      "module": "./dist/compiler-dom.esm-bundler.js",
+      "import": "./dist/compiler-dom.esm-bundler.js",
+      "require": "./index.js"
+    },
+    "./*": "./*"
+  },
   "sideEffects": false,
   "buildOptions": {
     "name": "VueCompilerDOM",
diff --git a/packages/compiler-sfc/package.json b/packages/compiler-sfc/package.json
index 21eda5a62cf..1c02868772e 100644
--- a/packages/compiler-sfc/package.json
+++ b/packages/compiler-sfc/package.json
@@ -8,6 +8,16 @@
   "files": [
     "dist"
   ],
+  "exports": {
+    ".": {
+      "types": "./dist/compiler-sfc.d.ts",
+      "node": "./dist/compiler-sfc.cjs.js",
+      "module": "./dist/compiler-sfc.esm-browser.js",
+      "import": "./dist/compiler-sfc.esm-browser.js",
+      "require": "./dist/compiler-sfc.cjs.js"
+    },
+    "./*": "./*"
+  },
   "buildOptions": {
     "name": "VueCompilerSFC",
     "formats": [
diff --git a/packages/reactivity/package.json b/packages/reactivity/package.json
index 2f53964baf7..ed7928c1213 100644
--- a/packages/reactivity/package.json
+++ b/packages/reactivity/package.json
@@ -11,6 +11,20 @@
     "index.js",
     "dist"
   ],
+  "exports": {
+    ".": {
+      "types": "./dist/reactivity.d.ts",
+      "node": {
+        "production": "./dist/reactivity.cjs.prod.js",
+        "development": "./dist/reactivity.cjs.js",
+        "default": "./index.js"
+      },
+      "module": "./dist/reactivity.esm-bundler.js",
+      "import": "./dist/reactivity.esm-bundler.js",
+      "require": "./index.js"
+    },
+    "./*": "./*"
+  },
   "sideEffects": false,
   "repository": {
     "type": "git",
diff --git a/packages/runtime-core/package.json b/packages/runtime-core/package.json
index 588adc20448..28a72a46e3f 100644
--- a/packages/runtime-core/package.json
+++ b/packages/runtime-core/package.json
@@ -9,6 +9,20 @@
     "index.js",
     "dist"
   ],
+  "exports": {
+    ".": {
+      "types": "./dist/runtime-core.d.ts",
+      "node": {
+        "production": "./dist/runtime-core.cjs.prod.js",
+        "development": "./dist/runtime-core.cjs.js",
+        "default": "./index.js"
+      },
+      "module": "./dist/runtime-core.esm-bundler.js",
+      "import": "./dist/runtime-core.esm-bundler.js",
+      "require": "./index.js"
+    },
+    "./*": "./*"
+  },
   "buildOptions": {
     "name": "VueRuntimeCore",
     "formats": [
diff --git a/packages/runtime-dom/package.json b/packages/runtime-dom/package.json
index f786057f38e..3c2d8e2e3ee 100644
--- a/packages/runtime-dom/package.json
+++ b/packages/runtime-dom/package.json
@@ -10,6 +10,20 @@
     "index.js",
     "dist"
   ],
+  "exports": {
+    ".": {
+      "types": "./dist/runtime-dom.d.ts",
+      "node": {
+        "production": "./dist/runtime-dom.cjs.prod.js",
+        "development": "./dist/runtime-dom.cjs.js",
+        "default": "./index.js"
+      },
+      "module": "./dist/runtime-dom.esm-bundler.js",
+      "import": "./dist/runtime-dom.esm-bundler.js",
+      "require": "./index.js"
+    },
+    "./*": "./*"
+  },
   "sideEffects": false,
   "buildOptions": {
     "name": "VueRuntimeDOM",
diff --git a/packages/server-renderer/package.json b/packages/server-renderer/package.json
index 48e2458a553..3ff0817c694 100644
--- a/packages/server-renderer/package.json
+++ b/packages/server-renderer/package.json
@@ -9,6 +9,20 @@
     "index.js",
     "dist"
   ],
+  "exports": {
+    ".": {
+      "types": "./dist/server-renderer.d.ts",
+      "node": {
+        "production": "./dist/server-renderer.cjs.prod.js",
+        "development": "./dist/server-renderer.cjs.js",
+        "default": "./index.js"
+      },
+      "module": "./dist/server-renderer.esm-bundler.js",
+      "import": "./dist/server-renderer.esm-bundler.js",
+      "require": "./index.js"
+    },
+    "./*": "./*"
+  },
   "buildOptions": {
     "name": "VueServerRenderer",
     "formats": [
diff --git a/packages/shared/package.json b/packages/shared/package.json
index 0e19df2c95d..3e21d4a3b99 100644
--- a/packages/shared/package.json
+++ b/packages/shared/package.json
@@ -9,6 +9,20 @@
     "index.js",
     "dist"
   ],
+  "exports": {
+    ".": {
+      "types": "./dist/shared.d.ts",
+      "node": {
+        "production": "./dist/shared.cjs.prod.js",
+        "development": "./dist/shared.cjs.js",
+        "default": "./index.js"
+      },
+      "module": "./dist/shared.esm-bundler.js",
+      "import": "./dist/shared.esm-bundler.js",
+      "require": "./index.js"
+    },
+    "./*": "./*"
+  },
   "sideEffects": false,
   "buildOptions": {
     "formats": [
diff --git a/packages/vue-compat/package.json b/packages/vue-compat/package.json
index 4aa8e9d73ca..46d0bd9600e 100644
--- a/packages/vue-compat/package.json
+++ b/packages/vue-compat/package.json
@@ -10,6 +10,20 @@
     "index.js",
     "dist"
   ],
+  "exports": {
+    ".": {
+      "types": "./dist/vue.d.ts",
+      "node": {
+        "production": "./dist/vue.cjs.prod.js",
+        "development": "./dist/vue.cjs.js",
+        "default": "./index.js"
+      },
+      "module": "./dist/vue.esm-bundler.js",
+      "import": "./dist/vue.esm-bundler.js",
+      "require": "./index.js"
+    },
+    "./*": "./*"
+  },
   "buildOptions": {
     "name": "Vue",
     "filename": "vue",
diff --git a/packages/vue/package.json b/packages/vue/package.json
index 597c4acac95..a686179d48d 100644
--- a/packages/vue/package.json
+++ b/packages/vue/package.json
@@ -25,6 +25,11 @@
       },
       "require": {
         "types": "./dist/vue.d.ts",
+        "node": {
+          "production": "./dist/vue.cjs.prod.js",
+          "development": "./dist/vue.cjs.js",
+          "default": "./index.js"
+        },
         "default": "./index.js"
       }
     },

From 8fda856a82507eb9f62338dbbf9fdda3672a52a4 Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Thu, 11 Jan 2024 17:57:47 +0800
Subject: [PATCH 6/9] refactor: split out useModel implementation and tests

---
 packages/dts-test/setupHelpers.test-d.ts      |   4 +-
 .../__tests__/apiSetupHelpers.spec.ts         | 521 -----------------
 .../__tests__/helpers/useModel.spec.ts        | 529 ++++++++++++++++++
 packages/runtime-core/src/apiSetupHelpers.ts  | 111 +---
 packages/runtime-core/src/helpers/useModel.ts |  88 +++
 packages/runtime-core/src/index.ts            |   2 +-
 6 files changed, 632 insertions(+), 623 deletions(-)
 create mode 100644 packages/runtime-core/__tests__/helpers/useModel.spec.ts
 create mode 100644 packages/runtime-core/src/helpers/useModel.ts

diff --git a/packages/dts-test/setupHelpers.test-d.ts b/packages/dts-test/setupHelpers.test-d.ts
index 9588cb9b209..c749e80a5c7 100644
--- a/packages/dts-test/setupHelpers.test-d.ts
+++ b/packages/dts-test/setupHelpers.test-d.ts
@@ -2,18 +2,18 @@ import {
   type Ref,
   type Slots,
   type VNode,
+  defineComponent,
   defineEmits,
   defineModel,
   defineProps,
   defineSlots,
   toRefs,
   useAttrs,
+  useModel,
   useSlots,
   withDefaults,
 } from 'vue'
 import { describe, expectType } from './utils'
-import { defineComponent } from 'vue'
-import { useModel } from 'vue'
 
 describe('defineProps w/ type declaration', () => {
   // type declaration
diff --git a/packages/runtime-core/__tests__/apiSetupHelpers.spec.ts b/packages/runtime-core/__tests__/apiSetupHelpers.spec.ts
index 04df0ae593a..04e9c1c86db 100644
--- a/packages/runtime-core/__tests__/apiSetupHelpers.spec.ts
+++ b/packages/runtime-core/__tests__/apiSetupHelpers.spec.ts
@@ -1,28 +1,18 @@
 import {
   type ComponentInternalInstance,
   type ComputedRef,
-  Fragment,
-  type Ref,
   type SetupContext,
   Suspense,
   computed,
   createApp,
-  createBlock,
-  createElementBlock,
-  createElementVNode,
-  createVNode,
   defineComponent,
   getCurrentInstance,
   h,
-  nextTick,
   nodeOps,
   onMounted,
-  openBlock,
-  ref,
   render,
   serializeInner,
   shallowReactive,
-  watch,
 } from '@vue/runtime-test'
 import {
   createPropsRestProxy,
@@ -32,7 +22,6 @@ import {
   mergeDefaults,
   mergeModels,
   useAttrs,
-  useModel,
   useSlots,
   withAsyncContext,
   withDefaults,
@@ -185,516 +174,6 @@ describe('SFC <script setup> helpers', () => {
     })
   })
 
-  describe('useModel', () => {
-    test('basic', async () => {
-      let foo: any
-      const update = () => {
-        foo.value = 'bar'
-      }
-
-      const compRender = vi.fn()
-      const Comp = defineComponent({
-        props: ['modelValue'],
-        emits: ['update:modelValue'],
-        setup(props) {
-          foo = useModel(props, 'modelValue')
-          return () => {
-            compRender()
-            return foo.value
-          }
-        },
-      })
-
-      const msg = ref('')
-      const setValue = vi.fn(v => (msg.value = v))
-      const root = nodeOps.createElement('div')
-      createApp(() =>
-        h(Comp, {
-          modelValue: msg.value,
-          'onUpdate:modelValue': setValue,
-        }),
-      ).mount(root)
-
-      expect(foo.value).toBe('')
-      expect(msg.value).toBe('')
-      expect(setValue).not.toBeCalled()
-      expect(compRender).toBeCalledTimes(1)
-      expect(serializeInner(root)).toBe('')
-
-      // update from child
-      update()
-
-      await nextTick()
-      expect(msg.value).toBe('bar')
-      expect(foo.value).toBe('bar')
-      expect(setValue).toBeCalledTimes(1)
-      expect(compRender).toBeCalledTimes(2)
-      expect(serializeInner(root)).toBe('bar')
-
-      // update from parent
-      msg.value = 'qux'
-      expect(msg.value).toBe('qux')
-
-      await nextTick()
-      expect(msg.value).toBe('qux')
-      expect(foo.value).toBe('qux')
-      expect(setValue).toBeCalledTimes(1)
-      expect(compRender).toBeCalledTimes(3)
-      expect(serializeInner(root)).toBe('qux')
-    })
-
-    test('without parent value (local mutation)', async () => {
-      let foo: any
-      const update = () => {
-        foo.value = 'bar'
-      }
-
-      const compRender = vi.fn()
-      const Comp = defineComponent({
-        props: ['foo'],
-        emits: ['update:foo'],
-        setup(props) {
-          foo = useModel(props, 'foo')
-          return () => {
-            compRender()
-            return foo.value
-          }
-        },
-      })
-
-      const root = nodeOps.createElement('div')
-      const updateFoo = vi.fn()
-      render(h(Comp, { 'onUpdate:foo': updateFoo }), root)
-      expect(compRender).toBeCalledTimes(1)
-      expect(serializeInner(root)).toBe('<!---->')
-
-      expect(foo.value).toBeUndefined()
-      update()
-      // when parent didn't provide value, local mutation is enabled
-      expect(foo.value).toBe('bar')
-
-      await nextTick()
-      expect(updateFoo).toBeCalledTimes(1)
-      expect(compRender).toBeCalledTimes(2)
-      expect(serializeInner(root)).toBe('bar')
-    })
-
-    test('without parent listener (local mutation)', async () => {
-      let foo: any
-      const update = () => {
-        foo.value = 'bar'
-      }
-
-      const compRender = vi.fn()
-      const Comp = defineComponent({
-        props: ['foo'],
-        emits: ['update:foo'],
-        setup(props) {
-          foo = useModel(props, 'foo')
-          return () => {
-            compRender()
-            return foo.value
-          }
-        },
-      })
-
-      const root = nodeOps.createElement('div')
-      // provide initial value
-      render(h(Comp, { foo: 'initial' }), root)
-      expect(compRender).toBeCalledTimes(1)
-      expect(serializeInner(root)).toBe('initial')
-
-      expect(foo.value).toBe('initial')
-      update()
-      // when parent didn't provide value, local mutation is enabled
-      expect(foo.value).toBe('bar')
-
-      await nextTick()
-      expect(compRender).toBeCalledTimes(2)
-      expect(serializeInner(root)).toBe('bar')
-    })
-
-    test('kebab-case v-model (should not be local)', async () => {
-      let foo: any
-
-      const compRender = vi.fn()
-      const Comp = defineComponent({
-        props: ['fooBar'],
-        emits: ['update:fooBar'],
-        setup(props) {
-          foo = useModel(props, 'fooBar')
-          return () => {
-            compRender()
-            return foo.value
-          }
-        },
-      })
-
-      const updateFooBar = vi.fn()
-      const root = nodeOps.createElement('div')
-      // v-model:foo-bar compiles to foo-bar and onUpdate:fooBar
-      render(
-        h(Comp, { 'foo-bar': 'initial', 'onUpdate:fooBar': updateFooBar }),
-        root,
-      )
-      expect(compRender).toBeCalledTimes(1)
-      expect(serializeInner(root)).toBe('initial')
-
-      expect(foo.value).toBe('initial')
-      foo.value = 'bar'
-      // should not be using local mode, so nothing should actually change
-      expect(foo.value).toBe('initial')
-
-      await nextTick()
-      expect(compRender).toBeCalledTimes(1)
-      expect(updateFooBar).toBeCalledTimes(1)
-      expect(updateFooBar).toHaveBeenCalledWith('bar')
-      expect(foo.value).toBe('initial')
-      expect(serializeInner(root)).toBe('initial')
-    })
-
-    test('kebab-case update listener (should not be local)', async () => {
-      let foo: any
-
-      const compRender = vi.fn()
-      const Comp = defineComponent({
-        props: ['fooBar'],
-        emits: ['update:fooBar'],
-        setup(props) {
-          foo = useModel(props, 'fooBar')
-          return () => {
-            compRender()
-            return foo.value
-          }
-        },
-      })
-
-      const updateFooBar = vi.fn()
-      const root = nodeOps.createElement('div')
-      // The template compiler won't create hyphenated listeners, but it could have been passed manually
-      render(
-        h(Comp, { 'foo-bar': 'initial', 'onUpdate:foo-bar': updateFooBar }),
-        root,
-      )
-      expect(compRender).toBeCalledTimes(1)
-      expect(serializeInner(root)).toBe('initial')
-
-      expect(foo.value).toBe('initial')
-      foo.value = 'bar'
-      // should not be using local mode, so nothing should actually change
-      expect(foo.value).toBe('initial')
-
-      await nextTick()
-      expect(compRender).toBeCalledTimes(1)
-      expect(updateFooBar).toBeCalledTimes(1)
-      expect(updateFooBar).toHaveBeenCalledWith('bar')
-      expect(foo.value).toBe('initial')
-      expect(serializeInner(root)).toBe('initial')
-    })
-
-    test('default value', async () => {
-      let count: any
-      const inc = () => {
-        count.value++
-      }
-
-      const compRender = vi.fn()
-      const Comp = defineComponent({
-        props: { count: { default: 0 } },
-        emits: ['update:count'],
-        setup(props) {
-          count = useModel(props, 'count')
-          return () => {
-            compRender()
-            return count.value
-          }
-        },
-      })
-
-      const root = nodeOps.createElement('div')
-      const updateCount = vi.fn()
-      render(h(Comp, { 'onUpdate:count': updateCount }), root)
-      expect(compRender).toBeCalledTimes(1)
-      expect(serializeInner(root)).toBe('0')
-
-      expect(count.value).toBe(0)
-
-      inc()
-      // when parent didn't provide value, local mutation is enabled
-      expect(count.value).toBe(1)
-
-      await nextTick()
-
-      expect(updateCount).toBeCalledTimes(1)
-      expect(compRender).toBeCalledTimes(2)
-      expect(serializeInner(root)).toBe('1')
-    })
-
-    test('parent limiting child value', async () => {
-      let childCount: Ref<number>
-
-      const compRender = vi.fn()
-      const Comp = defineComponent({
-        props: ['count'],
-        emits: ['update:count'],
-        setup(props) {
-          childCount = useModel(props, 'count')
-          return () => {
-            compRender()
-            return childCount.value
-          }
-        },
-      })
-
-      const Parent = defineComponent({
-        setup() {
-          const count = ref(0)
-          watch(count, () => {
-            if (count.value < 0) {
-              count.value = 0
-            }
-          })
-          return () =>
-            h(Comp, {
-              count: count.value,
-              'onUpdate:count': val => {
-                count.value = val
-              },
-            })
-        },
-      })
-
-      const root = nodeOps.createElement('div')
-      render(h(Parent), root)
-      expect(serializeInner(root)).toBe('0')
-
-      // child update
-      childCount!.value = 1
-      // not yet updated
-      expect(childCount!.value).toBe(0)
-
-      await nextTick()
-      expect(childCount!.value).toBe(1)
-      expect(serializeInner(root)).toBe('1')
-
-      // child update to invalid value
-      childCount!.value = -1
-      // not yet updated
-      expect(childCount!.value).toBe(1)
-
-      await nextTick()
-      // limited to 0 by parent
-      expect(childCount!.value).toBe(0)
-      expect(serializeInner(root)).toBe('0')
-    })
-
-    test('has parent value -> no parent value', async () => {
-      let childCount: Ref<number>
-
-      const compRender = vi.fn()
-      const Comp = defineComponent({
-        props: ['count'],
-        emits: ['update:count'],
-        setup(props) {
-          childCount = useModel(props, 'count')
-          return () => {
-            compRender()
-            return childCount.value
-          }
-        },
-      })
-
-      const toggle = ref(true)
-      const Parent = defineComponent({
-        setup() {
-          const count = ref(0)
-          return () =>
-            toggle.value
-              ? h(Comp, {
-                  count: count.value,
-                  'onUpdate:count': val => {
-                    count.value = val
-                  },
-                })
-              : h(Comp)
-        },
-      })
-
-      const root = nodeOps.createElement('div')
-      render(h(Parent), root)
-      expect(serializeInner(root)).toBe('0')
-
-      // child update
-      childCount!.value = 1
-      // not yet updated
-      expect(childCount!.value).toBe(0)
-
-      await nextTick()
-      expect(childCount!.value).toBe(1)
-      expect(serializeInner(root)).toBe('1')
-
-      // parent change
-      toggle.value = false
-
-      await nextTick()
-      // localValue should be reset
-      expect(childCount!.value).toBeUndefined()
-      expect(serializeInner(root)).toBe('<!---->')
-
-      // child local mutation should continue to work
-      childCount!.value = 2
-      expect(childCount!.value).toBe(2)
-
-      await nextTick()
-      expect(serializeInner(root)).toBe('2')
-    })
-
-    // #9838
-    test('pass modelValue to slot (optimized mode) ', async () => {
-      let foo: any
-      const update = () => {
-        foo.value = 'bar'
-      }
-
-      const Comp = {
-        render(this: any) {
-          return this.$slots.default()
-        },
-      }
-
-      const childRender = vi.fn()
-      const slotRender = vi.fn()
-      const Child = defineComponent({
-        props: ['modelValue'],
-        emits: ['update:modelValue'],
-        setup(props) {
-          foo = useModel(props, 'modelValue')
-          return () => {
-            childRender()
-            return (
-              openBlock(),
-              createElementBlock(Fragment, null, [
-                createVNode(Comp, null, {
-                  default: () => {
-                    slotRender()
-                    return createElementVNode('div', null, foo.value)
-                  },
-                  _: 1 /* STABLE */,
-                }),
-              ])
-            )
-          }
-        },
-      })
-
-      const msg = ref('')
-      const setValue = vi.fn(v => (msg.value = v))
-      const root = nodeOps.createElement('div')
-      createApp({
-        render() {
-          return (
-            openBlock(),
-            createBlock(
-              Child,
-              {
-                modelValue: msg.value,
-                'onUpdate:modelValue': setValue,
-              },
-              null,
-              8 /* PROPS */,
-              ['modelValue'],
-            )
-          )
-        },
-      }).mount(root)
-
-      expect(foo.value).toBe('')
-      expect(msg.value).toBe('')
-      expect(setValue).not.toBeCalled()
-      expect(childRender).toBeCalledTimes(1)
-      expect(slotRender).toBeCalledTimes(1)
-      expect(serializeInner(root)).toBe('<div></div>')
-
-      // update from child
-      update()
-
-      await nextTick()
-      expect(msg.value).toBe('bar')
-      expect(foo.value).toBe('bar')
-      expect(setValue).toBeCalledTimes(1)
-      expect(childRender).toBeCalledTimes(2)
-      expect(slotRender).toBeCalledTimes(2)
-      expect(serializeInner(root)).toBe('<div>bar</div>')
-    })
-
-    test('with modifiers & transformers', async () => {
-      let childMsg: Ref<string>
-      let childModifiers: Record<string, true | undefined>
-
-      const compRender = vi.fn()
-      const Comp = defineComponent({
-        props: ['msg', 'msgModifiers'],
-        emits: ['update:msg'],
-        setup(props) {
-          ;[childMsg, childModifiers] = useModel(props, 'msg', {
-            get(val) {
-              return val.toLowerCase()
-            },
-            set(val) {
-              if (childModifiers.upper) {
-                return val.toUpperCase()
-              }
-            },
-          })
-          return () => {
-            compRender()
-            return childMsg.value
-          }
-        },
-      })
-
-      const msg = ref('HI')
-      const Parent = defineComponent({
-        setup() {
-          return () =>
-            h(Comp, {
-              msg: msg.value,
-              msgModifiers: { upper: true },
-              'onUpdate:msg': val => {
-                msg.value = val
-              },
-            })
-        },
-      })
-
-      const root = nodeOps.createElement('div')
-      render(h(Parent), root)
-
-      // should be lowered
-      expect(serializeInner(root)).toBe('hi')
-
-      // child update
-      childMsg!.value = 'Hmm'
-
-      await nextTick()
-      expect(childMsg!.value).toBe('hmm')
-      expect(serializeInner(root)).toBe('hmm')
-      // parent should get uppercase value
-      expect(msg.value).toBe('HMM')
-
-      // parent update
-      msg.value = 'Ughh'
-      await nextTick()
-      expect(serializeInner(root)).toBe('ughh')
-      expect(msg.value).toBe('Ughh')
-
-      // child update again
-      childMsg!.value = 'ughh'
-      await nextTick()
-      expect(msg.value).toBe('UGHH')
-    })
-  })
-
   test('createPropsRestProxy', () => {
     const original = shallowReactive({
       foo: 1,
diff --git a/packages/runtime-core/__tests__/helpers/useModel.spec.ts b/packages/runtime-core/__tests__/helpers/useModel.spec.ts
new file mode 100644
index 00000000000..c02af337b87
--- /dev/null
+++ b/packages/runtime-core/__tests__/helpers/useModel.spec.ts
@@ -0,0 +1,529 @@
+import {
+  Fragment,
+  type Ref,
+  createApp,
+  createBlock,
+  createElementBlock,
+  createElementVNode,
+  createVNode,
+  defineComponent,
+  h,
+  nextTick,
+  nodeOps,
+  openBlock,
+  ref,
+  render,
+  serializeInner,
+  watch,
+} from '@vue/runtime-test'
+import { useModel } from '../../src/helpers/useModel'
+
+describe('useModel', () => {
+  test('basic', async () => {
+    let foo: any
+    const update = () => {
+      foo.value = 'bar'
+    }
+
+    const compRender = vi.fn()
+    const Comp = defineComponent({
+      props: ['modelValue'],
+      emits: ['update:modelValue'],
+      setup(props) {
+        foo = useModel(props, 'modelValue')
+        return () => {
+          compRender()
+          return foo.value
+        }
+      },
+    })
+
+    const msg = ref('')
+    const setValue = vi.fn(v => (msg.value = v))
+    const root = nodeOps.createElement('div')
+    createApp(() =>
+      h(Comp, {
+        modelValue: msg.value,
+        'onUpdate:modelValue': setValue,
+      }),
+    ).mount(root)
+
+    expect(foo.value).toBe('')
+    expect(msg.value).toBe('')
+    expect(setValue).not.toBeCalled()
+    expect(compRender).toBeCalledTimes(1)
+    expect(serializeInner(root)).toBe('')
+
+    // update from child
+    update()
+
+    await nextTick()
+    expect(msg.value).toBe('bar')
+    expect(foo.value).toBe('bar')
+    expect(setValue).toBeCalledTimes(1)
+    expect(compRender).toBeCalledTimes(2)
+    expect(serializeInner(root)).toBe('bar')
+
+    // update from parent
+    msg.value = 'qux'
+    expect(msg.value).toBe('qux')
+
+    await nextTick()
+    expect(msg.value).toBe('qux')
+    expect(foo.value).toBe('qux')
+    expect(setValue).toBeCalledTimes(1)
+    expect(compRender).toBeCalledTimes(3)
+    expect(serializeInner(root)).toBe('qux')
+  })
+
+  test('without parent value (local mutation)', async () => {
+    let foo: any
+    const update = () => {
+      foo.value = 'bar'
+    }
+
+    const compRender = vi.fn()
+    const Comp = defineComponent({
+      props: ['foo'],
+      emits: ['update:foo'],
+      setup(props) {
+        foo = useModel(props, 'foo')
+        return () => {
+          compRender()
+          return foo.value
+        }
+      },
+    })
+
+    const root = nodeOps.createElement('div')
+    const updateFoo = vi.fn()
+    render(h(Comp, { 'onUpdate:foo': updateFoo }), root)
+    expect(compRender).toBeCalledTimes(1)
+    expect(serializeInner(root)).toBe('<!---->')
+
+    expect(foo.value).toBeUndefined()
+    update()
+    // when parent didn't provide value, local mutation is enabled
+    expect(foo.value).toBe('bar')
+
+    await nextTick()
+    expect(updateFoo).toBeCalledTimes(1)
+    expect(compRender).toBeCalledTimes(2)
+    expect(serializeInner(root)).toBe('bar')
+  })
+
+  test('without parent listener (local mutation)', async () => {
+    let foo: any
+    const update = () => {
+      foo.value = 'bar'
+    }
+
+    const compRender = vi.fn()
+    const Comp = defineComponent({
+      props: ['foo'],
+      emits: ['update:foo'],
+      setup(props) {
+        foo = useModel(props, 'foo')
+        return () => {
+          compRender()
+          return foo.value
+        }
+      },
+    })
+
+    const root = nodeOps.createElement('div')
+    // provide initial value
+    render(h(Comp, { foo: 'initial' }), root)
+    expect(compRender).toBeCalledTimes(1)
+    expect(serializeInner(root)).toBe('initial')
+
+    expect(foo.value).toBe('initial')
+    update()
+    // when parent didn't provide value, local mutation is enabled
+    expect(foo.value).toBe('bar')
+
+    await nextTick()
+    expect(compRender).toBeCalledTimes(2)
+    expect(serializeInner(root)).toBe('bar')
+  })
+
+  test('kebab-case v-model (should not be local)', async () => {
+    let foo: any
+
+    const compRender = vi.fn()
+    const Comp = defineComponent({
+      props: ['fooBar'],
+      emits: ['update:fooBar'],
+      setup(props) {
+        foo = useModel(props, 'fooBar')
+        return () => {
+          compRender()
+          return foo.value
+        }
+      },
+    })
+
+    const updateFooBar = vi.fn()
+    const root = nodeOps.createElement('div')
+    // v-model:foo-bar compiles to foo-bar and onUpdate:fooBar
+    render(
+      h(Comp, { 'foo-bar': 'initial', 'onUpdate:fooBar': updateFooBar }),
+      root,
+    )
+    expect(compRender).toBeCalledTimes(1)
+    expect(serializeInner(root)).toBe('initial')
+
+    expect(foo.value).toBe('initial')
+    foo.value = 'bar'
+    // should not be using local mode, so nothing should actually change
+    expect(foo.value).toBe('initial')
+
+    await nextTick()
+    expect(compRender).toBeCalledTimes(1)
+    expect(updateFooBar).toBeCalledTimes(1)
+    expect(updateFooBar).toHaveBeenCalledWith('bar')
+    expect(foo.value).toBe('initial')
+    expect(serializeInner(root)).toBe('initial')
+  })
+
+  test('kebab-case update listener (should not be local)', async () => {
+    let foo: any
+
+    const compRender = vi.fn()
+    const Comp = defineComponent({
+      props: ['fooBar'],
+      emits: ['update:fooBar'],
+      setup(props) {
+        foo = useModel(props, 'fooBar')
+        return () => {
+          compRender()
+          return foo.value
+        }
+      },
+    })
+
+    const updateFooBar = vi.fn()
+    const root = nodeOps.createElement('div')
+    // The template compiler won't create hyphenated listeners, but it could have been passed manually
+    render(
+      h(Comp, { 'foo-bar': 'initial', 'onUpdate:foo-bar': updateFooBar }),
+      root,
+    )
+    expect(compRender).toBeCalledTimes(1)
+    expect(serializeInner(root)).toBe('initial')
+
+    expect(foo.value).toBe('initial')
+    foo.value = 'bar'
+    // should not be using local mode, so nothing should actually change
+    expect(foo.value).toBe('initial')
+
+    await nextTick()
+    expect(compRender).toBeCalledTimes(1)
+    expect(updateFooBar).toBeCalledTimes(1)
+    expect(updateFooBar).toHaveBeenCalledWith('bar')
+    expect(foo.value).toBe('initial')
+    expect(serializeInner(root)).toBe('initial')
+  })
+
+  test('default value', async () => {
+    let count: any
+    const inc = () => {
+      count.value++
+    }
+
+    const compRender = vi.fn()
+    const Comp = defineComponent({
+      props: { count: { default: 0 } },
+      emits: ['update:count'],
+      setup(props) {
+        count = useModel(props, 'count')
+        return () => {
+          compRender()
+          return count.value
+        }
+      },
+    })
+
+    const root = nodeOps.createElement('div')
+    const updateCount = vi.fn()
+    render(h(Comp, { 'onUpdate:count': updateCount }), root)
+    expect(compRender).toBeCalledTimes(1)
+    expect(serializeInner(root)).toBe('0')
+
+    expect(count.value).toBe(0)
+
+    inc()
+    // when parent didn't provide value, local mutation is enabled
+    expect(count.value).toBe(1)
+
+    await nextTick()
+
+    expect(updateCount).toBeCalledTimes(1)
+    expect(compRender).toBeCalledTimes(2)
+    expect(serializeInner(root)).toBe('1')
+  })
+
+  test('parent limiting child value', async () => {
+    let childCount: Ref<number>
+
+    const compRender = vi.fn()
+    const Comp = defineComponent({
+      props: ['count'],
+      emits: ['update:count'],
+      setup(props) {
+        childCount = useModel(props, 'count')
+        return () => {
+          compRender()
+          return childCount.value
+        }
+      },
+    })
+
+    const Parent = defineComponent({
+      setup() {
+        const count = ref(0)
+        watch(count, () => {
+          if (count.value < 0) {
+            count.value = 0
+          }
+        })
+        return () =>
+          h(Comp, {
+            count: count.value,
+            'onUpdate:count': val => {
+              count.value = val
+            },
+          })
+      },
+    })
+
+    const root = nodeOps.createElement('div')
+    render(h(Parent), root)
+    expect(serializeInner(root)).toBe('0')
+
+    // child update
+    childCount!.value = 1
+    // not yet updated
+    expect(childCount!.value).toBe(0)
+
+    await nextTick()
+    expect(childCount!.value).toBe(1)
+    expect(serializeInner(root)).toBe('1')
+
+    // child update to invalid value
+    childCount!.value = -1
+    // not yet updated
+    expect(childCount!.value).toBe(1)
+
+    await nextTick()
+    // limited to 0 by parent
+    expect(childCount!.value).toBe(0)
+    expect(serializeInner(root)).toBe('0')
+  })
+
+  test('has parent value -> no parent value', async () => {
+    let childCount: Ref<number>
+
+    const compRender = vi.fn()
+    const Comp = defineComponent({
+      props: ['count'],
+      emits: ['update:count'],
+      setup(props) {
+        childCount = useModel(props, 'count')
+        return () => {
+          compRender()
+          return childCount.value
+        }
+      },
+    })
+
+    const toggle = ref(true)
+    const Parent = defineComponent({
+      setup() {
+        const count = ref(0)
+        return () =>
+          toggle.value
+            ? h(Comp, {
+                count: count.value,
+                'onUpdate:count': val => {
+                  count.value = val
+                },
+              })
+            : h(Comp)
+      },
+    })
+
+    const root = nodeOps.createElement('div')
+    render(h(Parent), root)
+    expect(serializeInner(root)).toBe('0')
+
+    // child update
+    childCount!.value = 1
+    // not yet updated
+    expect(childCount!.value).toBe(0)
+
+    await nextTick()
+    expect(childCount!.value).toBe(1)
+    expect(serializeInner(root)).toBe('1')
+
+    // parent change
+    toggle.value = false
+
+    await nextTick()
+    // localValue should be reset
+    expect(childCount!.value).toBeUndefined()
+    expect(serializeInner(root)).toBe('<!---->')
+
+    // child local mutation should continue to work
+    childCount!.value = 2
+    expect(childCount!.value).toBe(2)
+
+    await nextTick()
+    expect(serializeInner(root)).toBe('2')
+  })
+
+  // #9838
+  test('pass modelValue to slot (optimized mode) ', async () => {
+    let foo: any
+    const update = () => {
+      foo.value = 'bar'
+    }
+
+    const Comp = {
+      render(this: any) {
+        return this.$slots.default()
+      },
+    }
+
+    const childRender = vi.fn()
+    const slotRender = vi.fn()
+    const Child = defineComponent({
+      props: ['modelValue'],
+      emits: ['update:modelValue'],
+      setup(props) {
+        foo = useModel(props, 'modelValue')
+        return () => {
+          childRender()
+          return (
+            openBlock(),
+            createElementBlock(Fragment, null, [
+              createVNode(Comp, null, {
+                default: () => {
+                  slotRender()
+                  return createElementVNode('div', null, foo.value)
+                },
+                _: 1 /* STABLE */,
+              }),
+            ])
+          )
+        }
+      },
+    })
+
+    const msg = ref('')
+    const setValue = vi.fn(v => (msg.value = v))
+    const root = nodeOps.createElement('div')
+    createApp({
+      render() {
+        return (
+          openBlock(),
+          createBlock(
+            Child,
+            {
+              modelValue: msg.value,
+              'onUpdate:modelValue': setValue,
+            },
+            null,
+            8 /* PROPS */,
+            ['modelValue'],
+          )
+        )
+      },
+    }).mount(root)
+
+    expect(foo.value).toBe('')
+    expect(msg.value).toBe('')
+    expect(setValue).not.toBeCalled()
+    expect(childRender).toBeCalledTimes(1)
+    expect(slotRender).toBeCalledTimes(1)
+    expect(serializeInner(root)).toBe('<div></div>')
+
+    // update from child
+    update()
+
+    await nextTick()
+    expect(msg.value).toBe('bar')
+    expect(foo.value).toBe('bar')
+    expect(setValue).toBeCalledTimes(1)
+    expect(childRender).toBeCalledTimes(2)
+    expect(slotRender).toBeCalledTimes(2)
+    expect(serializeInner(root)).toBe('<div>bar</div>')
+  })
+
+  test('with modifiers & transformers', async () => {
+    let childMsg: Ref<string>
+    let childModifiers: Record<string, true | undefined>
+
+    const compRender = vi.fn()
+    const Comp = defineComponent({
+      props: ['msg', 'msgModifiers'],
+      emits: ['update:msg'],
+      setup(props) {
+        ;[childMsg, childModifiers] = useModel(props, 'msg', {
+          get(val) {
+            return val.toLowerCase()
+          },
+          set(val) {
+            if (childModifiers.upper) {
+              return val.toUpperCase()
+            }
+          },
+        })
+        return () => {
+          compRender()
+          return childMsg.value
+        }
+      },
+    })
+
+    const msg = ref('HI')
+    const Parent = defineComponent({
+      setup() {
+        return () =>
+          h(Comp, {
+            msg: msg.value,
+            msgModifiers: { upper: true },
+            'onUpdate:msg': val => {
+              msg.value = val
+            },
+          })
+      },
+    })
+
+    const root = nodeOps.createElement('div')
+    render(h(Parent), root)
+
+    // should be lowered
+    expect(serializeInner(root)).toBe('hi')
+
+    // child update
+    childMsg!.value = 'Hmm'
+
+    await nextTick()
+    expect(childMsg!.value).toBe('hmm')
+    expect(serializeInner(root)).toBe('hmm')
+    // parent should get uppercase value
+    expect(msg.value).toBe('HMM')
+
+    // parent update
+    msg.value = 'Ughh'
+    await nextTick()
+    expect(serializeInner(root)).toBe('ughh')
+    expect(msg.value).toBe('Ughh')
+
+    // child update again
+    childMsg!.value = 'ughh'
+    await nextTick()
+    expect(msg.value).toBe('UGHH')
+  })
+})
diff --git a/packages/runtime-core/src/apiSetupHelpers.ts b/packages/runtime-core/src/apiSetupHelpers.ts
index 3815c7b143e..e5f79444da0 100644
--- a/packages/runtime-core/src/apiSetupHelpers.ts
+++ b/packages/runtime-core/src/apiSetupHelpers.ts
@@ -1,12 +1,8 @@
 import {
-  EMPTY_OBJ,
   type LooseRequired,
   type Prettify,
   type UnionToIntersection,
-  camelize,
   extend,
-  hasChanged,
-  hyphenate,
   isArray,
   isFunction,
   isPromise,
@@ -29,13 +25,11 @@ import type {
   ComponentObjectPropsOptions,
   ComponentPropsOptions,
   ExtractPropTypes,
-  NormalizedProps,
   PropOptions,
 } from './componentProps'
 import { warn } from './warning'
 import type { SlotsType, StrictUnwrapSlotsType } from './componentSlots'
-import { type Ref, customRef, ref } from '@vue/reactivity'
-import { watchSyncEffect } from '.'
+import type { Ref } from '@vue/reactivity'
 
 // dev only
 const warnRuntimeUsage = (method: string) =>
@@ -224,6 +218,11 @@ export function defineSlots<
 export type ModelRef<T, M extends string | number | symbol = string> = Ref<T> &
   [ModelRef<T, M>, Record<M, true | undefined>]
 
+export type DefineModelOptions<T = any> = {
+  get?: (v: T) => any
+  set?: (v: T) => any
+}
+
 /**
  * Vue `<script setup>` compiler macro for declaring a
  * two-way binding prop that can be consumed via `v-model` from the parent
@@ -258,25 +257,25 @@ export type ModelRef<T, M extends string | number | symbol = string> = Ref<T> &
  * ```
  */
 export function defineModel<T, M extends string | number | symbol = string>(
-  options: { required: true } & PropOptions<T> & UseModelOptions<T>,
+  options: { required: true } & PropOptions<T> & DefineModelOptions<T>,
 ): ModelRef<T, M>
 export function defineModel<T, M extends string | number | symbol = string>(
-  options: { default: any } & PropOptions<T> & UseModelOptions<T>,
+  options: { default: any } & PropOptions<T> & DefineModelOptions<T>,
 ): ModelRef<T, M>
 export function defineModel<T, M extends string | number | symbol = string>(
-  options?: PropOptions<T> & UseModelOptions<T>,
+  options?: PropOptions<T> & DefineModelOptions<T>,
 ): ModelRef<T | undefined, M>
 export function defineModel<T, M extends string | number | symbol = string>(
   name: string,
-  options: { required: true } & PropOptions<T> & UseModelOptions<T>,
+  options: { required: true } & PropOptions<T> & DefineModelOptions<T>,
 ): ModelRef<T, M>
 export function defineModel<T, M extends string | number | symbol = string>(
   name: string,
-  options: { default: any } & PropOptions<T> & UseModelOptions<T>,
+  options: { default: any } & PropOptions<T> & DefineModelOptions<T>,
 ): ModelRef<T, M>
 export function defineModel<T, M extends string | number | symbol = string>(
   name: string,
-  options?: PropOptions<T> & UseModelOptions<T>,
+  options?: PropOptions<T> & DefineModelOptions<T>,
 ): ModelRef<T | undefined, M>
 export function defineModel(): any {
   if (__DEV__) {
@@ -356,92 +355,6 @@ export function useAttrs(): SetupContext['attrs'] {
   return getContext().attrs
 }
 
-type UseModelOptions<T = any> = {
-  get?: (v: T) => any
-  set?: (v: T) => any
-}
-
-export function useModel<
-  M extends string | number | symbol,
-  T extends Record<string, any>,
-  K extends keyof T,
->(props: T, name: K, options?: UseModelOptions<T[K]>): ModelRef<T[K], M>
-export function useModel(
-  props: Record<string, any>,
-  name: string,
-  options: UseModelOptions = EMPTY_OBJ,
-): Ref {
-  const i = getCurrentInstance()!
-  if (__DEV__ && !i) {
-    warn(`useModel() called without active instance.`)
-    return ref() as any
-  }
-
-  if (__DEV__ && !(i.propsOptions[0] as NormalizedProps)[name]) {
-    warn(`useModel() called with prop "${name}" which is not declared.`)
-    return ref() as any
-  }
-
-  const camelizedName = camelize(name)
-  const hyphenatedName = hyphenate(name)
-
-  const res = customRef((track, trigger) => {
-    let localValue: any
-    watchSyncEffect(() => {
-      const propValue = props[name]
-      if (hasChanged(localValue, propValue)) {
-        localValue = propValue
-        trigger()
-      }
-    })
-    return {
-      get() {
-        track()
-        return options.get ? options.get(localValue) : localValue
-      },
-      set(value) {
-        const rawProps = i.vnode!.props
-        if (
-          !(
-            rawProps &&
-            // check if parent has passed v-model
-            (name in rawProps ||
-              camelizedName in rawProps ||
-              hyphenatedName in rawProps) &&
-            (`onUpdate:${name}` in rawProps ||
-              `onUpdate:${camelizedName}` in rawProps ||
-              `onUpdate:${hyphenatedName}` in rawProps)
-          ) &&
-          hasChanged(value, localValue)
-        ) {
-          localValue = value
-          trigger()
-        }
-        i.emit(`update:${name}`, options.set ? options.set(value) : value)
-      },
-    }
-  })
-
-  const modifierKey =
-    name === 'modelValue' ? 'modelModifiers' : `${name}Modifiers`
-
-  // @ts-expect-error
-  res[Symbol.iterator] = () => {
-    let i = 0
-    return {
-      next() {
-        if (i < 2) {
-          return { value: i++ ? props[modifierKey] || {} : res, done: false }
-        } else {
-          return { done: true }
-        }
-      },
-    }
-  }
-
-  return res
-}
-
 function getContext(): SetupContext {
   const i = getCurrentInstance()!
   if (__DEV__ && !i) {
diff --git a/packages/runtime-core/src/helpers/useModel.ts b/packages/runtime-core/src/helpers/useModel.ts
new file mode 100644
index 00000000000..b2670e576e4
--- /dev/null
+++ b/packages/runtime-core/src/helpers/useModel.ts
@@ -0,0 +1,88 @@
+import { type Ref, customRef, ref } from '@vue/reactivity'
+import { EMPTY_OBJ, camelize, hasChanged, hyphenate } from '@vue/shared'
+import type { DefineModelOptions, ModelRef } from '../apiSetupHelpers'
+import { getCurrentInstance } from '../component'
+import { warn } from '../warning'
+import type { NormalizedProps } from '../componentProps'
+import { watchSyncEffect } from '../apiWatch'
+
+export function useModel<
+  M extends string | number | symbol,
+  T extends Record<string, any>,
+  K extends keyof T,
+>(props: T, name: K, options?: DefineModelOptions<T[K]>): ModelRef<T[K], M>
+export function useModel(
+  props: Record<string, any>,
+  name: string,
+  options: DefineModelOptions = EMPTY_OBJ,
+): Ref {
+  const i = getCurrentInstance()!
+  if (__DEV__ && !i) {
+    warn(`useModel() called without active instance.`)
+    return ref() as any
+  }
+
+  if (__DEV__ && !(i.propsOptions[0] as NormalizedProps)[name]) {
+    warn(`useModel() called with prop "${name}" which is not declared.`)
+    return ref() as any
+  }
+
+  const camelizedName = camelize(name)
+  const hyphenatedName = hyphenate(name)
+
+  const res = customRef((track, trigger) => {
+    let localValue: any
+    watchSyncEffect(() => {
+      const propValue = props[name]
+      if (hasChanged(localValue, propValue)) {
+        localValue = propValue
+        trigger()
+      }
+    })
+    return {
+      get() {
+        track()
+        return options.get ? options.get(localValue) : localValue
+      },
+      set(value) {
+        const rawProps = i.vnode!.props
+        if (
+          !(
+            rawProps &&
+            // check if parent has passed v-model
+            (name in rawProps ||
+              camelizedName in rawProps ||
+              hyphenatedName in rawProps) &&
+            (`onUpdate:${name}` in rawProps ||
+              `onUpdate:${camelizedName}` in rawProps ||
+              `onUpdate:${hyphenatedName}` in rawProps)
+          ) &&
+          hasChanged(value, localValue)
+        ) {
+          localValue = value
+          trigger()
+        }
+        i.emit(`update:${name}`, options.set ? options.set(value) : value)
+      },
+    }
+  })
+
+  const modifierKey =
+    name === 'modelValue' ? 'modelModifiers' : `${name}Modifiers`
+
+  // @ts-expect-error
+  res[Symbol.iterator] = () => {
+    let i = 0
+    return {
+      next() {
+        if (i < 2) {
+          return { value: i++ ? props[modifierKey] || {} : res, done: false }
+        } else {
+          return { done: true }
+        }
+      },
+    }
+  }
+
+  return res
+}
diff --git a/packages/runtime-core/src/index.ts b/packages/runtime-core/src/index.ts
index 8e49771d3c1..13345b78a45 100644
--- a/packages/runtime-core/src/index.ts
+++ b/packages/runtime-core/src/index.ts
@@ -61,6 +61,7 @@ export { nextTick } from './scheduler'
 export { defineComponent } from './apiDefineComponent'
 export { defineAsyncComponent } from './apiAsyncComponent'
 export { useAttrs, useSlots } from './apiSetupHelpers'
+export { useModel } from './helpers/useModel'
 
 // <script setup> API ----------------------------------------------------------
 
@@ -73,7 +74,6 @@ export {
   defineSlots,
   defineModel,
   withDefaults,
-  useModel,
   type DefineProps,
   type ModelRef,
 } from './apiSetupHelpers'

From bceccf9e21ea13c20c096cb352f0bed5ada52f1d Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Thu, 11 Jan 2024 18:24:21 +0800
Subject: [PATCH 7/9] chore(build): rename __NODE_JS__ build flag to __CJS__

---
 packages/compiler-sfc/src/script/resolveType.ts    |  4 ++--
 packages/global.d.ts                               |  2 +-
 packages/runtime-core/src/index.ts                 |  2 +-
 packages/server-renderer/src/helpers/ssrCompile.ts |  2 +-
 packages/server-renderer/src/renderToStream.ts     |  2 +-
 rollup.config.js                                   | 10 +++++-----
 scripts/dev.js                                     |  2 +-
 vitest.config.ts                                   |  2 +-
 8 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/packages/compiler-sfc/src/script/resolveType.ts b/packages/compiler-sfc/src/script/resolveType.ts
index 3f965e99735..548d5d13c6d 100644
--- a/packages/compiler-sfc/src/script/resolveType.ts
+++ b/packages/compiler-sfc/src/script/resolveType.ts
@@ -908,7 +908,7 @@ function importSourceToScope(
       resolved = resolveExt(filename, fs)
     } else {
       // module or aliased import - use full TS resolution, only supported in Node
-      if (!__NODE_JS__) {
+      if (!__CJS__) {
         return ctx.error(
           `Type import from non-relative sources is not supported in the browser build.`,
           node,
@@ -975,7 +975,7 @@ function resolveWithTS(
   ts: typeof TS,
   fs: FS,
 ): string | undefined {
-  if (!__NODE_JS__) return
+  if (!__CJS__) return
 
   // 1. resolve tsconfig.json
   const configPath = ts.findConfigFile(containingFile, fs.fileExists)
diff --git a/packages/global.d.ts b/packages/global.d.ts
index 1367b69cd5b..704f6d0220d 100644
--- a/packages/global.d.ts
+++ b/packages/global.d.ts
@@ -7,7 +7,7 @@ declare var __BROWSER__: boolean
 declare var __GLOBAL__: boolean
 declare var __ESM_BUNDLER__: boolean
 declare var __ESM_BROWSER__: boolean
-declare var __NODE_JS__: boolean
+declare var __CJS__: boolean
 declare var __SSR__: boolean
 declare var __COMMIT__: string
 declare var __VERSION__: string
diff --git a/packages/runtime-core/src/index.ts b/packages/runtime-core/src/index.ts
index 13345b78a45..7d9bd102fb3 100644
--- a/packages/runtime-core/src/index.ts
+++ b/packages/runtime-core/src/index.ts
@@ -150,7 +150,7 @@ import { ErrorTypeStrings as _ErrorTypeStrings } from './errorHandling'
  * @internal
  */
 export const ErrorTypeStrings = (
-  __ESM_BUNDLER__ || __NODE_JS__ || __DEV__ ? _ErrorTypeStrings : null
+  __ESM_BUNDLER__ || __CJS__ || __DEV__ ? _ErrorTypeStrings : null
 ) as typeof _ErrorTypeStrings
 
 // For devtools
diff --git a/packages/server-renderer/src/helpers/ssrCompile.ts b/packages/server-renderer/src/helpers/ssrCompile.ts
index 6ab296976ac..8412a65e843 100644
--- a/packages/server-renderer/src/helpers/ssrCompile.ts
+++ b/packages/server-renderer/src/helpers/ssrCompile.ts
@@ -24,7 +24,7 @@ export function ssrCompile(
   instance: ComponentInternalInstance,
 ): SSRRenderFunction {
   // TODO: this branch should now work in ESM builds, enable it in a minor
-  if (!__NODE_JS__) {
+  if (!__CJS__) {
     throw new Error(
       `On-the-fly template compilation is not supported in the ESM build of ` +
         `@vue/server-renderer. All templates must be pre-compiled into ` +
diff --git a/packages/server-renderer/src/renderToStream.ts b/packages/server-renderer/src/renderToStream.ts
index 828e385cb90..60b277a4a9b 100644
--- a/packages/server-renderer/src/renderToStream.ts
+++ b/packages/server-renderer/src/renderToStream.ts
@@ -108,7 +108,7 @@ export function renderToNodeStream(
   input: App | VNode,
   context: SSRContext = {},
 ): Readable {
-  const stream: Readable = __NODE_JS__
+  const stream: Readable = __CJS__
     ? new (require('node:stream').Readable)({ read() {} })
     : null
 
diff --git a/rollup.config.js b/rollup.config.js
index b6a098fa69e..657b711b1a3 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -122,7 +122,7 @@ function createConfig(format, output, plugins = []) {
   const isBundlerESMBuild = /esm-bundler/.test(format)
   const isBrowserESMBuild = /esm-browser/.test(format)
   const isServerRenderer = name === 'server-renderer'
-  const isNodeBuild = format === 'cjs'
+  const isCJSBuild = format === 'cjs'
   const isGlobalBuild = /global/.test(format)
   const isCompatPackage =
     pkg.name === '@vue/compat' || pkg.name === '@vue/compat-canary'
@@ -138,7 +138,7 @@ function createConfig(format, output, plugins = []) {
 **/`
 
   output.exports = isCompatPackage ? 'auto' : 'named'
-  if (isNodeBuild) {
+  if (isCJSBuild) {
     output.esModule = true
   }
   output.sourcemap = !!process.env.SOURCE_MAP
@@ -172,9 +172,9 @@ function createConfig(format, output, plugins = []) {
       __ESM_BUNDLER__: String(isBundlerESMBuild),
       __ESM_BROWSER__: String(isBrowserESMBuild),
       // is targeting Node (SSR)?
-      __NODE_JS__: String(isNodeBuild),
+      __CJS__: String(isCJSBuild),
       // need SSR-specific branches?
-      __SSR__: String(isNodeBuild || isBundlerESMBuild || isServerRenderer),
+      __SSR__: String(isCJSBuild || isBundlerESMBuild || isServerRenderer),
 
       // 2.x compat build
       __COMPAT__: String(isCompatBuild),
@@ -329,7 +329,7 @@ function createConfig(format, output, plugins = []) {
         tsconfig: path.resolve(__dirname, 'tsconfig.json'),
         sourceMap: output.sourcemap,
         minify: false,
-        target: isServerRenderer || isNodeBuild ? 'es2019' : 'es2015',
+        target: isServerRenderer || isCJSBuild ? 'es2019' : 'es2015',
         define: resolveDefine(),
       }),
       ...resolveNodePlugins(),
diff --git a/scripts/dev.js b/scripts/dev.js
index 2c3cdaf95e2..b015835ab4f 100644
--- a/scripts/dev.js
+++ b/scripts/dev.js
@@ -119,7 +119,7 @@ esbuild
       __GLOBAL__: String(format === 'global'),
       __ESM_BUNDLER__: String(format.includes('esm-bundler')),
       __ESM_BROWSER__: String(format.includes('esm-browser')),
-      __NODE_JS__: String(format === 'cjs'),
+      __CJS__: String(format === 'cjs'),
       __SSR__: String(format === 'cjs' || format.includes('esm-bundler')),
       __COMPAT__: String(target === 'vue-compat'),
       __FEATURE_SUSPENSE__: `true`,
diff --git a/vitest.config.ts b/vitest.config.ts
index 6b5b93a45f9..e6436408adb 100644
--- a/vitest.config.ts
+++ b/vitest.config.ts
@@ -11,7 +11,7 @@ export default defineConfig({
     __GLOBAL__: false,
     __ESM_BUNDLER__: true,
     __ESM_BROWSER__: false,
-    __NODE_JS__: true,
+    __CJS__: true,
     __SSR__: true,
     __FEATURE_OPTIONS_API__: true,
     __FEATURE_SUSPENSE__: true,

From dfd9654665890d1bc7129f6e3c2faaa5b1f28f72 Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Thu, 11 Jan 2024 18:30:23 +0800
Subject: [PATCH 8/9] fix(build): avoid accessing __FEATURE_PROD_DEVTOOLS__
 flag in root scope

---
 packages/runtime-core/src/index.ts | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/runtime-core/src/index.ts b/packages/runtime-core/src/index.ts
index 7d9bd102fb3..7fbe58446f7 100644
--- a/packages/runtime-core/src/index.ts
+++ b/packages/runtime-core/src/index.ts
@@ -161,13 +161,13 @@ import {
 } from './devtools'
 
 export const devtools = (
-  __DEV__ || __FEATURE_PROD_DEVTOOLS__ ? _devtools : undefined
+  __DEV__ || __ESM_BUNDLER__ ? _devtools : undefined
 ) as DevtoolsHook
 export const setDevtoolsHook = (
-  __DEV__ || __FEATURE_PROD_DEVTOOLS__ ? _setDevtoolsHook : NOOP
+  __DEV__ || __ESM_BUNDLER__ ? _setDevtoolsHook : NOOP
 ) as typeof _setDevtoolsHook
 
-// Types -------------------------------------------------------------------------
+// Types -----------------------------------------------------------------------
 
 import type { VNode } from './vnode'
 import type { ComponentInternalInstance } from './component'

From 9636357c89f99c55d8aa3bfde4403c8b5d6f5168 Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Thu, 11 Jan 2024 18:49:05 +0800
Subject: [PATCH 9/9] release: v3.4.9

---
 CHANGELOG.md                          | 12 ++++++++++++
 package.json                          |  2 +-
 packages/compiler-core/package.json   |  2 +-
 packages/compiler-dom/package.json    |  2 +-
 packages/compiler-sfc/package.json    |  2 +-
 packages/compiler-ssr/package.json    |  2 +-
 packages/reactivity/package.json      |  2 +-
 packages/runtime-core/package.json    |  2 +-
 packages/runtime-dom/package.json     |  2 +-
 packages/server-renderer/package.json |  2 +-
 packages/shared/package.json          |  2 +-
 packages/vue-compat/package.json      |  2 +-
 packages/vue/package.json             |  2 +-
 13 files changed, 24 insertions(+), 12 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index ba455123e78..611119d27ed 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,15 @@
+## [3.4.9](https://github.com/vuejs/core/compare/v3.4.8...v3.4.9) (2024-01-11)
+
+
+### Bug Fixes
+
+* **build:** avoid accessing __FEATURE_PROD_DEVTOOLS__ flag in root scope ([dfd9654](https://github.com/vuejs/core/commit/dfd9654665890d1bc7129f6e3c2faaa5b1f28f72))
+* **hydration:** do not warn against bindings w/ object values ([dcc68ef](https://github.com/vuejs/core/commit/dcc68ef7d48973abd8dd3178b46e50e3b0785ea4))
+* **runtime-dom:** unify behavior for v-show + style display binding ([#10075](https://github.com/vuejs/core/issues/10075)) ([cd419ae](https://github.com/vuejs/core/commit/cd419aec3cb615eaea8b2324356f38f4c0ff1fcc)), closes [#10074](https://github.com/vuejs/core/issues/10074)
+* **suspense:** avoid double-patching nested suspense when parent suspense is not resolved ([#10055](https://github.com/vuejs/core/issues/10055)) ([bcda96b](https://github.com/vuejs/core/commit/bcda96b525801eb7a1d397300fb3f2f9b827ddfb)), closes [#8678](https://github.com/vuejs/core/issues/8678)
+
+
+
 ## [3.4.8](https://github.com/vuejs/core/compare/v3.4.7...v3.4.8) (2024-01-10)
 
 
diff --git a/package.json b/package.json
index 5b2ff985720..73cb0d0d692 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "private": true,
-  "version": "3.4.8",
+  "version": "3.4.9",
   "packageManager": "pnpm@8.14.0",
   "type": "module",
   "scripts": {
diff --git a/packages/compiler-core/package.json b/packages/compiler-core/package.json
index d5ef8b4d300..78d3e6c0bd3 100644
--- a/packages/compiler-core/package.json
+++ b/packages/compiler-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vue/compiler-core",
-  "version": "3.4.8",
+  "version": "3.4.9",
   "description": "@vue/compiler-core",
   "main": "index.js",
   "module": "dist/compiler-core.esm-bundler.js",
diff --git a/packages/compiler-dom/package.json b/packages/compiler-dom/package.json
index bc7b9a8c65b..20e537385f2 100644
--- a/packages/compiler-dom/package.json
+++ b/packages/compiler-dom/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vue/compiler-dom",
-  "version": "3.4.8",
+  "version": "3.4.9",
   "description": "@vue/compiler-dom",
   "main": "index.js",
   "module": "dist/compiler-dom.esm-bundler.js",
diff --git a/packages/compiler-sfc/package.json b/packages/compiler-sfc/package.json
index 1c02868772e..4d3ec8d8456 100644
--- a/packages/compiler-sfc/package.json
+++ b/packages/compiler-sfc/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vue/compiler-sfc",
-  "version": "3.4.8",
+  "version": "3.4.9",
   "description": "@vue/compiler-sfc",
   "main": "dist/compiler-sfc.cjs.js",
   "module": "dist/compiler-sfc.esm-browser.js",
diff --git a/packages/compiler-ssr/package.json b/packages/compiler-ssr/package.json
index 0c9c67bcb15..6c2e4e90058 100644
--- a/packages/compiler-ssr/package.json
+++ b/packages/compiler-ssr/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vue/compiler-ssr",
-  "version": "3.4.8",
+  "version": "3.4.9",
   "description": "@vue/compiler-ssr",
   "main": "dist/compiler-ssr.cjs.js",
   "types": "dist/compiler-ssr.d.ts",
diff --git a/packages/reactivity/package.json b/packages/reactivity/package.json
index ed7928c1213..bd38a556391 100644
--- a/packages/reactivity/package.json
+++ b/packages/reactivity/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vue/reactivity",
-  "version": "3.4.8",
+  "version": "3.4.9",
   "description": "@vue/reactivity",
   "main": "index.js",
   "module": "dist/reactivity.esm-bundler.js",
diff --git a/packages/runtime-core/package.json b/packages/runtime-core/package.json
index 28a72a46e3f..2f98ec6a0a0 100644
--- a/packages/runtime-core/package.json
+++ b/packages/runtime-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vue/runtime-core",
-  "version": "3.4.8",
+  "version": "3.4.9",
   "description": "@vue/runtime-core",
   "main": "index.js",
   "module": "dist/runtime-core.esm-bundler.js",
diff --git a/packages/runtime-dom/package.json b/packages/runtime-dom/package.json
index 3c2d8e2e3ee..a5f4ee6ecbe 100644
--- a/packages/runtime-dom/package.json
+++ b/packages/runtime-dom/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vue/runtime-dom",
-  "version": "3.4.8",
+  "version": "3.4.9",
   "description": "@vue/runtime-dom",
   "main": "index.js",
   "module": "dist/runtime-dom.esm-bundler.js",
diff --git a/packages/server-renderer/package.json b/packages/server-renderer/package.json
index 3ff0817c694..6097211b735 100644
--- a/packages/server-renderer/package.json
+++ b/packages/server-renderer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vue/server-renderer",
-  "version": "3.4.8",
+  "version": "3.4.9",
   "description": "@vue/server-renderer",
   "main": "index.js",
   "module": "dist/server-renderer.esm-bundler.js",
diff --git a/packages/shared/package.json b/packages/shared/package.json
index 3e21d4a3b99..3fe7d111d9e 100644
--- a/packages/shared/package.json
+++ b/packages/shared/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vue/shared",
-  "version": "3.4.8",
+  "version": "3.4.9",
   "description": "internal utils shared across @vue packages",
   "main": "index.js",
   "module": "dist/shared.esm-bundler.js",
diff --git a/packages/vue-compat/package.json b/packages/vue-compat/package.json
index 46d0bd9600e..d473b550b36 100644
--- a/packages/vue-compat/package.json
+++ b/packages/vue-compat/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vue/compat",
-  "version": "3.4.8",
+  "version": "3.4.9",
   "description": "Vue 3 compatibility build for Vue 2",
   "main": "index.js",
   "module": "dist/vue.runtime.esm-bundler.js",
diff --git a/packages/vue/package.json b/packages/vue/package.json
index a686179d48d..e6ad4537a47 100644
--- a/packages/vue/package.json
+++ b/packages/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue",
-  "version": "3.4.8",
+  "version": "3.4.9",
   "description": "The progressive JavaScript framework for building modern web UI.",
   "main": "index.js",
   "module": "dist/vue.runtime.esm-bundler.js",