fix(runtime-core): respect props from global mixins

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

@@ -7,7 +7,8 @@ import {
   FunctionalComponent,
   defineComponent,
   ref,
-  serializeInner
+  serializeInner,
+  createApp
 } from '@vue/runtime-test'
 import { render as domRender, nextTick } from 'vue'
 
@@ -309,4 +310,44 @@ describe('component props', () => {
     expect(setupProps).toMatchObject(props)
     expect(renderProxy.$props).toMatchObject(props)
   })
+
+  test('merging props from global mixins', () => {
+    let setupProps: any
+    let renderProxy: any
+
+    const M1 = {
+      props: ['m1']
+    }
+    const M2 = {
+      props: { m2: null }
+    }
+    const Comp = {
+      props: ['self'],
+      setup(props: any) {
+        setupProps = props
+      },
+      render(this: any) {
+        renderProxy = this
+        return h('div', [this.self, this.m1, this.m2])
+      }
+    }
+
+    const props = {
+      self: 'from self, ',
+      m1: 'from mixin 1, ',
+      m2: 'from mixin 2'
+    }
+    const app = createApp(Comp, props)
+    app.mixin(M1)
+    app.mixin(M2)
+
+    const root = nodeOps.createElement('div')
+    app.mount(root)
+
+    expect(serializeInner(root)).toMatch(
+      `from self, from mixin 1, from mixin 2`
+    )
+    expect(setupProps).toMatchObject(props)
+    expect(renderProxy.$props).toMatchObject(props)
+  })
 })

packages/runtime-core/src/componentEmits.ts

@@ -47,7 +47,7 @@ export function emit(
     const options = normalizeEmitsOptions(instance.type)
     if (options) {
       if (!(event in options)) {
-        const propsOptions = normalizePropsOptions(instance.type)[0]
+        const propsOptions = normalizePropsOptions(instance, instance.type)[0]
         if (!propsOptions || !(`on` + capitalize(event) in propsOptions)) {
           warn(
             `Component emitted event "${event}" but it is neither declared in ` +

packages/runtime-core/src/componentOptions.ts

@@ -431,7 +431,7 @@ export function applyOptions(
   const checkDuplicateProperties = __DEV__ ? createDuplicateChecker() : null
 
   if (__DEV__) {
-    const propsOptions = normalizePropsOptions(options)[0]
+    const propsOptions = normalizePropsOptions(instance, options)[0]
     if (propsOptions) {
       for (const key in propsOptions) {
         checkDuplicateProperties!(OptionTypes.PROPS, key)

packages/runtime-core/src/componentProps.ts

@@ -121,7 +121,7 @@ export function initProps(
   setFullProps(instance, rawProps, props, attrs)
   // validation
   if (__DEV__) {
-    validateProps(props, instance.type)
+    validateProps(instance, props, instance.type)
   }
 
   if (isStateful) {
@@ -151,7 +151,7 @@ export function updateProps(
     vnode: { patchFlag }
   } = instance
   const rawCurrentProps = toRaw(props)
-  const [options] = normalizePropsOptions(instance.type)
+  const [options] = normalizePropsOptions(instance, instance.type)
 
   if (
     // always force full diff if hmr is enabled
@@ -236,7 +236,7 @@ export function updateProps(
   trigger(instance, TriggerOpTypes.SET, '$attrs')
 
   if (__DEV__ && rawProps) {
-    validateProps(props, instance.type)
+    validateProps(instance, props, instance.type)
   }
 }
 
@@ -246,7 +246,7 @@ function setFullProps(
   props: Data,
   attrs: Data
 ) {
-  const [options, needCastKeys] = normalizePropsOptions(instance.type)
+  const [options, needCastKeys] = normalizePropsOptions(instance, instance.type)
   if (rawProps) {
     for (const key in rawProps) {
       const value = rawProps[key]
@@ -315,7 +315,9 @@ function resolvePropValue(
 }
 
 export function normalizePropsOptions(
-  comp: ConcreteComponent
+  instance: ComponentInternalInstance,
+  comp: ConcreteComponent,
+  asMixins: boolean = false
 ): NormalizedPropsOptions | [] {
   if (comp.__props) {
     return comp.__props
@@ -329,10 +331,19 @@ export function normalizePropsOptions(
   let hasExtends = false
   if (__FEATURE_OPTIONS_API__ && !isFunction(comp)) {
     const extendProps = (raw: ComponentOptions) => {
-      const [props, keys] = normalizePropsOptions(raw)
+      const [props, keys] = normalizePropsOptions(instance, raw, true)
       extend(normalized, props)
       if (keys) needCastKeys.push(...keys)
     }
+    // apply global mixins props first
+    if (!asMixins) {
+      const globalMixins = instance.appContext.mixins
+      if (globalMixins.length) {
+        hasExtends = true
+        globalMixins.forEach(extendProps)
+      }
+    }
+
     if (comp.extends) {
       hasExtends = true
       extendProps(comp.extends)
@@ -416,9 +427,13 @@ function getTypeIndex(
 /**
  * dev only
  */
-function validateProps(props: Data, comp: ConcreteComponent) {
+function validateProps(
+  instance: ComponentInternalInstance,
+  props: Data,
+  comp: ConcreteComponent
+) {
   const rawValues = toRaw(props)
-  const options = normalizePropsOptions(comp)[0]
+  const options = normalizePropsOptions(instance, comp)[0]
   for (const key in options) {
     let opt = options[key]
     if (opt == null) continue

packages/runtime-core/src/componentPublicInstance.ts

@@ -250,7 +250,7 @@ export const PublicInstanceProxyHandlers: ProxyHandler<any> = {
       } else if (
         // only cache other properties when instance has declared (thus stable)
         // props
-        (normalizedProps = normalizePropsOptions(type)[0]) &&
+        (normalizedProps = normalizePropsOptions(instance, type)[0]) &&
         hasOwn(normalizedProps, key)
       ) {
         accessCache![key] = AccessTypes.PROPS
@@ -352,18 +352,14 @@ export const PublicInstanceProxyHandlers: ProxyHandler<any> = {
     return true
   },
 
-  has(
-    {
-      _: { data, setupState, accessCache, ctx, type, appContext }
-    }: ComponentRenderContext,
-    key: string
-  ) {
+  has({ _: instance }: ComponentRenderContext, key: string) {
+    const { data, setupState, accessCache, ctx, type, appContext } = instance
     let normalizedProps
     return (
       accessCache![key] !== undefined ||
       (data !== EMPTY_OBJ && hasOwn(data, key)) ||
       (setupState !== EMPTY_OBJ && hasOwn(setupState, key)) ||
-      ((normalizedProps = normalizePropsOptions(type)[0]) &&
+      ((normalizedProps = normalizePropsOptions(instance, type)[0]) &&
         hasOwn(normalizedProps, key)) ||
       hasOwn(ctx, key) ||
       hasOwn(publicPropertiesMap, key) ||
@@ -451,7 +447,7 @@ export function exposePropsOnRenderContext(
   instance: ComponentInternalInstance
 ) {
   const { ctx, type } = instance
-  const propsOptions = normalizePropsOptions(type)[0]
+  const propsOptions = normalizePropsOptions(instance, type)[0]
   if (propsOptions) {
     Object.keys(propsOptions).forEach(key => {
       Object.defineProperty(ctx, key, {