feat: include component and wrapper in return type for vue mount adapter#24479
Conversation
|
Thanks for taking the time to open a PR!
|
ZachJW34
left a comment
There was a problem hiding this comment.
Couple small comments but looks and works great, will approve but would like to see comments addressed before merge
…ue-24342-update-vue-wrapper-return-type
|
Webkit system tests 🤷♂️ Everything else looks 💯 |
marktnoonan
left a comment
There was a problem hiding this comment.
Works great, chaining off the mount to get the wrapper works nice, putting the component instance in an alias and grabbing it there works nicely too. Probably no need for users to rely on Cypress.vueWrapper any more which will be sweet.
warrensplayer
left a comment
There was a problem hiding this comment.
This PR already got merged while I was in the middle of reviewing, but will drop these comments here for future consideration.
| // by returning undefined we keep the previous subject | ||
| // which is the mounted component |
There was a problem hiding this comment.
Comment no longer applicable
| ): Cypress.Chainable<{ | ||
| wrapper: VueWrapper<ComponentPublicInstance<V>> | ||
| component: VueWrapper<ComponentPublicInstance<V>>['vm'] | ||
| }> |
There was a problem hiding this comment.
Still working on my Typescript, but would it make sense to introduce a generic return type like:
type MountReturn<C> = {
wrapper: VueWrapper<C>
component: C
}
to use for the return of all the mount overloads?
Result
export function mount<V extends {}>(
originalComponent: {
new (...args: any[]): V
__vccOpts: any
},
options?: MountingOptions<any> & Record<string, any>
): Cypress.Chainable<MountReturn<V>>
Would that work for all the overload cases?
User facing changelog
Vue Mount adapter now returns an object with both the
VueWrapper(wrapper) and component instance (component).Additional details
Part of CT GA.
Steps to test
You could do
const foo = cy.mount(SomeVueComponent)then observe bothwrapperandcomponentproperties are available on the returned value.wrappercontains all of these methods from Vue Test Utils. Component contains various Vue related things.How has the user experience changed?
You can access the component instance, which is more in line with what other mount adapters do.
PR Tasks
cypress-documentation? NOT YETtype definitions?