Jest get variable using composition api Vue3 quasar

Question

I'm trying make a test for a variable, but I get undefined when I try access the value:

Component where I defined the variable enter image description here

setup(props, context) {
    const name = ref('Josue');
    return {
      name,
    }
 }

Test enter image description here

import { mount, createLocalVue, shallowMount } from '@vue/test-utils'
import QBUTTON from './demo/QBtn-demo.vue'
import index from '../../../src/pages/Index.vue'
import * as All from 'quasar'
import compositionApi from '@vue/composition-api';

const localVue = createLocalVue()
localVue.use(compositionApi)

describe('Index', () => {
  it('is a Vue instance',async () => {
    const wrapper = mount(index, { localVue })
    await wrapper.vm.$forceUpdate();
    expect(wrapper.vm.$data.nombre).toBe('Josue')
  })
})

Error

  Expected: "Josue"
  Received: undefined

  116 |     const wrapper = mount(index, { localVue })
  117 |     await wrapper.vm.$forceUpdate();
> 118 |     expect(wrapper.vm.$data.nombre).toBe('Josue')
      |                                     ^
  119 |   })
  120 | })

I got undefined from wrapper.vm.$data.nombre, but if I use:

data () {
    return {
      name: 'Josue',
    }
},

...it works. I dont know how to access a variable when I use the Composition API.

tony19 · Accepted Answer · 2020-12-03 21:19:22Z

3

That property would be accessed directly through the wrapper.vm (without going through $data):

expect(wrapper.vm.nombre).toEqual('Josue')

answered Dec 3, 2020 at 21:19

tony19

140k23 gold badges281 silver badges354 bronze badges

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

Collectives™ on Stack Overflow

Jest get variable using composition api Vue3 quasar

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related