more changes

Author: pikax

src/baseWrapper.ts

@@ -1,13 +1,19 @@
 import { textContent } from './utils'
 import type { TriggerOptions } from './createDomEvent'
 import {
+  ComponentDefineOptions,
+  ComponentInjectOptions,
+  ComponentInstance,
   ComponentInternalInstance,
   ComponentOptions,
+  ComponentOptionsMixin,
   ComponentPublicInstance,
   ComputedOptions,
   CreateComponentPublicInstance,
+  EmitsOptions,
   FunctionalComponent,
   MethodOptions,
+  SlotsType,
   nextTick
 } from 'vue'
 import { createDOMEvent } from './createDomEvent'
@@ -108,16 +114,58 @@ export default abstract class BaseWrapper<ElementType extends Node>
 
   // searching by string without specifying component results in WrapperLike object
   findComponent<T extends never>(selector: string): WrapperLike
+
   // Find Component Options aka plain object
   findComponent<
-    Props,
-    RawBindings = any,
-    D = any,
-    C extends ComputedOptions = ComputedOptions,
-    M extends MethodOptions = MethodOptions
+    Props = {},
+    RawBindings = {},
+    D = {},
+    C extends ComputedOptions = {},
+    M extends MethodOptions = {},
+    Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
+    Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
+    E extends EmitsOptions = {},
+    EE extends string = string,
+    I extends ComponentInjectOptions = {},
+    II extends string = string,
+    S extends SlotsType = {},
+    Options = {}
   >(
-    selector: ComponentOptions<Props, RawBindings, D, C, M>
-  ): VueWrapper<CreateComponentPublicInstance<Props, RawBindings, D, C, M>>
+    selector: ComponentDefineOptions<
+      Props,
+      RawBindings,
+      D,
+      C,
+      M,
+      Mixin,
+      Extends,
+      E,
+      EE,
+      I,
+      II,
+      S,
+      Options
+    >
+  ): VueWrapper<
+    Props extends DefinedComponent
+      ? ComponentInstance<Props>
+      : CreateComponentPublicInstance<
+          Props,
+          RawBindings,
+          D,
+          C,
+          M,
+          Mixin,
+          Extends,
+          E,
+          Props,
+          {},
+          true,
+          I,
+          S,
+          Options
+        >
+  >
   findComponent<T extends ComponentOptions>(
     selector: string
   ): VueWrapper<
@@ -129,17 +177,19 @@ export default abstract class BaseWrapper<ElementType extends Node>
       infer M
     >
       ? CreateComponentPublicInstance<Props, RawBindings, D, C, M>
-      : VueWrapper<CreateComponentPublicInstance>
+      : CreateComponentPublicInstance
   >
-  // searching for component created via defineComponent results in VueWrapper of proper type
-  findComponent<T extends DefinedComponent>(
-    selector: T | Exclude<FindComponentSelector, FunctionalComponent>
-  ): VueWrapper<InstanceType<T>>
   // searching for functional component results in DOMWrapper
   findComponent<T extends FunctionalComponent>(selector: T): DOMWrapper<Node>
   findComponent<T extends FunctionalComponent>(
     selector: string
   ): DOMWrapper<Element>
+
+  // searching for component created via defineComponent results in VueWrapper of proper type
+  findComponent<T extends DefinedComponent>(
+    selector: T | Exclude<FindComponentSelector, FunctionalComponent>
+  ): VueWrapper<ComponentInstance<T>>
+
   // searching by name or ref always results in VueWrapper
   findComponent<T extends never>(
     selector: NameSelector | RefSelector
@@ -185,7 +235,7 @@ export default abstract class BaseWrapper<ElementType extends Node>
   findAllComponents<T extends never>(selector: string): WrapperLike[]
   findAllComponents<T extends DefinedComponent>(
     selector: T | Exclude<FindAllComponentsSelector, FunctionalComponent>
-  ): VueWrapper<InstanceType<T>>[]
+  ): VueWrapper<ComponentInstance<T>>[]
   findAllComponents<T extends FunctionalComponent>(
     selector: T
   ): DOMWrapper<Node>[]
@@ -292,7 +342,7 @@ export default abstract class BaseWrapper<ElementType extends Node>
   getComponent<T extends never>(selector: string): Omit<WrapperLike, 'exists'>
   getComponent<T extends DefinedComponent>(
     selector: T | Exclude<FindComponentSelector, FunctionalComponent>
-  ): Omit<VueWrapper<InstanceType<T>>, 'exists'>
+  ): Omit<VueWrapper<ComponentInstance<T>>, 'exists'>
   // searching for functional component results in DOMWrapper
   getComponent<T extends FunctionalComponent>(
     selector: T | string

src/interfaces/wrapperLike.ts

@@ -8,7 +8,11 @@ import {
   RefSelector
 } from '../types'
 import { VueWrapper } from '../vueWrapper'
-import { ComponentPublicInstance, FunctionalComponent } from 'vue'
+import {
+  ComponentInstance,
+  ComponentPublicInstance,
+  FunctionalComponent
+} from 'vue'
 import type { DOMWrapper } from '../domWrapper'
 
 export default interface WrapperLike {
@@ -35,7 +39,7 @@ export default interface WrapperLike {
   findComponent<T extends never>(selector: string): WrapperLike
   findComponent<T extends DefinedComponent>(
     selector: T | Exclude<FindComponentSelector, FunctionalComponent>
-  ): VueWrapper<InstanceType<T>>
+  ): VueWrapper<ComponentInstance<T>>
   findComponent<T extends FunctionalComponent>(
     selector: T | string
   ): DOMWrapper<Element>
@@ -50,7 +54,7 @@ export default interface WrapperLike {
   findAllComponents<T extends never>(selector: string): WrapperLike[]
   findAllComponents<T extends DefinedComponent>(
     selector: T | Exclude<FindAllComponentsSelector, FunctionalComponent>
-  ): VueWrapper<InstanceType<T>>[]
+  ): VueWrapper<ComponentInstance<T>>[]
   findAllComponents<T extends FunctionalComponent>(
     selector: string
   ): DOMWrapper<Element>[]
@@ -79,7 +83,7 @@ export default interface WrapperLike {
   getComponent<T extends never>(selector: string): Omit<WrapperLike, 'exists'>
   getComponent<T extends DefinedComponent>(
     selector: T | Exclude<FindComponentSelector, FunctionalComponent>
-  ): Omit<VueWrapper<InstanceType<T>>, 'exists'>
+  ): Omit<VueWrapper<ComponentInstance<T>>, 'exists'>
   // searching for functional component results in DOMWrapper
   getComponent<T extends FunctionalComponent>(
     selector: T | string

src/mount.ts

@@ -35,6 +35,14 @@ export type ComponentMountingOptions<T, P> = Omit<
   }
 } & Record<string, unknown>
 
+// export function mount<T extends { new (): { $props: any } }>(
+//   originalComponent: T,
+//   options?: ComponentMountingOptions<T, ComponentProps<T>>
+// ): //VueWrapper<ComponentInstance<T>>
+// {
+//   props: ComponentProps<T>
+// }
+
 // defineComponent
 export function mount<
   T extends DefineComponent<
@@ -54,7 +62,6 @@ export function mount<
   originalComponent: T,
   options?: ComponentMountingOptions<T, ComponentProps<T>>
 ): VueWrapper<ComponentInstance<T>>
-
 // implementation
 export function mount(
   inputComponent: any,

src/types.ts

@@ -166,4 +166,4 @@ export type VueNode<T extends Node = Node> = T & {
 
 export type VueElement = VueNode<Element>
 
-export type DefinedComponent = new (...args: any[]) => any
+export type DefinedComponent = Component

src/vueWrapper.ts

@@ -3,7 +3,8 @@ import {
   App,
   ComponentPublicInstance,
   VNode,
-  ExtractComponentEmits
+  ExtractComponentEmits,
+  ComponentCustomProperties
 } from 'vue'
 
 import { config } from './config'
@@ -94,8 +95,23 @@ type ResolveEmitRecord<T> = ExtractComponentEmits<T> extends infer E
       }
   : never
 
+declare const aaa: keyof Omit<
+  ComponentPublicInstance,
+  keyof ComponentCustomProperties
+>
+
+// type BetterKeys = keyof Omit<
+//   ComponentPublicInstance,
+//   keyof ComponentCustomProperties
+// >
+// export type ComponentInstance = {
+//   [K in keyof ComponentPublicInstance]?: any
+// } & Record<PropertyKey, any>
+
 export class VueWrapper<
-  T extends ComponentPublicInstance = ComponentPublicInstance
+  T extends Omit<ComponentPublicInstance, '$emit'> & {
+    $emit: any
+  } = ComponentPublicInstance
 > extends BaseWrapper<Node> {
   private readonly componentVM: T
   private readonly rootVM: ComponentPublicInstance | undefined | null

test-dts/findComponent.d-test.ts

@@ -1,5 +1,5 @@
 import { expectType } from './index'
-import { defineComponent } from 'vue'
+import { ComponentInstance, defineComponent } from 'vue'
 import { DOMWrapper, mount, VueWrapper } from '../src'
 import WrapperLike from '../src/interfaces/wrapperLike'
 
@@ -31,11 +31,13 @@ const wrapper = mount(AppWithDefine)
 
 // find by type - component definition
 const componentByType = wrapper.findComponent(ComponentToFind)
-expectType<VueWrapper<InstanceType<typeof ComponentToFind>>>(componentByType)
+expectType<VueWrapper<ComponentInstance<typeof ComponentToFind>>>(
+  componentByType
+)
 
 // find by type - component definition with emits
 const componentWithEmitsByType = wrapper.findComponent(ComponentWithEmits)
-expectType<VueWrapper<InstanceType<typeof ComponentWithEmits>>>(
+expectType<VueWrapper<ComponentInstance<typeof ComponentWithEmits>>>(
   componentWithEmitsByType
 )
 
@@ -50,7 +52,7 @@ expectType<WrapperLike>(componentByString)
 // findi by string with specifying component
 const componentByStringWithParam =
   wrapper.findComponent<typeof ComponentToFind>('.foo')
-expectType<VueWrapper<InstanceType<typeof ComponentToFind>>>(
+expectType<VueWrapper<ComponentInstance<typeof ComponentToFind>>>(
   componentByStringWithParam
 )
 
@@ -66,7 +68,7 @@ expectType<VueWrapper>(componentByRef)
 const componentByRefWithType = wrapper.findComponent<typeof ComponentToFind>({
   ref: 'foo'
 })
-expectType<VueWrapper<InstanceType<typeof ComponentToFind>>>(
+expectType<VueWrapper<ComponentInstance<typeof ComponentToFind>>>(
   componentByRefWithType
 )
 
@@ -78,6 +80,12 @@ expectType<VueWrapper>(componentByName)
 const componentByNameWithType = wrapper.findComponent<typeof ComponentToFind>({
   name: 'foo'
 })
-expectType<VueWrapper<InstanceType<typeof ComponentToFind>>>(
+
+
+declare const aaa : ComponentInstance<typeof ComponentToFind>
+aaa.$props
+componentByNameWithType.vm.$props
+
+expectType<VueWrapper<ComponentInstance<typeof ComponentToFind>>>(
   componentByNameWithType
 )

test-dts/mount.d-test.ts

@@ -85,7 +85,7 @@ mount(AppWithProps, {
 
 expectError(
   mount(AppWithProps, {
-    // @ts-expect-error wrong prop type should not compile
+  // @ts-expect-error wrong prop type should not compile
     props: { a: 2 }
   })
 )

test-dts/wrapper.d-test.ts

@@ -3,6 +3,9 @@ import { defineComponent } from 'vue'
 import { mount } from '../src'
 
 const AppWithDefine = defineComponent({
+  emits: {
+    increment: (arg: { count: number }) => true
+  },
   template: ''
 })
 
@@ -65,10 +68,10 @@ expectType<Element | undefined>(byClassArray[0].element)
 
 // event name without specific type
 let incrementEventWithoutType = wrapper.emitted('increment')
-expectType<unknown[][] | undefined>(incrementEventWithoutType)
+expectType<{ count: number }[] | undefined>(incrementEventWithoutType)
 
 // event name
-let incrementEvent = wrapper.emitted<{ count: number }>('increment')
+let incrementEvent = wrapper.emitted('increment')
 expectType<{ count: number }[] | undefined>(incrementEvent)
 expectType<{ count: number }>(incrementEvent![0])