Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

const getters = {
  adressToGet: state => {
    return state.baseAdress + store.getters.queryToGet
Mocking the state part is easy but I can't find a good way to mock the store.
If this was in a component, I could mount the component with mount or shallow and assign to it the mock store, but it isn't. This is from the vuex store.
This is my test code :
import Search from '@/store/modules/search'
jest.mock('@/store/modules/search.js')
describe('search.js', () => {
  test('The adress getter gets the right adress', () => {
    const state = {
      baseAdress: 'http://foobar.com/'
    // I define store here, but how can I inject it into my tested getter ?
    const store = { 
      getters: {
        queryToGet: 'barfoo'
    expect(Search.getters.adressToGet(state)).toBe('http://foobar.com/barfoo')
I get http://foobar.com/undefined instead of expected.
What would be the best way to do this ?
Edit: Following the first comment, my new version, but it still gives the same result:
import Search from '@/store/modules/search'
import { createLocalVue } from '@vue/test-utils'
import Vuex from 'vuex'
jest.mock('@/store/modules/search.js')
describe('search.js', () => {
  test('The adress getter gets the right adress', () => {
    const localVue = createLocalVue()
    localVue.use(Vuex)
    const mockState = {
      baseAdress: 'http://foobar.com/'
    const store = new Vuex.Store({
      state: mockState,
      getters: {
        queryToGet: function () {
          return 'barfoo'
   expect(Search.getters.adressToGet(mockState))
   .toBe('http://foobar.com/barfoo')
                I think it'd be fine to define it as const store = new Vuex.Store(store) before the assertion. However, to avoid scope pollution you should before create a local Vue instance for the test itself. I mean something like:   import { createLocalVue } from 'vue-test-utils' const localVue = createLocalVue() localVue.use(Vuex)
– P3trur0
                Mar 9, 2018 at 16:24
                I edited the code on the question to reflect your changes, but sadly the output is the same
– Samuel Faure
                Mar 9, 2018 at 16:47
After much research, I realized I had to mock the store dependency with Jest. This seems the correct way to do it and pass the test:
import Search from '@/store/modules/search'
jest.mock('@/store/index.js', () =>({
  getters: {
    queryToGet: 'barfoo'
jest.mock('@/store/modules/search.js')
describe('search.js', () => {
  test('The adress getter gets the right adress', () => {
    const state = {
      baseAdress: 'http://foobar.com/'
    expect(Search.getters.adressToGet(state))
    .toBe('http://foobar.com/barfoo')
                @trainoasis You're probably looking for mockReturnValueOnce jestjs.io/docs/mock-functions
– Samuel Faure
                Jul 17, 2021 at 16:01
        
Thanks for contributing an answer to Stack Overflow!
Please be sure to answer the question. Provide details and share your research!
But avoid …
Asking for help, clarification, or responding to other answers.
Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.