Why is wrapper.findComponent not working for @vue/test-utils

Question

When I try using wrapper.findComponent, I get the following error:

ErrorWrapper { selector: { ref: 'loginTab' } }

I have searched online but to no avail. Here is my test code:

describe('Sign-Up Test Cases', () => {
    const wrapper = mount(SignUp, {
        methods: {
            getProv: jest.fn()
        },
        localVue
    })
    
    it('Dialog contains a Login Input Field', () => {
        console.log(wrapper.findComponent({ ref: 'loginTab' }))
        expect(wrapper.findComponent({ ref: 'loginTab' }))
    })
})

localVue is already defined. Check the it statement where I am using the findComponent function.

UPDATE: Something else I tried.

I tried this and it didn't work.

import Vuetify, {VTab} from 'vuetify/lib'
// Some Code here
console.log(wrapper.findComponent(VTab))

and it didn't work. I got the following error:

ErrorWrapper {selector: [Function: VueComponent]}

Adri HM · Accepted Answer · 2022-01-01 16:34:30Z

-1

You have to import the component and use it as payload for the findComponent method:

const VTab = {
   template: '<div><slot></div>
}

const wrapper = shallowMount(SignUp, {
        global: {
           stubs: { VTab }
        },
    })

wrapper.findComponent(VTab)

edited Jan 1, 2022 at 16:34

answered Dec 30, 2021 at 17:51

Adri HM

3,2103 gold badges22 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Cacious Over a year ago

I tried this and it didn't work. import Vuetify, {VTab} from 'vuetify/lib' and console.log(wrapper.findComponent(VTab)) and it didn't work. I got the following error: ErrorWrapper {selector: [Function: VueComponent]}

Adri HM Over a year ago

If it's a component from vuetify, you have to stub the component. I change my answer

Oyekeye Sam Over a year ago

were you able to resolve this?

Adri HM Over a year ago

can you explain more your problem ?

Collectives™ on Stack Overflow

Why is wrapper.findComponent not working for @vue/test-utils

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related