vuejs / test-utils

Vue Test Utils for Vue 3
https://test-utils.vuejs.org
MIT License
1.04k stars 244 forks source link

Bug: findComponent doesn't work properly if child component is root of parent component #2300

Closed ElVisPL closed 9 months ago

ElVisPL commented 10 months ago

Describe the bug This is known issue in vue test utils v1, but the previous workaround doesn't work anymore

<template>
  <WelcomeItem :test="2"> </WelcomeItem>
</template>

vs

<template>
  <div>
    <WelcomeItem :test="2"> </WelcomeItem>
  </div>
</template>

To Reproduce

https://stackblitz.com/edit/github-orekbd?file=src%2Fcomponents%2F__tests__%2FTheWelcome.spec.ts

run yarn test:utils TheWelcome

Expected behavior

findComponent.props() returns props of child component

Related information:

In vue test utils v1 there was workaround:

const childWrapper = createWrapper(wrapper.vm.$children[0])

Now there is no wrapper.vm.$children

cexbrayat commented 10 months ago

This is strange indeed. Would you be able to look into it and open a PR?

freakzlike commented 9 months ago

Instead of using the tag name wrapper.findComponent('welcome-item-stub') you can use the component name wrapper.findComponent({ name: 'WelcomeItem' }) which correctly returns the props of the component.

I guess the selector does not correctly resolve the component. Therefore the props are not treated correctly and instead returned by .attributes(). I will try to investigate the code, when I got some time