vue-test-utils + typescript type for wrapper.vm

Question

There is a problem here. Have used typescript vue-test-utils and tried to manipulate the values ​​of the test like: wrapper.vm.aCoolRefValueToManipulate = 'Something cooler'?

Well, I tried it. It works, but the ts linter goes crazy on this because it doesn't know what aCoolRefValueToManipulate is in vm.

Does anyone know how to solve this problem?

linter tell me:

Property 'showTopDown' does not exist on type '{ $: ComponentInternalInstance; $data: {}; $props: Partial<{}> & Omit<Readonly<ExtractPropTypes<{}>> & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>; ... 10 more ...; $watch(source: string | Function, cb: Function, options?: WatchOptions<...> | undefined): WatchStopHandle; } & Readonly<...> & Sha...'.ts(2339)

---

solution

Some cool guys helped me out on the official Vue Discord server.

(wrapper.vm as any).aCoolRefValueToManipulate 

Answer 1

Do we have any other way to access wrapper.vm without using "any"?

I just found this thing to try:

type TestWrapper<T> = VueWrapper<ComponentPublicInstance & T>
let wrapper: TestWrapper<Partial<{ myMethod: () => void }>>

wrapper.vm.myMethod?.()