fix(types): mount() typing compatibility for vue 3.3.8 (#2240)

Author: pikax

src/mount.ts

@@ -18,10 +18,10 @@ type WithArray<T> = T | T[]
 
 type ComponentData<T> = T extends { data?(...args: any): infer D } ? D : {}
 
-export type ComponentMountingOptions<T> = Omit<
-  MountingOptions<ComponentProps<T>, ComponentData<T>>,
-  'slots'
-> & {
+export type ComponentMountingOptions<
+  T,
+  P extends ComponentProps<T> = ComponentProps<T>
+> = Omit<MountingOptions<P, ComponentData<T>>, 'slots'> & {
   slots?: {
     [K in keyof ComponentSlots<T>]: WithArray<
       | ShimSlotReturnType<ComponentSlots<T>[K]>
@@ -43,17 +43,20 @@ export function mount<
           ? { [key in PropNames extends string ? PropNames : string]?: any }
           : Props
       >
-    : DefineComponent
+    : DefineComponent,
+  P extends ComponentProps<C> = ComponentProps<C>
 >(
   originalComponent: T,
-  options?: ComponentMountingOptions<C>
+  options?: ComponentMountingOptions<C, P>
 ): VueWrapper<
   ComponentProps<C> & ComponentData<C> & ComponentExposed<C>,
   ComponentPublicInstance<
     ComponentProps<C>,
-    ComponentData<C> & ComponentExposed<C>
+    ComponentData<C> & ComponentExposed<C> & Omit<P, keyof ComponentProps<C>>
   >
->
+> & {
+  LOOL: Exclude<P, ComponentProps<C>>
+}
 
 // implementation
 export function mount(

test-dts/mount.d-test.ts

@@ -66,7 +66,7 @@ const AppWithProps = {
   props: {
     a: {
       type: String,
-      required: true
+      required: true as true
     }
   },
   template: ''
@@ -91,7 +91,7 @@ expectError(
 )
 
 const AppWithArrayProps = {
-  props: ['a'],
+  props: ['a'] as ['a'],
   template: ''
 }
 
@@ -134,16 +134,16 @@ mount(AppWithoutProps, {
 // Functional tests
 
 expectError(
-  mount((props: { a: 1 }) => { }, {
+  mount((props: { a: 1 }) => {}, {
     props: {
       // @ts-expect-error wrong props
-      a: '222'
+      a: '222' 
     }
   })
 )
 
 expectType<number>(
-  mount((props: { a: number }, ctx: any) => { }, {
+  mount((props: { a: number }, ctx: any) => {}, {
     props: {
       a: 22
     }
@@ -247,7 +247,7 @@ class CustomClassComponent<Props extends {} = {}> {
     return this.props
   }
   context: SetupContext
-  render(): VNodeChild { }
+  render(): VNodeChild {}
 }
 class NoPropCustomClassComponent extends CustomClassComponent {
   count = ref(0)
@@ -281,15 +281,17 @@ class WithPropCustomClassComponent extends CustomClassComponent<CustomClassCompo
 
 expectError(
   mount(
-    WithPropCustomClassComponent as typeof WithPropCustomClassComponent & (new () => { $props: CustomClassComponentProps }),
+    WithPropCustomClassComponent as typeof WithPropCustomClassComponent &
+      (new () => { $props: CustomClassComponentProps }),
     {
       // @ts-expect-error should has props error
       props: {}
     }
   )
 )
 mount(
-  WithPropCustomClassComponent as typeof WithPropCustomClassComponent & (new () => { $props: CustomClassComponentProps }),
+  WithPropCustomClassComponent as typeof WithPropCustomClassComponent &
+    (new () => { $props: CustomClassComponentProps }),
   {
     props: { size: 'small' }
   }

test-dts/shallowMount.d-test.ts

@@ -38,7 +38,7 @@ const AppWithProps = {
   props: {
     a: {
       type: String,
-      required: true
+      required: true as true
     }
   },
   template: ''
@@ -65,7 +65,7 @@ expectError(
 )
 
 const AppWithArrayProps = {
-  props: ['a'],
+  props: ['a'] as ['a'],
   template: ''
 }