(VUEX + JEST) Ответ функции не определен - PullRequest
Новая
       55

(VUEX + JEST) Ответ функции не определен

0 голосов
/ 11 декабря 2019

Я столкнулся с проблемой при написании теста. Я не могу вызвать функцию, хотя кажется, что все написано правильно. Пожалуйста, помогите!

index.vue: 

import { shallowMount, createLocalVue } from '@vue/test-utils'
import Vuex from 'vuex'
import Login from '../index'

const localVue = createLocalVue()

localVue.use(Vuex)

describe('Проверяем страницу входа в систему', () => {

    let actions
    let store
    let loginData = {username: 'user1', password: '123'}

    beforeEach (() => {
        actions = {
            handleLogin: jest.fn(),
            login: jest.fn()
        }
        store = new Vuex.Store({
            actions
        })
    })

    it('Отправляем экшн логирования', () => {
        const wrapper = shallowMount(Login, {
            computed: {
                loginBtn: () => true,
                loginStatus: () => '',
                showLogoutEverywhereBtn: () => false
            },
            store,
            localVue
        })

        wrapper.find('.main-form__login-submit').trigger('click')
        expect(actions.handleLogin).toHaveBeenCalled()
    })
});

Вот моя функция в index.vue: 

...
methods: {
        handleLogin(e) {
            e.preventDefault()
            this.$store.dispatch('login', this.loginForm)
                .then((response) => {
                    console.log('login page response: ', response)
                    if (response.id_user !== undefined) {
                        this.$router.push({ path: '/' })
                    }
                })
                .catch((e) => {
                    console.log('ты внутри ошибки: ', e);
                });
        },
...

Вот мой user.js: 

...
actions: {
        // user login
        login({ commit }, userInfo) {
            console.log('store/modules/user.js userInfo: ', userInfo)
            const { username, password } = userInfo
            return new Promise((resolve, reject) => {
                login({ user_login: username.trim(), user_password: password }).then(response => {            
                    const decoded = jwtDecode(response)
                    console.log(decoded)
                    /***********************SOCKET.IO***************************/
                    let data = { userId: decoded.id_user, page: 'login' }
                    socketUrl.emit('authorize', data, (flag) => {
                        console.log('Main authorize here.')
                        console.log('This is store token id:', decoded.id_user)
                        console.log(flag)
                        if (decoded.status === 0) {
                            commit('CHANGE_SELECTED_USER_STATUS_ID', 392)
                            console.log(decoded.full_name)
                            // commit('SET_TOKEN', decoded)
                            commit('AUTH_SUCCESS', decoded)
                            if (flag) {
                                resolve(decoded)
                                console.log('This is decoded: ', decoded.statuses[0])
                                getStatusesArray().then(response => {
                                    console.log('This is presencestatus data:', response)

                                    commit('UPDATE_STATUS', response)
                                })
                            } else {
                                commit('AUTH_ERROR')
                            }
                            resolve() // TODO: зачем это здесь?
                        } else {
                            commit('AUTH_ERROR')
                        }
                    })
                    socketUrl.on('kick', (message) => {
                        console.log('store.js socket: ', message)
                        commit('DUPLICATE_LOGIN', message.text)
                    })
                    socketUrl.on('message', () => {
                        commit('AUTH_ERROR')
                    })
                    /***********************SOCKET.IO***************************/
                }).catch(error => {
                    console.log('store/modules/user.js login error: ', error)
                    commit('AUTH_ERROR')
                    reject(error)
                })
            })
        },

        logout(state, payload) {
            state = null
            console.log('Logout userId: ', payload)
            socketUrl.emit('disconnectUser', { userId: payload }) 

            return new Promise ((resolve, reject) => {
                logout({ userId: payload })
                    .then(response => {
                        console.log('logout function', response)
                        resolve(response)
                    })
                    .catch((e) => {
                        console.log('logout error: ', e)
                        reject(e)
                    })
            }) 
        },
...

Буду очень признателен всем, кто поможет. Поскольку я новичок в тестировании, эта проблема отнимает у меня много времени. Может быть, где-то мне нужно передать параметры функции (я не уверен, где именно). Заранее спасибо!

1 Ответ

1 голос
/ 11 декабря 2019

Теперь я вижу это:

Смотри, ты издеваешься handleLogin как магазинное действие. Но это не ваш магазин действий. Это ваш метод в компоненте.

Итак, что вам нужно сделать, это: 

... // your previous code

wrapper.setMethods({ handleLogin: jest.fn() })  // add this line here
wrapper.find('.main-form__login-submit').trigger('click')

... // your next code
...