Bug: Regression in type definitions, types in package have errors

[mgdodge]

Describe the bug

A typescript error is thrown during type-check of project, caused by bad typescript definitions in @vue/test-utils v2.0.0.

node_modules/@vue/test-utils/dist/components/RouterLinkStub.d.ts:1:38 - error TS2707: Generic type 'DefineComponent' requires between 0 and 12 type arguments.

  1 export declare const RouterLinkStub: import("vue").DefineComponent<{
                                         ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  2     to: {
    ~~~~~~~~~
...
 37     custom: boolean;
    ~~~~~~~~~~~~~~~~~~~~
 38 }>;
    ~~

node_modules/@vue/test-utils/dist/mount.d.ts:24:602 - error TS2707: Generic type 'DefineComponent' requires between 0 and 12 type arguments.

24 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, Provide extends ComponentProvideOptions = ComponentProvideOptions, RawOptions extends {} = {}, PP = PublicProps, Props = Readonly<ExtractPropTypes<PropsOrPropOptions>>, Defaults = ExtractDefaultPropTypes<PropsOrPropOptions>>(component: DefineComponent<PropsOrPropOptions, RawBindings, D, C, M, Mixin, Extends, E, EE, Provide, RawOptions, PP, Props, Defaults>, options?: MountingOptions<Partial<Defaults> & Omit<Props & PublicProps, keyof Defaults>, D> & Record<string, any>): VueWrapper<InstanceType<DefineComponent<PropsOrPropOptions, RawBindings, D, C, M, Mixin, Extends, E, EE, Provide, RawOptions, PP, Props, Defaults>>>;



                                                                                                       ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/@vue/test-utils/dist/mount.d.ts:24:866 - error TS2707: Generic type 'DefineComponent' requires between 0 and 12 type arguments.

24 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, Provide extends ComponentProvideOptions = ComponentProvideOptions, RawOptions extends {} = {}, PP = PublicProps, Props = Readonly<ExtractPropTypes<PropsOrPropOptions>>, Defaults = ExtractDefaultPropTypes<PropsOrPropOptions>>(component: DefineComponent<PropsOrPropOptions, RawBindings, D, C, M, Mixin, Extends, E, EE, Provide, RawOptions, PP, Props, Defaults>, options?: MountingOptions<Partial<Defaults> & Omit<Props & PublicProps, keyof Defaults>, D> & Record<string, any>): VueWrapper<InstanceType<DefineComponent<PropsOrPropOptions, RawBindings, D, C, M, Mixin, Extends, E, EE, Provide, RawOptions, PP, Props, Defaults>>>;





                                 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/@vue/test-utils/dist/stubs.d.ts:20:90 - error TS2707: Generic type 'DefineComponent' requires between 0 and 12 type arguments.

 20 export declare const createStub: ({ name, type, renderStubDefaultSlot }: StubOptions) => import("vue").DefineComponent<any, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
                                                                                             ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 21     [key: string]: any;
    ~~~~~~~~~~~~~~~~~~~~~~~
...
 31     [x: string]: any;
    ~~~~~~~~~~~~~~~~~~~~~
 32 }>;
    ~~


Found 4 errors in 3 files.

Errors  Files
     1  node_modules/@vue/test-utils/dist/components/RouterLinkStub.d.ts:1
     2  node_modules/@vue/test-utils/dist/mount.d.ts:24
     1  node_modules/@vue/test-utils/dist/stubs.d.ts:20

To Reproduce

Minimal Repro: https://github.com/mgdodge/vue-test-utils-bug

After running npm ci to install, repo will have v2.0.0-rc.21 of test-utils. Trying to run npm run type-check:tests will pass, types are just fine.

Edit package.json to use "@vue/test-utils": "2.0.0", run npm i to install new version, then run npm run type-check:tests again. Type-check will fail due to type errors.

Expected behavior

Existing type-check scripts should work - there should not be a regression.

Related information:

• @vue/test-utils version: 2.0.0
• Vue version: 3.2.36
• node version: 14.18.1
• npm (or yarn) version: 6.14.15

Additional context

[mgdodge]

I am aware that setting "skipLibCheck": true in my tsconfig.json will suppress the error, but that is not the point of this bug report. The point is that the typescript definitions have regressed and are invalid where before they were not.

skipLibCheck is something of an escape hatch, in my opinion, and has the potential of affecting the accuracy of type-checking elsewhere in an app. In my projects, I don't use it, and instead opt to use patch-package to fix problematic typescript rules which I have verified do not affect a particular application. The sample repo includes a couple examples of that, related to this issue with the type definitions from Vue itself.

I believe this is a genuine bug since code which has worked perfectly in the last 2.0.0 RC is now no longer working in the final 2.0.0.

[cexbrayat]

Hi @mgdodge

Thanks for the report. Projects usually rely on skipLickCheck: true (which is recommended by the Vue and Angular team for example), so, for you mental health and compilation speed, you could give it a try 😉

Anyway, the type definition changed in Vue itself recently (with more generic parameters for DefineComponent, see vuejs/core@98b821d). We probably need to impact some methods of VTU to reflect that.

Would you like to give it a try and open a PR if that's something important to you?

[mgdodge]

As indicated in my above comment, I was already aware of skipLibCheck but have chosen not to use it, for the reasons stated. Am I not using the most recent version of Vue? If the type definitions in Vue have changed in a way which makes this a non-issue, then I would think this library would bump its dependency to keep in sync with the new Vue version.

Regardless, this is a breaking change to me because it requires me to make changes to my code that I would not have had to make otherwise. It is important to me, but I don't know enough about this project to submit a PR at present. I struggle to see what changed between the latest RC and the final version.

[cexbrayat]

The changes are in Vue itself in the commit I linked. Maybe there are some things we can improve in VTU, like the errors you see in mount.ts: mount should reflect the same generic parameters that DefineComponent has. You can take a look at https://github.com/vuejs/test-utils/blob/main/src/mount.ts#L125 and check if there is no mistake in the overload signatures.

The other errors look a bit dubious, as VTU returns the result of a call to defineComponent. So it should be compatible with the type DefineComponent. Maybe this is an upstream issue. You can take a look at the generated RouterLinkStub.d.ts file for example and check if anything seems off in the generic parameters.

[cexbrayat]

The issue is in fact because the latest Vue release changed some types in vuejs/core@8071ef4

I landed a few fixes (#1544 #1545) that should now make the VTU types work with Vue v3.2.36 (but not with Vue v3.2.34 anymore, hence why skipLibCheck is still the recommended way to go).