Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

@vue/test-utils mount() can not infer the type correctly #298

Closed
Yijx opened this issue Jul 12, 2021 · 1 comment
Closed

@vue/test-utils mount() can not infer the type correctly #298

Yijx opened this issue Jul 12, 2021 · 1 comment
Labels
duplicate This issue or pull request already exists

Comments

@Yijx
Copy link

Yijx commented Jul 12, 2021

I have a simple component Loading.vue

<script lang="ts">
import { defineComponent } from 'vue'

export default defineComponent({
  name: 'Loading',
  // props: {
  //   a: {
  //     type: String,
  //     default: '1'
  //   }
  // },
  data () {
    return {
      title: 'loading...'
    }
  },
  methods: {
    setTitle (title: string): void {
      this.title = title
    }
  }
})
</script>

And a simple test file, loading.spec.ts

describe('loading.vue', () => {
  it('should render a Loading component', () => {
    const wrapper = mount(Loading)
    expect(wrapper.find('p').text()).toBe('loading...')
  })
})

but I have a ts error from volar

No overload matches this call.
  The last overload gave the following error.
    Argument of type 'ComponentPublicInstanceConstructor<{ $: ComponentInternalInstance; $data: { title: string; }; $props: Partial<{}> & Omit<Readonly<{} & {}> & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>; ... 10 more ...; $watch(source: string | Function, cb: Function, options?: WatchOptions<...> | undefined): Wa...' is not assignable to parameter of type 'ComponentOptionsWithObjectProps<Readonly<ComponentPropsOptions<Data>>, {}, { title: string; }, {}, { setTitle(title: string): void; }, ComponentOptionsMixin, ... 4 more ..., { ...; } | {}>'.
      Type 'ComponentPublicInstanceConstructor<{ $: ComponentInternalInstance; $data: { title: string; }; $props: Partial<{}> & Omit<Readonly<{} & {}> & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>; ... 10 more ...; $watch(source: string | Function, cb: Function, options?: WatchOptions<...> | undefined): Wa...' is not assignable to type 'ComponentOptionsBase<Readonly<({ [x: number]: string; } & { [iterator]?: IterableIterator<string> | undefined; length?: number | undefined; toString?: string | undefined; toLocaleString?: string | undefined; ... 19 more ...; flat?: unknown[] | undefined; }) | ({} & { ...; })>, ... 8 more ..., { ...; } | {}>'.
        Types of property 'setup' are incompatible.
          Type '((this: void, props: Readonly<LooseRequired<Readonly<{} & {}>>>, ctx: SetupContext<EmitsOptions>) => void | {} | RenderFunction | Promise<...>) | undefined' is not assignable to type '((this: void, props: Readonly<LooseRequired<Readonly<{ [x: number]: string; } & { [iterator]?: IterableIterator<string> | undefined; length?: number | undefined; toString?: string | undefined; toLocaleString?: string | undefined; ... 19 more ...; flat?: unknown[] | undefined; }> | Readonly<...>>>, ctx: SetupContext<...'.
            Type '(this: void, props: Readonly<LooseRequired<Readonly<{} & {}>>>, ctx: SetupContext<EmitsOptions>) => void | {} | RenderFunction | Promise<...>' is not assignable to type '(this: void, props: Readonly<LooseRequired<Readonly<{ [x: number]: string; } & { [iterator]?: IterableIterator<string> | undefined; length?: number | undefined; toString?: string | undefined; toLocaleString?: string | undefined; ... 19 more ...; flat?: unknown[] | undefined; }> | Readonly<...>>>, ctx: SetupContext<....'.
              Types of parameters 'ctx' and 'ctx' are incompatible.
                Type 'SetupContext<string[]>' is not assignable to type 'SetupContext<EmitsOptions>'.
                  Type 'EmitsOptions' is not assignable to type 'string[]'.
                    Type 'ObjectEmitsOptions' is missing the following properties from type 'string[]': length, pop, push, concat, and 28 more.

if i add props option in loading.vue, error is disappear,or i disable Volar extension, error is disappear too。
something wrong with last overload, so how can i resolve this error?
this is @vue/test-utils mount declare

import { FunctionalComponent, ComponentPublicInstance, ComponentOptionsWithObjectProps, ComponentOptionsWithArrayProps, ComponentOptionsWithoutProps, ExtractPropTypes, VNodeProps, ComponentOptionsMixin, DefineComponent, MethodOptions, AllowedComponentProps, ComponentCustomProps, ExtractDefaultPropTypes, EmitsOptions, ComputedOptions, ComponentPropsOptions } from 'vue';
import { MountingOptions } from './types';
import { VueWrapper } from './vueWrapper';
declare type PublicProps = VNodeProps & AllowedComponentProps & ComponentCustomProps;
export declare function mount<V>(originalComponent: {
    new (...args: any[]): V;
    registerHooks(keys: string[]): void;
}, options?: MountingOptions<any>): VueWrapper<ComponentPublicInstance<V>>;
export declare function mount<V, P>(originalComponent: {
    new (...args: any[]): V;
    props(Props: P): any;
    registerHooks(keys: string[]): void;
}, options?: MountingOptions<P & PublicProps>): VueWrapper<ComponentPublicInstance<V>>;
export declare function mount<Props, E extends EmitsOptions = {}>(originalComponent: FunctionalComponent<Props, E>, options?: MountingOptions<Props & PublicProps>): VueWrapper<ComponentPublicInstance<Props>>;
export declare function mount<PropsOrPropOptions = {}, RawBindings = {}, D = {}, C extends ComputedOptions = ComputedOptions, M extends MethodOptions = MethodOptions, Mixin extends ComponentOptionsMixin = ComponentOptionsMixin, Extends extends ComponentOptionsMixin = ComponentOptionsMixin, E extends EmitsOptions = Record<string, any>, EE extends string = string, PP = PublicProps, Props = Readonly<ExtractPropTypes<PropsOrPropOptions>>, Defaults = ExtractDefaultPropTypes<PropsOrPropOptions>>(component: DefineComponent<PropsOrPropOptions, RawBindings, D, C, M, Mixin, Extends, E, EE, PP, Props, Defaults>, options?: MountingOptions<Partial<Defaults> & Omit<Props & PublicProps, keyof Defaults>, D>): VueWrapper<InstanceType<DefineComponent<PropsOrPropOptions, RawBindings, D, C, M, Mixin, Extends, E, EE, PP, Props, Defaults>>>;
export declare function mount<Props = {}, RawBindings = {}, D = {}, C extends ComputedOptions = {}, M extends Record<string, Function> = {}, E extends EmitsOptions = Record<string, any>, Mixin extends ComponentOptionsMixin = ComponentOptionsMixin, Extends extends ComponentOptionsMixin = ComponentOptionsMixin, EE extends string = string>(componentOptions: ComponentOptionsWithoutProps<Props, RawBindings, D, C, M, E, Mixin, Extends, EE>, options?: MountingOptions<Props & PublicProps, D>): VueWrapper<ComponentPublicInstance<Props, RawBindings, D, C, M, E, VNodeProps & Props>>;
export declare function mount<PropNames extends string, RawBindings, D, C extends ComputedOptions = {}, M extends Record<string, Function> = {}, E extends EmitsOptions = Record<string, any>, Mixin extends ComponentOptionsMixin = ComponentOptionsMixin, Extends extends ComponentOptionsMixin = ComponentOptionsMixin, EE extends string = string, Props extends Readonly<{
    [key in PropNames]?: any;
}> = Readonly<{
    [key in PropNames]?: any;
}>>(componentOptions: ComponentOptionsWithArrayProps<PropNames, RawBindings, D, C, M, E, Mixin, Extends, EE, Props>, options?: MountingOptions<Props & PublicProps, D>): VueWrapper<ComponentPublicInstance<Props, RawBindings, D, C, M, E>>;
export declare function mount<PropsOptions extends Readonly<ComponentPropsOptions>, RawBindings, D, C extends ComputedOptions = {}, M extends Record<string, Function> = {}, E extends EmitsOptions = Record<string, any>, Mixin extends ComponentOptionsMixin = ComponentOptionsMixin, Extends extends ComponentOptionsMixin = ComponentOptionsMixin, EE extends string = string>(componentOptions: ComponentOptionsWithObjectProps<PropsOptions, RawBindings, D, C, M, E, Mixin, Extends, EE>, options?: MountingOptions<ExtractPropTypes<PropsOptions> & PublicProps, D>): VueWrapper<ComponentPublicInstance<ExtractPropTypes<PropsOptions>, RawBindings, D, C, M, E, VNodeProps & ExtractPropTypes<PropsOptions>>>;
export declare const shallowMount: typeof mount;
export {};

@johnsoncodehk
Copy link
Member

johnsoncodehk commented Jul 12, 2021

You need to use Loading as typeof Loading['__VLS_raw'], or add test scripts to tsconfig exclude option for now. see #94.

@johnsoncodehk johnsoncodehk added the duplicate This issue or pull request already exists label Jul 12, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
duplicate This issue or pull request already exists
Projects
None yet
Development

No branches or pull requests

2 participants