Davod Aslani Fakor
Davod Aslani Fakor

Reputation: 681

how i can replace fake response in jest and then data replace in real state vuex?

in my directory

store
 |
 |-- modules
    -- user.js
 |-- index.js  

store/index.js

import Vue from "vue";
import Vuex from "vuex";
Vue.use(Vuex);

// modules
import user from "./modules/user";
export const store = new Vuex.Store({
    state: {
        loading: false
    },
    strict: false,
    modules: {
        user
    },
    actions: {},
    mutations: {}
});

store/modules/user.js

import { eraseCookie, createCookie, readCookie } from "../../plugins/cookie.js";
export default {
    namespaced: true,
    state: () => ({
        isRefresh: false,
        userData: null,
        allCookies: {
            access_token: null,
            refresh_token: null,
            token_expires_in: null,
            dateLoginUser: null
        }
    }),
    actions: {
        checkStateUser({ state, commit, dispatch }) {
            if (!readCookie("access_token")) {
                dispatch("clearUser");
                return;
            }
            if (!localStorage.getItem("dateLoginUser")) {
                localStorage.setItem("dateLoginUser", new Date());
            }
            commit("SET_DATA", {
                id: "allCookies",
                data: {
                    access_token: readCookie("access_token"),
                    refresh_token: readCookie("refresh_token"),
                    token_expires_in: readCookie("token_expires_in"),
                    dateLoginUser: localStorage.getItem("dateLoginUser")
                }
            });
            axios.defaults.headers.common["Authorization"] =
                "Bearer " + state.allCookies.access_token;
            dispatch("getUser");
        },
        async getUser({ dispatch, commit }) {
            try {
                let { data } = await axios.get(`/user`);
                commit("SET_DATA", { data: data.data, id: "userData" }); 
            } catch (error) {
                commit("SET_DATA", { data: null, id: "userData" });
                dispatch("clearUser");
            }
        },
        checkRefresh({ state, dispatch, commit }) {
          // not important
        },
        async refreshToken({ state, dispatch }) {
          // not important
        },
        setNewAccess({ commit }, { data }) {
         // not important
        },
        clearUser({ commit }) {
            // remove all cookie and state
            window.location.replace("/");
        }
    },
    mutations: {
        SET_DATA(state, { id, data }) {
            state[id] = data;
        }
    }
};

and in user AUTH test

user.spec.js

import { eraseCookie, createCookie, readCookie } from "~/plugins/cookie.js";
import { store } from "~/store/index.js";
import axios from "axios";
jest.mock("axios");
let userData = {
    mobile: "09378888888",
    email: "[email protected]",
    account_type: "legal",
    full_name: "xxx xxxx",
    first_name: "xxx",
    last_name: "xxx",
    company_name: "xxxxxx",
    avatar: "2019/09/15/xxxx.png"
};
describe("AUTH", () => {
    let dispatch;
    let state;
    beforeEach(() => {
        global.window = Object.create(window);
        global.window.axios = axios;
        dispatch = jest.fn();
        state = jest.fn();
    }); 
    it.only("call state user by token", async () => {
        let fakeToken = "face_access_token";
        createCookie("access_token", fakeToken);
        await store.dispatch("user/checkStateUser");
        let getUser = jest.fn();
        getUser(dispatch("user/getUser"));
        expect(getUser).toHaveBeenCalledTimes(1);
        let res = {
            status: 200,
            data: {
                ...userData
            }
        };
        await axios.get.mockResolvedValue(() => {
            Promise.resolve({ ...res }); 
        });

        Object.defineProperty(store.state.user, "prop", {
            get: jest.fn(() => "userData"),
            set: jest.fn()
        });
        expect(store.state.user.userData).toBe(userData.data);
    });
});

here i want replace userData fake when action getUser call and commit SET_DATA userData in state.user.userData how do that?

Upvotes: 0

Views: 213

Answers (1)

Davod Aslani Fakor
Davod Aslani Fakor

Reputation: 681

solution:i should move mockResolvedValue after start test some like this;

it("call state user status: 200", async () => {
        let res = {
            status: 200,
            data: {
                data: { ...userData }
            }
        };
        axios.get.mockResolvedValue(res);

        let fakeToken = "face_access_token";
        createCookie("access_token", fakeToken);
        await store.dispatch("user/checkStateUser");
        let getUser = jest.fn();
        getUser(dispatch("user/getUser"));
        expect(getUser).toHaveBeenCalledTimes(1);
        await flushPromises();
        expect(store.state.user.userData).toStrictEqual(userData);
    });

i hope use full.

Upvotes: 1

Related Questions