Jest: wrapper.find().simulate('keypress', {key: 'Enter', keycode: 13}) is not function

user_4446334 0
Viewed 301

Continue from this question

vue-btn doesn't submit on enter key

I have this sign in page that can login using 'Enter' in keyboard I want to do unit test when simulate enter key on keyboard, it can login automatically

this is the test code that I have

describe('Login.vue', () => {
    const vuetify = new Vuetify()
    const store = new Vuex.Store({
        actions: {
            login: jest.fn()
        }
    })
    const wrapper = mount(Login, { stubs: ['router-link', 'router-view'], store, vuetify })

    it('login using enter key on keyboard', async () => {
        wrapper.setData({ email: 'user@example.com' })
        wrapper.setData({ password: 'Passw0rd' })

        await wrapper.vm.$nextTick()
        wrapper.find('[data-cy="input-password"]').simulate('keypress', {key: 'Enter', keycode: 13})
    })
})

I already did the Integration Test using Cypress, but I want to do the unit test first before submit it into the repository.

Thank you very much

vue.js jestjs javascript
1 Answers

This is what worked for me:

await wrapper.find('#myFieldID').vm.$emit('keypress', {type: 'enter'});

So, in this case, the line should be:

wrapper.find('[data-cy="input-password"]').vm.$emit('keypress', {type: 'Enter'})
user_13963220
Related