Home / Questions / 272760
Accepted
Fernando Azarías
Asked: 2020-06-18 13:17:02 +0800 CST 2020-06-18 13:17:02 +0800 CST

Unit testing a vue instance method

  • 772

I am learning how to unit test in vue. I would like to know how to test a method. I am using jest and vue test utils. In the vue documentation I can't find anything similar to test a method.

So far, what I have is the following

introducir el código aquíimport { shallowMount } from '@vue/test-utils'
import Usuario from '@/components/Usuario.vue'

describe('componente Usuario.vue', () => {
it('calls testMethod on mount', () => {
    const wrapper = shallowMount(Usuario, {
        methods: {
            activarUsuario
        }
    })
    wrapper.vm.activarUsuario = jest.fn()

    expect(activarUsuario).toBeCalled()
});

})

vue.js

1 Answers

  1. Best Answer

    If you need to test that the button has been called and mock the function you can do it like this:

    import { shallowMount } from '@vue/test-utils'
import Usuario from '@/components/Usuario.vue'

describe('componente Usuario.vue', () => {
it('calls testMethod on mount', () => {
    const activarUsuario = jest.fn();
    const wrapper = shallowMount(Usuario, {
        methods: {
            activarUsuario
        }
    })
    expect(activarUsuario).toHaveBeenCalledTimes(0);
    const button = wrapper.find('button'); // aqui buscarias el elemento que ejecuta el metodo
    button.trigger('click'); //simulamos el evento click
    expect(activarUsuario).toHaveBeenCalledTimes(1); // validamos el click
});

    You can also test the method directly like this

    import { shallowMount } from '@vue/test-utils'
import Usuario from '@/components/Usuario.vue'

describe('componente Usuario.vue', () => {
it('calls testMethod on mount', () => {
    const wrapper = shallowMount(Usuario);
    wrapper.vm.activarUsuario();
    expect(wrapper.vm.usuarioActivado).toBe(true); // aqui validarias lo que esperas que haya hecho tu metodo
});
    • 1