Можем ли мы изменить действие Vuex для юнит-тестирования? - PullRequest
Новая
       29

Можем ли мы изменить действие Vuex для юнит-тестирования?

0 голосов
/ 08 мая 2019

Я создал хранилище в своем тестовом файле 

import {
shallowMount,
createLocalVue
} from '@vue/test-utils'
import Vuex from 'vuex'
import Actions from '../../../src/components/Actions'

const localVue = createLocalVue()

localVue.use(Vuex)

describe('Actions.vue', () => {
  let actions
  let store

beforeEach(() => {
    actions = {
        actionClick: jest.fn(() => Promise.resolve({}))
    }
    store = new Vuex.Store({
        actions
    })
})

it('should go to then block', () => {
    const wrapper = shallowMount(Actions, {
        store,
        localVue
    })
    //goes to then block
})

it('should go to catch block', () => {
    actions.actionClick = jest.fn(() => Promise.reject(new Error()))
    const wrapper = shallowMount(Actions, {
        store,
        localVue
    })
    //still goes to then block and not the catch block
  })
})

В соответствии с приведенным выше кодом, я не могу выполнить второй тестовый блок, что означает, что он не изменяет функцию actionClick в хранилище.

1 Ответ

0 голосов
/ 12 мая 2019

Хук beforeEach происходит до того, как он входит в блок it.Таким образом, настройка store фактически завершена в данный момент.Насколько я вижу из источника vuex, он отсоединяет обратные вызовы действий от объекта параметров, который вы передали ему на этапе создания (store = new Vuex.Store(...)).Вы можете проверить это здесь .

Итак, я бы посоветовал вам либо создать новый объект магазина внутри вашего блока it: 

it('should go to catch block', () => {
    actions.actionClick = jest.fn(() => Promise.reject(new Error()))
    store = new Vuex.Store({ actions })
    const wrapper = shallowMount(Actions, {
        store,
        localVue
    })
    //still goes to then block and not the catch block
  })
})

, либо использовать hotUpdate (newOptions) метод на экземпляре магазина.Я не проверял это.Но, опять же, из vuex источника он должен делать именно то, что вам нужно. 

it('should go to catch block', () => {
    actions.actionClick = jest.fn(() => Promise.reject(new Error()))
    store.hotUpdate({ actions })
    const wrapper = shallowMount(Actions, {
        store,
        localVue
    })
    //still goes to then block and not the catch block
  })
})
...