Почему хранилище VueX сохраняет состояние в нескольких модульных тестах? - PullRequest
Новая
       22

Почему хранилище VueX сохраняет состояние в нескольких модульных тестах?

0 голосов
/ 06 февраля 2019

Я пишу юнит-тесты для модуля разбиения на страницы, и у него есть простой модуль хранилища VueX.

Я использую Vue.js 2.5 и Mocha / Chai / Sinon для тестов.Настройка выполняется с помощью Vue CLI 3.

Проблема заключается в том, что при увеличении currentPage в хранилище в одном модульном тесте это состояние сохраняется в следующем тесте, даже когда я пытаюсь создать новый магазин.

Я попытался вернуть новый модуль нумерации страниц, используя функцию, которая возвращает Object.assign() свежую копию, но это не сработало.Я оставил это в коде, как показано в спецификации ниже.

store / pagination.js 

const state = {
  currentPage: 0
}

export const getters = {
  currentPage: state => {
    return state.currentPage
  }
}

export const actions = {

  nextPage ({ commit, state }) {
    commit('setCurrentPage', state.currentPage + 1)
  }
}

export const mutations = {
  setCurrentPage (state, page) {
    state.currentPage = page
  }
}

export default {
  namespaced: true,
  state,
  getters,
  actions,
  mutations
}

Pagination.spec.js 

function getPaginationStore () {
  return Object.assign({}, pagination)
}

describe('Paginate.vue', () => {
  let localVue
  let wrapper
  let store

  beforeEach(() => {
    localVue = createLocalVue()
    localVue.use(Vuex)

    store = new Vuex.Store({
      modules: {
        pagination: getPaginationStore()
      }
    })

    wrapper = shallowMount(Pagination, {
      localVue,
      propsData: {
        items: [],
        size: 24
      },
      store
    })
  })

  afterEach(() => {
    store = null
  })

  it('state should be 0', () => {
    expect(wrapper.vm.pageNumber).to.equal(0)
    wrapper.vm.$store.dispatch('pagination/nextPage')
    expect(wrapper.vm.pageNumber).to.equal(1)
  })

  it('state should be 0 again but is 1', () => {
    // THIS TEST FAILS. IT IS ACTUALLY 1
    expect(wrapper.vm.pageNumber).to.equal(0)
  })
})

1 Ответ

0 голосов
/ 06 февраля 2019

Решением было использование функции для состояния в модуле, а не простого старого объекта javascript.Вот мой новый код состояния магазина: 

export const state = () => {
  return {
    currentPage: 0
  }
}

Ответ был предоставлен @SumNeuron из канала раздора Vue.

...