Merge tag 'v3.5.0-alpha.5'

.github/contributing.md

@@ -82,7 +82,7 @@ Hi! I'm really excited that you are interested in contributing to Vue.js. Before
 
 ## Development Setup
 
-You will need [Node.js](https://nodejs.org) **version 18.12+**, and [PNPM](https://pnpm.io) **version 8+**.
+You will need [Node.js](https://nodejs.org) with minimum version as specified in the [`.node-version`](https://github.com/vuejs/core/blob/main/.node-version) file, and [PNPM](https://pnpm.io) with minimum version as specified in the [`"packageManager"` field in `package.json`](https://github.com/vuejs/core/blob/main/package.json#L4).
 
 We also recommend installing [@antfu/ni](https://github.com/antfu/ni) to help switching between repos using different package managers. `ni` also provides the handy `nr` command which running npm scripts easier.
 

.github/workflows/autofix.yml

@@ -31,4 +31,4 @@ jobs:
  - name: Run prettier
  run: pnpm run format
 
- - uses: autofix-ci/action@2891949f3779a1cafafae1523058501de3d4e944
+ - uses: autofix-ci/action@ff86a557419858bb967097bfc916833f5647fa8c

CHANGELOG.md

@@ -1,6 +1,31 @@
-# [3.5.0-alpha.4](https://github.com/vuejs/core/compare/v3.4.34...v3.5.0-alpha.4) (2024-07-24)
+# [3.5.0-alpha.5](https://github.com/vuejs/core/compare/v3.4.35...v3.5.0-alpha.5) (2024-07-31)
+
+
+### Features
+
+* **hydration:** support suppressing hydration mismatch via data-allow-mismatch ([94fb2b8](https://github.com/vuejs/core/commit/94fb2b8106a66bcca1a3f922a246a29fdd1274b1))
+* lazy hydration strategies for async components ([#11458](https://github.com/vuejs/core/issues/11458)) ([d14a11c](https://github.com/vuejs/core/commit/d14a11c1cdcee88452f17ce97758743c863958f4))
 
 
+
+## [3.4.35](https://github.com/vuejs/core/compare/v3.4.34...v3.4.35) (2024-07-31)
+
+
+### Bug Fixes
+
+* **teleport/ssr:** fix Teleport hydration regression due to targetStart anchor addition ([7b18cdb](https://github.com/vuejs/core/commit/7b18cdb0b53a94007ca6a3675bf41b5d3153fec6))
+* **teleport/ssr:** ensure targetAnchor and targetStart not null during hydration ([#11456](https://github.com/vuejs/core/issues/11456)) ([12667da](https://github.com/vuejs/core/commit/12667da4879f980dcf2c50e36f3642d085a87d71)), closes [#11400](https://github.com/vuejs/core/issues/11400)
+* **types/ref:** allow getter and setter types to be unrelated ([#11442](https://github.com/vuejs/core/issues/11442)) ([e0b2975](https://github.com/vuejs/core/commit/e0b2975ef65ae6a0be0aa0a0df43fb887c665251))
+
+
+### Performance Improvements
+
+* **runtime-core:** improve efficiency of normalizePropsOptions ([#11409](https://github.com/vuejs/core/issues/11409)) ([5680142](https://github.com/vuejs/core/commit/5680142e68096c42e66da9f4c6220d040d7c56ba)), closes [#9739](https://github.com/vuejs/core/issues/9739)
+
+
+
+# [3.5.0-alpha.4](https://github.com/vuejs/core/compare/v3.4.34...v3.5.0-alpha.4) (2024-07-24)
+
 ### Bug Fixes
 
 * **suspense/hydration:** fix hydration timing of async component inside suspense ([1b8e197](https://github.com/vuejs/core/commit/1b8e197a5b65d67a9703b8511786fb81df9aa7cc)), closes [#6638](https://github.com/vuejs/core/issues/6638)

package.json

@@ -1,7 +1,7 @@
 {
  "private": true,
- "version": "3.5.0-alpha.4",
- "packageManager": "pnpm@9.5.0",
+ "version": "3.5.0-alpha.5",
+ "packageManager": "pnpm@9.6.0",
  "type": "module",
  "scripts": {
  "dev": "node scripts/dev.js vue vue-vapor",
@@ -66,46 +66,46 @@
  "@rollup/plugin-json": "^6.1.0",
  "@rollup/plugin-node-resolve": "^15.2.3",
  "@rollup/plugin-replace": "5.0.4",
- "@swc/core": "^1.6.13",
+ "@swc/core": "^1.7.3",
  "@types/hash-sum": "^1.0.2",
- "@types/node": "^20.14.10",
+ "@types/node": "^20.14.13",
  "@types/semver": "^7.5.8",
  "@vitest/coverage-istanbul": "^1.6.0",
  "@vitest/ui": "^1.6.0",
  "@vue/consolidate": "1.0.0",
- "conventional-changelog-cli": "^4.1.0",
+ "conventional-changelog-cli": "^5.0.0",
  "enquirer": "^2.4.1",
  "esbuild": "^0.23.0",
  "esbuild-plugin-polyfill-node": "^0.3.0",
- "eslint": "^9.6.0",
- "eslint-plugin-import-x": "^0.5.3",
+ "eslint": "^9.8.0",
+ "eslint-plugin-import-x": "^3.1.0",
  "eslint-plugin-vitest": "^0.5.4",
  "estree-walker": "catalog:",
- "jsdom": "^24.1.0",
+ "jsdom": "^24.1.1",
  "lint-staged": "^15.2.7",
  "lodash": "^4.17.21",
  "magic-string": "^0.30.10",
  "markdown-table": "^3.0.3",
  "marked": "^12.0.2",
  "npm-run-all2": "^6.2.2",
  "picocolors": "^1.0.1",
- "prettier": "^3.3.2",
+ "prettier": "^3.3.3",
  "pretty-bytes": "^6.1.1",
  "pug": "^3.0.3",
- "puppeteer": "~22.12.1",
+ "puppeteer": "~22.14.0",
  "rimraf": "^5.0.9",
- "rollup": "^4.18.1",
+ "rollup": "^4.19.1",
  "rollup-plugin-dts": "^6.1.1",
  "rollup-plugin-esbuild": "^6.1.1",
  "rollup-plugin-polyfill-node": "^0.13.0",
- "semver": "^7.6.2",
+ "semver": "^7.6.3",
  "serve": "^14.2.3",
  "simple-git-hooks": "^2.11.1",
  "todomvc-app-css": "^2.4.3",
  "tslib": "^2.6.3",
  "tsx": "^4.16.2",
  "typescript": "~5.4.5",
- "typescript-eslint": "^7.15.0",
+ "typescript-eslint": "^7.17.0",
  "vite": "catalog:",
  "vitest": "^1.6.0"
  },

packages/compiler-core/package.json

@@ -1,6 +1,6 @@
 {
  "name": "@vue/compiler-core",
- "version": "3.5.0-alpha.4",
+ "version": "3.5.0-alpha.5",
  "description": "@vue/compiler-core",
  "main": "index.js",
  "module": "dist/compiler-core.esm-bundler.js",

packages/compiler-dom/package.json

@@ -1,6 +1,6 @@
 {
  "name": "@vue/compiler-dom",
- "version": "3.5.0-alpha.4",
+ "version": "3.5.0-alpha.5",
  "description": "@vue/compiler-dom",
  "main": "index.js",
  "module": "dist/compiler-dom.esm-bundler.js",

packages/compiler-sfc/package.json

@@ -1,6 +1,6 @@
 {
  "name": "@vue/compiler-sfc",
- "version": "3.5.0-alpha.4",
+ "version": "3.5.0-alpha.5",
  "description": "@vue/compiler-sfc",
  "main": "dist/compiler-sfc.cjs.js",
  "module": "dist/compiler-sfc.esm-browser.js",
@@ -50,7 +50,7 @@
  "@vue/shared": "workspace:*",
  "estree-walker": "catalog:",
  "magic-string": "catalog:",
- "postcss": "^8.4.39",
+ "postcss": "^8.4.40",
  "source-map-js": "catalog:"
  },
  "devDependencies": {
@@ -61,7 +61,7 @@
  "merge-source-map": "^1.1.0",
  "minimatch": "^9.0.5",
  "postcss-modules": "^6.0.0",
- "postcss-selector-parser": "^6.1.0",
+ "postcss-selector-parser": "^6.1.1",
  "pug": "^3.0.3",
  "sass": "^1.77.8"
  }

packages/compiler-ssr/package.json

@@ -1,6 +1,6 @@
 {
  "name": "@vue/compiler-ssr",
- "version": "3.5.0-alpha.4",
+ "version": "3.5.0-alpha.5",
  "description": "@vue/compiler-ssr",
  "main": "dist/compiler-ssr.cjs.js",
  "types": "dist/compiler-ssr.d.ts",

packages/dts-test/ref.test-d.ts

@@ -173,6 +173,16 @@ describe('ref with generic', <T extends { name: string }>() => {
  expectType<string>(ss.value.name)
 })
 
+describe('allow getter and setter types to be unrelated', <T>() => {
+ const a = { b: ref(0) }
+ const c = ref(a)
+ c.value = a
+
+ const d = {} as T
+ const e = ref(d)
+ e.value = d
+})
+
 // shallowRef
 type Status = 'initial' | 'ready' | 'invalidating'
 const shallowStatus = shallowRef<Status>('initial')

packages/dts-test/watch.test-d.ts

@@ -1,5 +1,6 @@
 import {
  type ComputedRef,
+ type MaybeRef,
  type Ref,
  computed,
  defineComponent,
@@ -203,3 +204,10 @@ defineComponent({
  expectType<{ foo: string }>(value)
  })
 }
+
+{
+ const css: MaybeRef<string> = ''
+ watch(ref(css), value => {
+ expectType<string>(value)
+ })
+}

packages/reactivity/package.json

@@ -1,6 +1,6 @@
 {
  "name": "@vue/reactivity",
- "version": "3.5.0-alpha.4",
+ "version": "3.5.0-alpha.5",
  "description": "@vue/reactivity",
  "main": "index.js",
  "module": "dist/reactivity.esm-bundler.js",

packages/reactivity/src/arrayInstrumentations.ts

@@ -54,16 +54,14 @@ export const arrayInstrumentations: Record<string | symbol, Function> = <any>{
  fn: (item: unknown, index: number, array: unknown[]) => unknown,
  thisArg?: unknown,
  ) {
- const result = apply(this, 'filter', fn, thisArg)
- return isProxy(this) && !isShallow(this) ? result.map(toReactive) : result
+ return apply(this, 'filter', fn, thisArg, v => v.map(toReactive))
  },
 
  find(
  fn: (item: unknown, index: number, array: unknown[]) => boolean,
  thisArg?: unknown,
  ) {
- const result = apply(this, 'find', fn, thisArg)
- return isProxy(this) && !isShallow(this) ? toReactive(result) : result
+ return apply(this, 'find', fn, thisArg, toReactive)
  },
 
  findIndex(
@@ -77,8 +75,7 @@ export const arrayInstrumentations: Record<string | symbol, Function> = <any>{
  fn: (item: unknown, index: number, array: unknown[]) => boolean,
  thisArg?: unknown,
  ) {
- const result = apply(this, 'findLast', fn, thisArg)
- return isProxy(this) && !isShallow(this) ? toReactive(result) : result
+ return apply(this, 'findLast', fn, thisArg, toReactive)
  },
 
  findLastIndex(
@@ -237,11 +234,14 @@ function apply(
  method: ArrayMethods,
  fn: (item: unknown, index: number, array: unknown[]) => unknown,
  thisArg?: unknown,
+ wrappedRetFn?: (result: any) => unknown,
 ) {
  const arr = shallowReadArray(self)
+ let needsWrap = false
  let wrappedFn = fn
  if (arr !== self) {
- if (!isShallow(self)) {
+ needsWrap = !isShallow(self)
+ if (needsWrap) {
  wrappedFn = function (this: unknown, item, index) {
  return fn.call(this, toReactive(item), index, self)
  }
@@ -252,7 +252,8 @@ function apply(
  }
  }
  // @ts-expect-error our code is limited to es2016 but user code is not
- return arr[method](wrappedFn, thisArg)
+ const result = arr[method](wrappedFn, thisArg)
+ return needsWrap && wrappedRetFn ? wrappedRetFn(result) : result
 }
 
 // instrument reduce and reduceRight to take ARRAY_ITERATE dependency

packages/reactivity/src/collectionHandlers.ts

@@ -169,19 +169,6 @@ function createForEach(isReadonly: boolean, isShallow: boolean) {
  }
 }
 
-interface Iterable {
- [Symbol.iterator](): Iterator
-}
-
-interface Iterator {
- next(value?: any): IterationResult
-}
-
-interface IterationResult {
- value: any
- done: boolean
-}
-
 function createIterableMethod(
  method: string | symbol,
  isReadonly: boolean,
@@ -190,7 +177,7 @@ function createIterableMethod(
  return function (
  this: IterableCollections,
  ...args: unknown[]
- ): Iterable & Iterator {
+ ): Iterable<unknown> & Iterator<unknown> {
  const target = this[ReactiveFlags.RAW]
  const rawTarget = toRaw(target)
  const targetIsMap = isMap(rawTarget)

packages/reactivity/src/ref.ts

@@ -23,8 +23,9 @@ import { warn } from './warning'
 declare const RefSymbol: unique symbol
 export declare const RawSymbol: unique symbol
 
-export interface Ref<T = any> {
- value: T
+export interface Ref<T = any, S = T> {
+ get value(): T
+ set value(_: S)
  /**
  * Type differentiator only.
  * We need this to be in public d.ts but don't want it to show up in IDE
@@ -51,7 +52,7 @@ export function isRef(r: any): r is Ref {
  * @param value - The object to wrap in the ref.
  * @see {@link https://vuejs.org/api/reactivity-core.html#ref}
  */
-export function ref<T>(value: T): Ref<UnwrapRef<T>>
+export function ref<T>(value: T): Ref<UnwrapRef<T>, UnwrapRef<T> | T>
 export function ref<T = any>(): Ref<T | undefined>
 export function ref(value?: unknown) {
  return createRef(value, false)