vue-test-utils +wrapper.vm 的打字稿类型

Question

这里有一个问题。曾经使用过 typescript + vue-test-utils 并尝试操纵测试的值，例如： wrapper.vm.aCoolRefValueToManipulate = '更酷的东西'?

好吧，我试过了。它有效，但 ts linter 在这个上变得疯狂，因为它不知道 vm 中的 aCoolRefValueToManipulate 是什么。

有人知道如何解决这个问题吗？

linter 告诉我：

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)

---

解决方案

一些很酷的家伙在官方 Vue Discord 服务器上帮助了我。

(wrapper.vm as any).aCoolRefValueToManipulate 

Answer 1

我们是否有其他方法不使用“any”来访问wrapper.vm的方法？

我刚刚发现这个可以尝试的东西：

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

wrapper.vm.myMethod?.()