Search code examples
jestjsvuexstoregetter

unable to get vuex store getters data in vuejs using jest


I am trying to test the getters method of vuex store using jest. But getting undefined as result. Below is the code I am using,

storeConfigurations.ts
---------------------
const state = {
    update: false
}

const getters = {

  [types.GET_UPDATE_VALUE]: (state: { update: any }) => {
        return state.update;
    }

}

types.ts
--------
export const GET_UPDATE_VALUE = 'GET/update'

trying to test the store getters method inside updatedValue() method and got undefined as result.

update.vue
===========

  <div class="updateCss">
      <customList :items="updatedValue"></customList>
    </div>
    
export default class UpdateTest extends Vue {

get updatedValue() {
        
const updatedValue = this.$store.getters[
      types.GET_UPDATE_VALUE
    ];      
}


update.spec.ts
==============

import Vuex from 'vuex' 
import storeConfigurations from '@/store/modules/storeDetails'
const localVue = createLocalVue()
localVue.use(Vuex)

 describe('Update Component TestSuite', () => {
 
 beforeEach(() => {
    let store
    let updateWrapper
     store = new Vuex.Store({
      modules: {
        storeConfigurations: {
          state: { update:false},
          getters: {
            updatedValue: jest.fn()
            
         }
      }
      }
    })

     updateWrapper = shallowMount(UpdateTest , {
      store,
      localVue
        
 }

Here I am trying to get the updatedvalue from store, but I am getting undefined while mocking store.


Solution

  • Problem got solved by giving getters with state variables inside modules.