Merge branch 'main' into fix/5168

.eslintrc.cjs

@@ -1,3 +1,5 @@
+/* eslint-disable no-restricted-globals */
+
 const DOMGlobals = ['window', 'document']
 const NodeGlobals = ['module', 'require']
 
@@ -9,12 +11,6 @@ module.exports = {
   plugins: ['jest'],
   rules: {
     'no-debugger': 'error',
-    'no-unused-vars': [
-      'error',
-      // we are only using this rule to check for unused arguments since TS
-      // catches unused variables but not args.
-      { varsIgnorePattern: '.*', args: 'none' }
-    ],
     // most of the codebase are expected to be env agnostic
     'no-restricted-globals': ['error', ...DOMGlobals, ...NodeGlobals],
 
@@ -72,6 +68,14 @@ module.exports = {
         'no-restricted-syntax': 'off'
       }
     },
+    // JavaScript files
+    {
+      files: ['*.js', '*.cjs'],
+      rules: {
+        // We only do `no-unused-vars` checks for js files, TS files are checked by TypeScript itself.
+        'no-unused-vars': ['error', { vars: 'all', args: 'none' }]
+      }
+    },
     // Node scripts
     {
       files: ['scripts/**', '*.{js,ts}', 'packages/**/index.js'],

.github/workflows/canary.yml

@@ -17,10 +17,10 @@ jobs:
       - name: Install pnpm
         uses: pnpm/action-setup@v2
 
-      - name: Set node version to 18
+      - name: Install Node.js
         uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version-file: '.node-version'
           registry-url: 'https://registry.npmjs.org'
           cache: 'pnpm'
 

.github/workflows/ci.yml

@@ -22,10 +22,10 @@ jobs:
       - name: Install pnpm
         uses: pnpm/action-setup@v2
 
-      - name: Set node version to 18
+      - name: Install Node.js
         uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version-file: '.node-version'
           cache: 'pnpm'
 
       - run: pnpm install
@@ -44,10 +44,10 @@ jobs:
       - name: Install pnpm
         uses: pnpm/action-setup@v2
 
-      - name: Set node version to 18
+      - name: Install Node.js
         uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version-file: '.node-version'
           cache: 'pnpm'
 
       - run: pnpm install
@@ -73,14 +73,14 @@ jobs:
       - name: Install pnpm
         uses: pnpm/action-setup@v2
 
-      - name: Set node version to 18
+      - name: Install Node.js
         uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version-file: '.node-version'
           cache: 'pnpm'
 
       - run: pnpm install
-      - run: node node_modules/puppeteer/install.js
+      - run: node node_modules/puppeteer/install.mjs
 
       - name: Run e2e tests
         run: pnpm run test-e2e
@@ -96,10 +96,10 @@ jobs:
       - name: Install pnpm
         uses: pnpm/action-setup@v2
 
-      - name: Set node version to 18
+      - name: Install Node.js
         uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version-file: '.node-version'
           cache: 'pnpm'
 
       - run: pnpm install

.github/workflows/size-data.yml

@@ -24,10 +24,10 @@ jobs:
       - name: Install pnpm
         uses: pnpm/action-setup@v2
 
-      - name: Set node version to LTS
+      - name: Install Node.js
         uses: actions/setup-node@v3
         with:
-          node-version: lts/*
+          node-version-file: '.node-version'
           cache: pnpm
 
       - name: Install dependencies

.github/workflows/size-report.yml

@@ -26,10 +26,10 @@ jobs:
       - name: Install pnpm
         uses: pnpm/action-setup@v2
 
-      - name: Set node version to LTS
+      - name: Install Node.js
         uses: actions/setup-node@v3
         with:
-          node-version: lts/*
+          node-version-file: '.node-version'
           cache: pnpm
 
       - name: Install dependencies

.node-version

@@ -0,0 +1 @@
+20

CHANGELOG.md

@@ -1,9 +1,30 @@
+## [3.3.6](https://github.com/vuejs/core/compare/v3.3.5...v3.3.6) (2023-10-20)
+
+
+### Bug Fixes
+
+* **compiler-sfc:** model name conflict ([#8798](https://github.com/vuejs/core/issues/8798)) ([df81da8](https://github.com/vuejs/core/commit/df81da8be97c8a1366563c7e3e01076ef02eb8f7))
+* **compiler-sfc:** support asset paths containing spaces ([#8752](https://github.com/vuejs/core/issues/8752)) ([36c99a9](https://github.com/vuejs/core/commit/36c99a9c6bb6bc306be054c3c8a85ff8ce50605a))
+* **compiler-ssr:** fix missing scopeId on server-rendered TransitionGroup ([#7557](https://github.com/vuejs/core/issues/7557)) ([61c1357](https://github.com/vuejs/core/commit/61c135742795aa5e3189a79c7dec6afa21bbc8d9)), closes [#7554](https://github.com/vuejs/core/issues/7554)
+* **compiler-ssr:** fix ssr compile error for select with non-option children ([#9442](https://github.com/vuejs/core/issues/9442)) ([cdb2e72](https://github.com/vuejs/core/commit/cdb2e725e7ea297f1f4180fb04889a3b757bc84e)), closes [#9440](https://github.com/vuejs/core/issues/9440)
+* **runtime-core:** delete stale slots which are present but undefined ([#6484](https://github.com/vuejs/core/issues/6484)) ([75b8722](https://github.com/vuejs/core/commit/75b872213574cb37e2c9e8a15f65613f867ca9a6)), closes [#9109](https://github.com/vuejs/core/issues/9109)
+* **runtime-core:** fix error when using cssvars with disabled teleport ([#7341](https://github.com/vuejs/core/issues/7341)) ([8f0472c](https://github.com/vuejs/core/commit/8f0472c9abedb337dc256143b69d8ab8759dbf5c)), closes [#7342](https://github.com/vuejs/core/issues/7342)
+* **teleport:** ensure descendent component would be unmounted correctly ([#6529](https://github.com/vuejs/core/issues/6529)) ([4162311](https://github.com/vuejs/core/commit/4162311efdb0db5ca458542e1604b19efa2fae0e)), closes [#6347](https://github.com/vuejs/core/issues/6347)
+* **types:** support contenteditable="plaintext-only" ([#8796](https://github.com/vuejs/core/issues/8796)) ([26ca89e](https://github.com/vuejs/core/commit/26ca89e5cf734fbef81e182050d2a215ec8a437b))
+
+
+### Performance Improvements
+
+* replace Map/Set with WeakMap/WeakSet ([#8549](https://github.com/vuejs/core/issues/8549)) ([712f96d](https://github.com/vuejs/core/commit/712f96d6ac4d3d984732cba448cb84624daba850))
+
+
+
 ## [3.3.5](https://github.com/vuejs/core/compare/v3.3.4...v3.3.5) (2023-10-20)
 
 
 ### Bug Fixes
 
-* add isGloballyWhitelisted back, but deprecated ([#8556](https://github.com/vuejs/core/issues/8556)) ([63dfe8e](https://github.com/vuejs/core/commit/63dfe8eab499979bcc2f7829e82464e13899c895)), closes [/github.com/vuejs/core/issues/8416#issuecomment-1566583260](https://github.com//github.com/vuejs/core/issues/8416/issues/issuecomment-1566583260)
+* add isGloballyWhitelisted back, but deprecated ([#8556](https://github.com/vuejs/core/issues/8556)) ([63dfe8e](https://github.com/vuejs/core/commit/63dfe8eab499979bcc2f7829e82464e13899c895)), closes [#8416](https://github.com/vuejs/core/issues/8416)
 * **build:** disable useDefineForClassFields in esbuild ([#9252](https://github.com/vuejs/core/issues/9252)) ([6d14fa8](https://github.com/vuejs/core/commit/6d14fa88e85d4c9e264be394ddb37a54ca6738a8))
 * **compat:** return value of vue compat set() ([#9377](https://github.com/vuejs/core/issues/9377)) ([e3c2d69](https://github.com/vuejs/core/commit/e3c2d699f694d9500ddee78571172a24f0e3b17a))
 * **compiler-sfc:** don't hoist props and emit ([#8535](https://github.com/vuejs/core/issues/8535)) ([24db951](https://github.com/vuejs/core/commit/24db9516d8b4857182ec1a3af86cb7346691679b)), closes [#7805](https://github.com/vuejs/core/issues/7805) [#7812](https://github.com/vuejs/core/issues/7812)

package.json

@@ -1,6 +1,6 @@
 {
   "private": true,
-  "version": "3.3.5",
+  "version": "3.3.6",
   "packageManager": "pnpm@8.9.2",
   "type": "module",
   "scripts": {
@@ -66,16 +66,16 @@
     "@rollup/plugin-replace": "^5.0.4",
     "@rollup/plugin-terser": "^0.4.4",
     "@types/hash-sum": "^1.0.1",
-    "@types/node": "^18.18.6",
+    "@types/node": "^20.8.7",
     "@typescript-eslint/parser": "^6.8.0",
-    "@vitest/coverage-istanbul": "^0.34.4",
+    "@vitest/coverage-istanbul": "^0.34.6",
     "@vue/consolidate": "0.17.3",
     "conventional-changelog-cli": "^4.1.0",
     "enquirer": "^2.4.1",
     "esbuild": "^0.19.5",
     "esbuild-plugin-polyfill-node": "^0.3.0",
-    "eslint": "^8.51.0",
-    "eslint-plugin-jest": "^27.4.2",
+    "eslint": "^8.52.0",
+    "eslint-plugin-jest": "^27.4.3",
     "estree-walker": "^2.0.2",
     "execa": "^8.0.1",
     "jsdom": "^22.1.0",
@@ -90,21 +90,21 @@
     "prettier": "^3.0.3",
     "pretty-bytes": "^6.1.1",
     "pug": "^3.0.2",
-    "puppeteer": "~21.2.1",
+    "puppeteer": "~21.4.0",
     "rimraf": "^5.0.5",
-    "rollup": "^3.29.4",
+    "rollup": "^4.1.4",
     "rollup-plugin-dts": "^6.1.0",
     "rollup-plugin-esbuild": "^6.1.0",
     "rollup-plugin-polyfill-node": "^0.12.0",
     "semver": "^7.5.4",
     "serve": "^14.2.1",
     "simple-git-hooks": "^2.9.0",
     "terser": "^5.22.0",
-    "todomvc-app-css": "^2.4.2",
+    "todomvc-app-css": "^2.4.3",
     "tslib": "^2.6.2",
     "tsx": "^3.14.0",
-    "typescript": "^5.1.6",
-    "vite": "^4.3.0",
-    "vitest": "^0.34.4"
+    "typescript": "^5.2.2",
+    "vite": "^4.5.0",
+    "vitest": "^0.34.6"
   }
 }

packages/compiler-core/__tests__/transforms/hoistStatic.spec.ts

@@ -593,5 +593,17 @@ describe('compiler: hoistStatic transform', () => {
       expect(root.hoists.length).toBe(2)
       expect(generate(root).code).toMatchSnapshot()
     })
+
+    test('clone hoisted array children in HMR mode', () => {
+      const root = transformWithHoist(`<div><span class="hi"></span></div>`, {
+        hmr: true
+      })
+      expect(root.hoists.length).toBe(2)
+      expect(root.codegenNode).toMatchObject({
+        children: {
+          content: '[..._hoisted_2]'
+        }
+      })
+    })
   })
 })

packages/compiler-core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vue/compiler-core",
-  "version": "3.3.5",
+  "version": "3.3.6",
   "description": "@vue/compiler-core",
   "main": "index.js",
   "module": "dist/compiler-core.esm-bundler.js",
@@ -33,7 +33,7 @@
   "homepage": "https://github.com/vuejs/core/tree/main/packages/compiler-core#readme",
   "dependencies": {
     "@babel/parser": "^7.23.0",
-    "@vue/shared": "3.3.5",
+    "@vue/shared": "3.3.6",
     "estree-walker": "^2.0.2",
     "source-map-js": "^1.0.2"
   },

packages/compiler-core/src/options.ts

@@ -256,6 +256,12 @@ export interface TransformOptions
    * needed to render inline CSS variables on component root
    */
   ssrCssVars?: string
+  /**
+   * Whether to compile the template assuming it needs to handle HMR.
+   * Some edge cases may need to generate different code for HMR to work
+   * correctly, e.g. #6938, #7138
+   */
+  hmr?: boolean
 }
 
 export interface CodegenOptions extends SharedTransformCodegenOptions {

packages/compiler-core/src/transform.ts

@@ -117,7 +117,7 @@ export interface TransformContext
   removeIdentifiers(exp: ExpressionNode | string): void
   hoist(exp: string | JSChildNode | ArrayExpression): SimpleExpressionNode
   cache<T extends JSChildNode>(exp: T, isVNode?: boolean): CacheExpression | T
-  constantCache: Map<TemplateChildNode, ConstantTypes>
+  constantCache: WeakMap<TemplateChildNode, ConstantTypes>
 
   // 2.x Compat only
   filters?: Set<string>
@@ -129,6 +129,7 @@ export function createTransformContext(
     filename = '',
     prefixIdentifiers = false,
     hoistStatic = false,
+    hmr = false,
     cacheHandlers = false,
     nodeTransforms = [],
     directiveTransforms = {},
@@ -155,6 +156,7 @@ export function createTransformContext(
     selfName: nameMatch && capitalize(camelize(nameMatch[1])),
     prefixIdentifiers,
     hoistStatic,
+    hmr,
     cacheHandlers,
     nodeTransforms,
     directiveTransforms,
@@ -181,7 +183,7 @@ export function createTransformContext(
     directives: new Set(),
     hoists: [],
     imports: [],
-    constantCache: new Map(),
+    constantCache: new WeakMap(),
     temps: 0,
     cached: 0,
     identifiers: Object.create(null),

packages/compiler-core/src/transforms/hoistStatic.ts

@@ -140,9 +140,16 @@ function walk(
     node.codegenNode.type === NodeTypes.VNODE_CALL &&
     isArray(node.codegenNode.children)
   ) {
-    node.codegenNode.children = context.hoist(
+    const hoisted = context.hoist(
       createArrayExpression(node.codegenNode.children)
     )
+    // #6978, #7138, #7114
+    // a hoisted children array inside v-for can caused HMR errors since
+    // it might be mutated when mounting the v-for list
+    if (context.hmr) {
+      hoisted.content = `[...${hoisted.content}]`
+    }
+    node.codegenNode.children = hoisted
   }
 }
 

packages/compiler-dom/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vue/compiler-dom",
-  "version": "3.3.5",
+  "version": "3.3.6",
   "description": "@vue/compiler-dom",
   "main": "index.js",
   "module": "dist/compiler-dom.esm-bundler.js",
@@ -37,7 +37,7 @@
   },
   "homepage": "https://github.com/vuejs/core/tree/main/packages/compiler-dom#readme",
   "dependencies": {
-    "@vue/shared": "3.3.5",
-    "@vue/compiler-core": "3.3.5"
+    "@vue/shared": "3.3.6",
+    "@vue/compiler-core": "3.3.6"
   }
 }

packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineModel.spec.ts.snap

@@ -7,15 +7,17 @@ export default {
   props: {
     \\"modelValue\\": { required: true },
     \\"count\\": {},
+    \\"toString\\": { type: Function },
   },
-  emits: [\\"update:modelValue\\", \\"update:count\\"],
+  emits: [\\"update:modelValue\\", \\"update:count\\", \\"update:toString\\"],
   setup(__props, { expose: __expose }) {
   __expose();
 
       const modelValue = _useModel(__props, \\"modelValue\\")
       const c = _useModel(__props, \\"count\\")
+      const toString = _useModel(__props, \\"toString\\")
       
-return { modelValue, c }
+return { modelValue, c, toString }
 }
 
 }"

packages/compiler-sfc/__tests__/compileScript/defineModel.spec.ts

@@ -8,6 +8,7 @@ describe('defineModel()', () => {
       <script setup>
       const modelValue = defineModel({ required: true })
       const c = defineModel('count')
+      const toString = defineModel('toString', { type: Function })
       </script>
       `,
       { defineModel: true }
@@ -16,18 +17,22 @@ describe('defineModel()', () => {
     expect(content).toMatch('props: {')
     expect(content).toMatch('"modelValue": { required: true },')
     expect(content).toMatch('"count": {},')
-    expect(content).toMatch('emits: ["update:modelValue", "update:count"],')
+    expect(content).toMatch('"toString": { type: Function },')
+    expect(content).toMatch(
+      'emits: ["update:modelValue", "update:count", "update:toString"],'
+    )
     expect(content).toMatch(
       `const modelValue = _useModel(__props, "modelValue")`
     )
     expect(content).toMatch(`const c = _useModel(__props, "count")`)
-    expect(content).toMatch(`return { modelValue, c }`)
+    expect(content).toMatch(`return { modelValue, c, toString }`)
     expect(content).not.toMatch('defineModel')
 
     expect(bindings).toStrictEqual({
       modelValue: BindingTypes.SETUP_REF,
       count: BindingTypes.PROPS,
-      c: BindingTypes.SETUP_REF
+      c: BindingTypes.SETUP_REF,
+      toString: BindingTypes.SETUP_REF
     })
   })