Better typings in props mounting options

Currently we have pretty good typings. But there are some limitations.

If there is a ts file that exports defineComponent, all is well. For example:

const Foo = defineComponent({
  props: {
    bar: { type: String }
  }
})

// in a test

mount(Foo, {
  props: {
    bar: 123 // ide warning! bar should be a string
  }
})

However we cannot get this level of type safety when importing a vue. file, since it’s not a regular TS file (needs to be parsed by SFC compiler first), or at least this is the case with this kind of simple shim:

declare module '*.vue' {
  import { ComponentOptions } from 'vue'
  var component: ComponentOptions
  export default component
}

What are our options? 🤔

1. some kind of language server like vue-developer-experience
2. Export interface Props from the SFC and make mount take a generic param? Eg mount<Props>(...). Not really ideal but an option we can consider.
3. ???

[lmiller1990]

The other workaround would be to define your component in a ts file, then

<script lang="ts" src="./component.ts">

in your vue file - not ideal, but honestly not terrible, at least for until the tooling matures.

[lmiller1990]

I do not think there is much else we can do in VTU for this. Some kind of dev server wlil be needed, which is outside the scope of VTU atm. This is explored more here: https://github.com/znck/vue-developer-experience