Merge branch 'main' into minor

.github/workflows/autofix.yml

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

.github/workflows/size-report.yml

@@ -37,7 +37,7 @@ jobs:
         run: pnpm install
 
       - name: Download Size Data
-        uses: dawidd6/action-download-artifact@v6
+        uses: dawidd6/action-download-artifact@v7
         with:
           name: size-data
           run_id: ${{ github.event.workflow_run.id }}
@@ -56,7 +56,7 @@ jobs:
           path: temp/size/base.txt
 
       - name: Download Previous Size Data
-        uses: dawidd6/action-download-artifact@v6
+        uses: dawidd6/action-download-artifact@v7
         with:
           branch: ${{ steps.pr-base.outputs.content }}
           workflow: size-data.yml

package.json

@@ -1,7 +1,7 @@
 {
   "private": true,
   "version": "3.5.13",
-  "packageManager": "pnpm@9.14.4",
+  "packageManager": "pnpm@9.15.4",
   "type": "module",
   "scripts": {
     "dev": "node scripts/dev.js",
@@ -65,39 +65,39 @@
     "@babel/parser": "catalog:",
     "@babel/types": "catalog:",
     "@rollup/plugin-alias": "^5.1.1",
-    "@rollup/plugin-commonjs": "^28.0.1",
+    "@rollup/plugin-commonjs": "^28.0.2",
     "@rollup/plugin-json": "^6.1.0",
-    "@rollup/plugin-node-resolve": "^15.3.0",
+    "@rollup/plugin-node-resolve": "^16.0.0",
     "@rollup/plugin-replace": "5.0.4",
-    "@swc/core": "^1.9.3",
+    "@swc/core": "^1.10.8",
     "@types/hash-sum": "^1.0.2",
-    "@types/node": "^22.10.1",
+    "@types/node": "^22.10.7",
     "@types/semver": "^7.5.8",
     "@types/serve-handler": "^6.1.4",
-    "@vitest/coverage-v8": "^2.1.5",
+    "@vitest/coverage-v8": "^3.0.2",
     "@vue/consolidate": "1.0.0",
     "conventional-changelog-cli": "^5.0.0",
     "enquirer": "^2.4.1",
-    "esbuild": "^0.24.0",
+    "esbuild": "^0.24.2",
     "esbuild-plugin-polyfill-node": "^0.3.0",
-    "eslint": "^9.15.0",
-    "eslint-plugin-import-x": "^4.4.2",
-    "@vitest/eslint-plugin": "^1.1.10",
+    "eslint": "^9.18.0",
+    "eslint-plugin-import-x": "^4.6.1",
+    "@vitest/eslint-plugin": "^1.1.25",
     "estree-walker": "catalog:",
-    "jsdom": "^25.0.1",
-    "lint-staged": "^15.2.10",
+    "jsdom": "^26.0.0",
+    "lint-staged": "^15.4.1",
     "lodash": "^4.17.21",
-    "magic-string": "^0.30.14",
+    "magic-string": "^0.30.17",
     "markdown-table": "^3.0.4",
     "marked": "13.0.3",
-    "npm-run-all2": "^7.0.1",
+    "npm-run-all2": "^7.0.2",
     "picocolors": "^1.1.1",
-    "prettier": "^3.3.3",
+    "prettier": "^3.4.2",
     "pretty-bytes": "^6.1.1",
     "pug": "^3.0.3",
-    "puppeteer": "~23.3.0",
+    "puppeteer": "~24.1.0",
     "rimraf": "^6.0.1",
-    "rollup": "^4.27.4",
+    "rollup": "^4.31.0",
     "rollup-plugin-dts": "^6.1.1",
     "rollup-plugin-esbuild": "^6.1.1",
     "rollup-plugin-polyfill-node": "^0.13.0",
@@ -108,9 +108,9 @@
     "todomvc-app-css": "^2.4.3",
     "tslib": "^2.8.1",
     "typescript": "~5.6.2",
-    "typescript-eslint": "^8.14.0",
+    "typescript-eslint": "^8.20.0",
     "vite": "catalog:",
-    "vitest": "^2.1.5"
+    "vitest": "^3.0.2"
   },
   "pnpm": {
     "peerDependencyRules": {

packages-private/sfc-playground/package.json

@@ -13,7 +13,7 @@
     "vite": "catalog:"
   },
   "dependencies": {
-    "@vue/repl": "^4.4.2",
+    "@vue/repl": "^4.4.3",
     "file-saver": "^2.0.5",
     "jszip": "^3.10.1",
     "vue": "workspace:*"

packages-private/sfc-playground/src/download/template/package.json

@@ -12,6 +12,6 @@
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^5.2.1",
-    "vite": "^5.4.11"
+    "vite": "^6.0.7"
   }
 }

packages-private/template-explorer/package.json

@@ -11,7 +11,7 @@
     "enableNonBrowserBranches": true
   },
   "dependencies": {
-    "monaco-editor": "^0.52.0",
+    "monaco-editor": "^0.52.2",
     "source-map-js": "^1.2.1"
   }
 }

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

@@ -12,7 +12,7 @@ import { camelize } from '@vue/shared'
 import { CAMELIZE } from '../runtimeHelpers'
 import { processExpression } from './transformExpression'
 
-// v-bind without arg is handled directly in ./transformElements.ts due to it affecting
+// v-bind without arg is handled directly in ./transformElement.ts due to its affecting
 // codegen for the entire props object. This transform here is only for v-bind
 // *with* args.
 export const transformBind: DirectiveTransform = (dir, _node, context) => {

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

@@ -17,7 +17,7 @@ import { hasScopeRef, isFnExpression, isMemberExpression } from '../utils'
 import { TO_HANDLER_KEY } from '../runtimeHelpers'
 
 export interface VOnDirectiveNode extends DirectiveNode {
-  // v-on without arg is handled directly in ./transformElements.ts due to it affecting
+  // v-on without arg is handled directly in ./transformElement.ts due to its affecting
   // codegen for the entire props object. This transform here is only for v-on
   // *with* args.
   arg: ExpressionNode

packages/compiler-sfc/package.json

@@ -49,7 +49,7 @@
     "@vue/shared": "workspace:*",
     "estree-walker": "catalog:",
     "magic-string": "catalog:",
-    "postcss": "^8.4.49",
+    "postcss": "^8.5.1",
     "source-map-js": "catalog:"
   },
   "devDependencies": {
@@ -58,10 +58,10 @@
     "hash-sum": "^2.0.0",
     "lru-cache": "10.1.0",
     "merge-source-map": "^1.1.0",
-    "minimatch": "~9.0.5",
+    "minimatch": "~10.0.1",
     "postcss-modules": "^6.0.1",
     "postcss-selector-parser": "^7.0.0",
     "pug": "^3.0.3",
-    "sass": "^1.82.0"
+    "sass": "^1.83.4"
   }
 }

packages/compiler-sfc/src/compileScript.ts

@@ -170,8 +170,6 @@ export function compileScript(
   const scriptLang = script && script.lang
   const scriptSetupLang = scriptSetup && scriptSetup.lang
 
-  let refBindings: string[] | undefined
-
   if (!scriptSetup) {
     if (!script) {
       throw new Error(`[@vue/compiler-sfc] SFC contains no <script> tags.`)
@@ -740,12 +738,6 @@ export function compileScript(
   for (const key in setupBindings) {
     ctx.bindingMetadata[key] = setupBindings[key]
   }
-  // known ref bindings
-  if (refBindings) {
-    for (const key of refBindings) {
-      ctx.bindingMetadata[key] = BindingTypes.SETUP_REF
-    }
-  }
 
   // 7. inject `useCssVars` calls
   if (

packages/reactivity/src/effectScope.ts

@@ -15,6 +15,10 @@ export class EffectScope implements Subscriber {
   depsTail: Link | undefined = undefined
   flags: number = 0
 
+  /**
+   * @internal track `on` calls, allow `on` call multiple times
+   */
+  private _on = 0
   /**
    * @internal
    */
@@ -102,20 +106,27 @@ export class EffectScope implements Subscriber {
     }
   }
 
+  prevScope: EffectScope | undefined
   /**
    * This should only be called on non-detached scopes
    * @internal
    */
   on(): void {
-    activeEffectScope = this
+    if (++this._on === 1) {
+      this.prevScope = activeEffectScope
+      activeEffectScope = this
+    }
   }
 
   /**
    * This should only be called on non-detached scopes
    * @internal
    */
   off(): void {
-    activeEffectScope = this.parent
+    if (this._on > 0 && --this._on === 0) {
+      activeEffectScope = this.prevScope
+      this.prevScope = undefined
+    }
   }
 
   stop(fromParent?: boolean): void {

packages/runtime-core/__tests__/apiWatch.spec.ts

@@ -31,6 +31,7 @@ import {
   TrackOpTypes,
   TriggerOpTypes,
   effectScope,
+  onScopeDispose,
   shallowReactive,
   shallowRef,
   toRef,
@@ -1982,4 +1983,31 @@ describe('api: watch', () => {
     expect(spy1).toHaveBeenCalled()
     expect(spy2).toHaveBeenCalled()
   })
+
+  // #12631
+  test('this.$watch w/ onScopeDispose', () => {
+    const onCleanup = vi.fn()
+    const toggle = ref(true)
+
+    const Comp = defineComponent({
+      render() {},
+      created(this: any) {
+        this.$watch(
+          () => 1,
+          function () {},
+        )
+        onScopeDispose(onCleanup)
+      },
+    })
+
+    const App = defineComponent({
+      render() {
+        return toggle.value ? h(Comp) : null
+      },
+    })
+
+    const root = nodeOps.createElement('div')
+    createApp(App).mount(root)
+    expect(onCleanup).toBeCalledTimes(0)
+  })
 })

packages/vue/__tests__/e2e/e2eUtils.ts

@@ -1,13 +1,13 @@
 import puppeteer, {
   type Browser,
   type ClickOptions,
+  type LaunchOptions,
   type Page,
-  type PuppeteerLaunchOptions,
 } from 'puppeteer'
 
 export const E2E_TIMEOUT: number = 30 * 1000
 
-const puppeteerOptions: PuppeteerLaunchOptions = {
+const puppeteerOptions: LaunchOptions = {
   args: process.env.CI ? ['--no-sandbox', '--disable-setuid-sandbox'] : [],
   headless: true,
 }

packages/vue/__tests__/e2e/todomvc.spec.ts

@@ -14,6 +14,7 @@ describe('e2e: todomvc', () => {
     classList,
     enterValue,
     clearValue,
+    timeout,
   } = setupPuppeteer()
 
   async function removeItemAt(n: number) {
@@ -101,6 +102,7 @@ describe('e2e: todomvc', () => {
 
     // active filter
     await click('.filters li:nth-child(2) a')
+    await timeout(1)
     expect(await count('.todo')).toBe(1)
     expect(await count('.todo.completed')).toBe(0)
     // add item with filter active
@@ -109,6 +111,7 @@ describe('e2e: todomvc', () => {
 
     // completed filter
     await click('.filters li:nth-child(3) a')
+    await timeout(1)
     expect(await count('.todo')).toBe(2)
     expect(await count('.todo.completed')).toBe(2)
 
@@ -128,12 +131,14 @@ describe('e2e: todomvc', () => {
     await click('.todo .toggle')
     expect(await count('.todo')).toBe(1)
     await click('.filters li:nth-child(2) a')
+    await timeout(1)
     expect(await count('.todo')).toBe(3)
     await click('.todo .toggle')
     expect(await count('.todo')).toBe(2)
 
     // editing triggered by blur
     await click('.filters li:nth-child(1) a')
+    await timeout(1)
     await click('.todo:nth-child(1) label', { clickCount: 2 })
     expect(await count('.todo.editing')).toBe(1)
     expect(await isFocused('.todo:nth-child(1) .edit')).toBe(true)