[Vuejs]-VueJs 3 / Composition API and Jest โ€“ testing input component event emitting

0๐Ÿ‘

โœ…

Iโ€™ve finally managed to find the fix reading one of the answers here Issues during testing #202

What I needed to do was to instruct Vue to use composition api and slightly amend my assertions.

import Vue from 'vue';
import { TextInput } from '@/src/index';
import { shallowMount } from '@vue/test-utils';
import CompositionApi from '@vue/composition-api';

Vue.use(CompositionApi);

describe('TextInput test', () => {
  it('Emits input event', async () => {
    const wrapper = shallowMount(TextInput);

    const input = wrapper.find('input');
    input.setValue('Jon');
    input.trigger('keyup');

    await wrapper.vm.$nextTick();

    const emitted = wrapper.emitted('input');

    expect(emitted).toHaveLength(2);
    expect(emitted[1]).toEqual(['Jon']);
  });
})

Leave a comment