Merge remote-tracking branch 'upstream/minor'

.github/workflows/ci.yml

@@ -60,3 +60,28 @@ jobs:
 
       - name: Run type declaration tests
         run: pnpm run test-dts
+
+  # benchmarks:
+  #   runs-on: ubuntu-latest
+  #   if: github.event_name == 'push' || github.event.pull_request.head.repo.full_name != github.repository
+  #   env:
+  #     PUPPETEER_SKIP_DOWNLOAD: 'true'
+  #   steps:
+  #     - uses: actions/checkout@v4
+
+  #     - name: Install pnpm
+  #       uses: pnpm/action-setup@v2
+
+  #     - name: Install Node.js
+  #       uses: actions/setup-node@v4
+  #       with:
+  #         node-version-file: '.node-version'
+  #         cache: 'pnpm'
+
+  #     - run: pnpm install
+
+  #     - name: Run benchmarks
+  #       uses: CodSpeedHQ/action@v2
+  #       with:
+  #         run: pnpm vitest bench --run
+  #         token: ${{ secrets.CODSPEED_TOKEN }}

package.json

@@ -1,7 +1,7 @@
 {
   "private": true,
   "version": "0.0.0-vapor",
-  "packageManager": "pnpm@8.11.0",
+  "packageManager": "pnpm@8.12.0",
   "type": "module",
   "scripts": {
     "dev": "node scripts/dev.js vue vue-vapor",
@@ -22,6 +22,7 @@
     "test-dts": "run-s build-dts test-dts-only",
     "test-dts-only": "tsc -p ./packages/dts-test/tsconfig.test.json",
     "test-coverage": "vitest -c vitest.unit.config.ts --coverage",
+    "test-bench": "vitest bench",
     "release": "node scripts/release.js",
     "changelog": "conventional-changelog -p angular -i CHANGELOG.md -s",
     "dev-esm": "node scripts/dev.js -if esm-bundler-runtime",
@@ -61,6 +62,7 @@
   "devDependencies": {
     "@babel/parser": "^7.23.5",
     "@babel/types": "^7.23.5",
+    "@codspeed/vitest-plugin": "^2.3.1",
     "@rollup/plugin-alias": "^5.0.1",
     "@rollup/plugin-commonjs": "^25.0.7",
     "@rollup/plugin-json": "^6.0.1",
@@ -69,33 +71,33 @@
     "@rollup/plugin-terser": "^0.4.4",
     "@types/hash-sum": "^1.0.2",
     "@types/minimist": "^1.2.5",
-    "@types/node": "^20.10.3",
+    "@types/node": "^20.10.4",
     "@types/semver": "^7.5.5",
-    "@typescript-eslint/parser": "^6.13.0",
-    "@vitest/coverage-istanbul": "^0.34.6",
+    "@typescript-eslint/parser": "^6.13.2",
+    "@vitest/coverage-istanbul": "^1.0.4",
     "@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.54.0",
+    "eslint": "^8.55.0",
     "eslint-define-config": "^1.24.1",
     "eslint-plugin-jest": "^27.6.0",
     "estree-walker": "^2.0.2",
     "execa": "^8.0.1",
-    "jsdom": "^22.1.0",
-    "lint-staged": "^15.1.0",
+    "jsdom": "^23.0.1",
+    "lint-staged": "^15.2.0",
     "lodash": "^4.17.21",
     "magic-string": "^0.30.5",
     "markdown-table": "^3.0.3",
-    "marked": "^9.1.6",
+    "marked": "^11.0.1",
     "minimist": "^1.2.8",
     "npm-run-all": "^4.1.5",
     "picocolors": "^1.0.0",
-    "prettier": "^3.1.0",
+    "prettier": "^3.1.1",
     "pretty-bytes": "^6.1.1",
     "pug": "^3.0.2",
-    "puppeteer": "~21.5.2",
+    "puppeteer": "~21.6.0",
     "rimraf": "^5.0.5",
     "rollup": "^4.1.4",
     "rollup-plugin-dts": "^6.1.0",
@@ -109,7 +111,7 @@
     "tslib": "^2.6.2",
     "tsx": "^4.6.2",
     "typescript": "^5.2.2",
-    "vite": "^5.0.0",
-    "vitest": "^1.0.0"
+    "vite": "^5.0.5",
+    "vitest": "^1.0.4"
   }
 }

packages/compiler-core/__tests__/transform.spec.ts

@@ -201,6 +201,26 @@ describe('compiler: transform', () => {
     expect((ast as any).children[1].props[0].exp.content).toBe(`_hoisted_2`)
   })
 
+  test('context.filename and selfName', () => {
+    const ast = baseParse(`<div />`)
+
+    const calls: any[] = []
+    const plugin: NodeTransform = (node, context) => {
+      calls.push({ ...context })
+    }
+
+    transform(ast, {
+      filename: '/the/fileName.vue',
+      nodeTransforms: [plugin]
+    })
+
+    expect(calls.length).toBe(2)
+    expect(calls[1]).toMatchObject({
+      filename: '/the/fileName.vue',
+      selfName: 'FileName'
+    })
+  })
+
   test('onError option', () => {
     const ast = baseParse(`<div/>`)
     const loc = ast.children[0].loc

packages/compiler-core/package.json

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

packages/compiler-core/src/babelUtils.ts

@@ -441,3 +441,11 @@ export const TS_NODE_TYPES = [
   'TSInstantiationExpression', // foo<string>
   'TSSatisfiesExpression' // foo satisfies T
 ]
+
+export function unwrapTSNode(node: Node): Node {
+  if (TS_NODE_TYPES.includes(node.type)) {
+    return unwrapTSNode((node as any).expression)
+  } else {
+    return node
+  }
+}

packages/compiler-core/src/errors.ts

@@ -90,13 +90,13 @@ export enum ErrorCodes {
   X_V_MODEL_ON_PROPS,
   X_INVALID_EXPRESSION,
   X_KEEP_ALIVE_INVALID_CHILDREN,
-  X_VNODE_HOOKS,
 
   // generic errors
   X_PREFIX_ID_NOT_SUPPORTED,
   X_MODULE_MODE_NOT_SUPPORTED,
   X_CACHE_HANDLER_NOT_SUPPORTED,
   X_SCOPE_ID_NOT_SUPPORTED,
+  X_VNODE_HOOKS,
 
   // Special value for higher-order compilers to pick up the last code
   // to avoid collision of error codes. This should always be kept as the last
@@ -173,7 +173,7 @@ export const errorMessages: Record<ErrorCodes, string> = {
   [ErrorCodes.X_V_MODEL_ON_PROPS]: `v-model cannot be used on a prop, because local prop bindings are not writable.\nUse a v-bind binding combined with a v-on listener that emits update:x event instead.`,
   [ErrorCodes.X_INVALID_EXPRESSION]: `Error parsing JavaScript expression: `,
   [ErrorCodes.X_KEEP_ALIVE_INVALID_CHILDREN]: `<KeepAlive> expects exactly one child component.`,
-  [ErrorCodes.X_VNODE_HOOKS]: `@vnode-* hooks in templates are deprecated. Use the vue: prefix instead. For example, @vnode-mounted should be changed to @vue:mounted. @vnode-* hooks support will be removed in 3.4.`,
+  [ErrorCodes.X_VNODE_HOOKS]: `@vnode-* hooks in templates are no longer supported. Use the vue: prefix instead. For example, @vnode-mounted should be changed to @vue:mounted. @vnode-* hooks support has been removed in 3.4.`,
 
   // generic errors
   [ErrorCodes.X_PREFIX_ID_NOT_SUPPORTED]: `"prefixIdentifiers" option is not supported in this build of compiler.`,

packages/compiler-core/src/transform.ts

@@ -83,9 +83,7 @@ export interface ImportItem {
 }
 
 export interface TransformContext
-  extends Required<
-      Omit<TransformOptions, 'filename' | keyof CompilerCompatOptions>
-    >,
+  extends Required<Omit<TransformOptions, keyof CompilerCompatOptions>>,
     CompilerCompatOptions {
   selfName: string | null
   root: RootNode
@@ -153,6 +151,7 @@ export function createTransformContext(
   const nameMatch = filename.replace(/\?.*$/, '').match(/([^/\\]+)\.\w+$/)
   const context: TransformContext = {
     // options
+    filename,
     selfName: nameMatch && capitalize(camelize(nameMatch[1])),
     prefixIdentifiers,
     hoistStatic,

packages/compiler-core/src/utils.ts

@@ -40,6 +40,7 @@ import { isString, isObject, NOOP } from '@vue/shared'
 import { PropsExpression } from './transforms/transformElement'
 import { parseExpression } from '@babel/parser'
 import { Expression } from '@babel/types'
+import { unwrapTSNode } from './babelUtils'
 
 export const isStaticExp = (p: JSChildNode): p is SimpleExpressionNode =>
   p.type === NodeTypes.SIMPLE_EXPRESSION && p.isStatic
@@ -164,9 +165,7 @@ export const isMemberExpressionNode = __BROWSER__
         let ret: Expression = parseExpression(path, {
           plugins: options.expressionPlugins
         })
-        if (ret.type === 'TSAsExpression' || ret.type === 'TSTypeAssertion') {
-          ret = ret.expression
-        }
+        ret = unwrapTSNode(ret) as Expression
         return (
           ret.type === 'MemberExpression' ||
           ret.type === 'OptionalMemberExpression' ||

packages/compiler-dom/package.json

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

packages/compiler-dom/src/parserOptions.ts

@@ -1,12 +1,12 @@
 import { ParserOptions, NodeTypes, Namespaces } from '@vue/compiler-core'
-import { isVoidTag, isHTMLTag, isSVGTag } from '@vue/shared'
+import { isVoidTag, isHTMLTag, isSVGTag, isMathMLTag } from '@vue/shared'
 import { TRANSITION, TRANSITION_GROUP } from './runtimeHelpers'
 import { decodeHtmlBrowser } from './decodeHtmlBrowser'
 
 export const parserOptions: ParserOptions = {
   parseMode: 'html',
   isVoidTag,
-  isNativeTag: tag => isHTMLTag(tag) || isSVGTag(tag),
+  isNativeTag: tag => isHTMLTag(tag) || isSVGTag(tag) || isMathMLTag(tag),
   isPreTag: tag => tag === 'pre',
   decodeEntities: __BROWSER__ ? decodeHtmlBrowser : undefined,
 

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

@@ -1483,3 +1483,31 @@ _sfc_.setup = __setup__
   : __injectCSSVars__
 "
 `;
+
+exports[`SFC genDefaultAs > parser plugins > import attributes (user override for deprecated syntax) 1`] = `
+"import { foo } from './foo.js' assert { type: 'foobar' }
+
+export default {
+  setup(__props, { expose: __expose }) {
+  __expose();
+
+
+return { get foo() { return foo } }
+}
+
+}"
+`;
+
+exports[`SFC genDefaultAs > parser plugins > import attributes 1`] = `
+"import { foo } from './foo.js' with { type: 'foobar' }
+
+export default {
+  setup(__props, { expose: __expose }) {
+  __expose();
+
+
+return { get foo() { return foo } }
+}
+
+}"
+`;

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

@@ -1600,4 +1600,38 @@ describe('SFC genDefaultAs', () => {
       foo: BindingTypes.SETUP_REF
     })
   })
+
+  describe('parser plugins', () => {
+    test('import attributes', () => {
+      const { content } = compile(`
+        <script setup>
+        import { foo } from './foo.js' with { type: 'foobar' }
+        </script>
+      `)
+      assertCode(content)
+
+      expect(() =>
+        compile(`
+      <script setup>
+        import { foo } from './foo.js' assert { type: 'foobar' }
+        </script>`)
+      ).toThrow()
+    })
+
+    test('import attributes (user override for deprecated syntax)', () => {
+      const { content } = compile(
+        `
+        <script setup>
+        import { foo } from './foo.js' assert { type: 'foobar' }
+        </script>
+      `,
+        {
+          babelParserPlugins: [
+            ['importAttributes', { deprecatedAssertSyntax: true }]
+          ]
+        }
+      )
+      assertCode(content)
+    })
+  })
 })

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

@@ -18,6 +18,47 @@ return { props, bar }
 }"
 `;
 
+exports[`defineProps > custom element retains the props type & default value & production mode 1`] = `
+"import { defineComponent as _defineComponent } from 'vue'
+interface Props { 
+          foo?: number;
+      }
+      
+export default /*#__PURE__*/_defineComponent({
+  __name: 'app.ce',
+  props: {
+    foo: { default: 5.5, type: Number }
+  },
+  setup(__props: any, { expose: __expose }) {
+  __expose();
+
+      const props = __props;
+      
+return { props }
+}
+
+})"
+`;
+
+exports[`defineProps > custom element retains the props type & production mode 1`] = `
+"import { defineComponent as _defineComponent } from 'vue'
+
+export default /*#__PURE__*/_defineComponent({
+  __name: 'app.ce',
+  props: {
+    foo: {type: Number}
+  },
+  setup(__props: any, { expose: __expose }) {
+  __expose();
+
+      const props = __props
+      
+return { props }
+}
+
+})"
+`;
+
 exports[`defineProps > defineProps w/ runtime options 1`] = `
 "import { defineComponent as _defineComponent } from 'vue'