fix: wrapping functional components

vuejs · rudyxu1102 · Dec 31, 2022 · Jan 1, 2023 · Jan 1, 2023 · Jan 3, 2023
commit e2d4ec893e66085a303c461cbfa61d6daa290c6a
diff --git a/packages/dts-test/defineComponent.test-d.tsx b/packages/dts-test/defineComponent.test-d.tsx
@@ -1380,6 +1380,28 @@ describe('define attrs', () => {
      />
    )
  })
+
+  test('wrap components w/ functional component', () => {
+    const Child = defineComponent((props: { foo: string }, ctx) => {
+      return () => <div>{props.foo}</div>
+    })
+    const Comp = defineComponent({
+      props: {
+        bar: Number
+      },
+      attrs: Object as AttrsType<typeof Child>,
+      created() {
+        expectType<unknown>(this.$attrs.class)
+        expectType<unknown>(this.$attrs.style)
+      },
+      render() {
+        return <Child {...this.$attrs} />
+      }
+    })
+    expectType<JSX.Element>(
+      <Comp class={'str'} style={'str'} bar={1} foo={'str'} />
+    )
+  })
 })

 // #5948

diff --git a/packages/runtime-core/src/componentOptions.ts b/packages/runtime-core/src/componentOptions.ts
@@ -61,8 +61,7 @@ import {
  ComponentPublicInstance,
  isReservedPrefix,
  IntersectionMixin,
-  UnwrapMixinsType,
-  ComponentPublicInstanceConstructor
+  UnwrapMixinsType
 } from './componentPublicInstance'
 import { warn } from './warning'
 import { VNodeChild } from './vnode'
@@ -420,8 +419,10 @@ export type ComponentOptionsMixin = ComponentOptionsBase<

 declare const AttrSymbol: unique symbol
 export type AttrsType<T extends Record<string, any> = Record<string, any>> = {
-  [AttrSymbol]?: T extends ComponentPublicInstanceConstructor
-    ? InstanceType<T>['$props']
+  [AttrSymbol]?: T extends new () => { $props: infer P }
+    ? NonNullable<P>
+    : T extends (props: infer P, ...args: any) => any
+    ? P
    : T
 }