Skip to content

fix(types): make compatible with Vue 2.5 and TypeScript 2.6 #317

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.

Sign up for GitHub

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

Merged
merged 4 commits into from
Jan 3, 2018
Merged

fix(types): make compatible with Vue 2.5 and TypeScript 2.6 #317

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
30bf82e
chore: bump types related deps
ktsn Jan 1, 2018
554072c
fix(types): make compatible with Vue 2.5 and TypeScript 2.6
ktsn Jan 1, 2018
308b1bc
chore: bump vue-loader
ktsn Jan 1, 2018
8591b33
fix(types): use never type instead of Vue
ktsn Jan 3, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
fix(types): make compatible with Vue 2.5 and TypeScript 2.6
  • Loading branch information
@ktsn
ktsn committed Jan 1, 2018
commit 554072c60e33e6d1133328c69a8f3615db50850a
19 changes: 14 additions & 5 deletions types/index.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,9 @@
import Vue, { VNodeData, Component, ComponentOptions, FunctionalComponentOptions } from 'vue'
import Vue, { VNodeData, ComponentOptions, FunctionalComponentOptions } from 'vue'

export type Component =
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If Component type from vue package fails, it probably means we need to fix it in the main repo. Would you like to point out the failing usage?

Copy link
Member Author

@ktsn ktsn Jan 2, 2018 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Indeed. I found the Component type always has the base Vue type for this type of Data and Method in default. That fails type checking if ComponentOptions has different type: https://github.com/vuejs/vue-test-utils/blob/dev/types/test/resources.ts#L9

Maybe we should change the default type parameters of Component (and AsyncComponent) to {}?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Shall we merge this now and update the Component type here later when it's fixed in the main repo?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's merge it now. We can change it later after new Vue is released.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ktsn The problem is that Component isn't correctly setting up type bound.

ComponentOption<V> is contravariant, that is, ComponentOption<Normal> isn't a sub type of ComponentOption<Vue>, but of ComponentOption<never>.

beforeCreate in componentOption would also break assignment here if contravariant method was checked. But currently it is not https://github.com/Microsoft/TypeScript/wiki/What%27s-new-in-TypeScript#note

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@HerringtonDarkholme Thanks for clarify the problem! I didn't realize we can use never for the default generic type.

I'll change the ComponentOptions's 1st type parameter to never for now before this PR is merged.

| typeof Vue
| FunctionalComponentOptions<{}>
| ComponentOptions<Vue, {}, {}, {}, {}>

/**
* Utility type to declare an extended Vue constructor
Expand Down Expand Up @@ -109,21 +114,25 @@ interface MountOptions<V extends Vue> extends ComponentOptions<V> {
listeners?: object
}

type ThisTypedMountOptions<V extends Vue> = MountOptions<V> & ThisType<V>

type ShallowOptions<V extends Vue> = MountOptions<V>

type ThisTypedShallowOptions<V extends Vue> = ShallowOptions<V> & ThisType<V>

interface VueTestUtilsConfigOptions {
stubs?: Stubs
}

export declare function createLocalVue (): typeof Vue
export declare let config: VueTestUtilsConfigOptions

export declare function mount<V extends Vue> (component: VueClass<V>, options?: MountOptions<V>): Wrapper<V>
export declare function mount<V extends Vue> (component: ComponentOptions<V>, options?: MountOptions<V>): Wrapper<V>
export declare function mount<V extends Vue> (component: VueClass<V>, options?: ThisTypedMountOptions<V>): Wrapper<V>
export declare function mount<V extends Vue> (component: ComponentOptions<V>, options?: ThisTypedMountOptions<V>): Wrapper<V>
export declare function mount (component: FunctionalComponentOptions, options?: MountOptions<Vue>): Wrapper<Vue>

export declare function shallow<V extends Vue> (component: VueClass<V>, options?: ShallowOptions<V>): Wrapper<V>
export declare function shallow<V extends Vue> (component: ComponentOptions<V>, options?: ShallowOptions<V>): Wrapper<V>
export declare function shallow<V extends Vue> (component: VueClass<V>, options?: ThisTypedShallowOptions<V>): Wrapper<V>
export declare function shallow<V extends Vue> (component: ComponentOptions<V>, options?: ThisTypedShallowOptions<V>): Wrapper<V>
export declare function shallow (component: FunctionalComponentOptions, options?: ShallowOptions<Vue>): Wrapper<Vue>

export declare let TransitionStub: Component | string | true
Expand Down
1 change: 0 additions & 1 deletion types/tsconfig.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@
"compilerOptions": {
"module": "es2015",
"moduleResolution": "node",
"allowSyntheticDefaultImports": true,
"strict": true,
"noEmit": true
},
Expand Down