0

我正在使用 Redux、fetchMock、redux-mock-store 来编写一个 redux 动作测试。基于这个文档,https: //redux.js.org/recipes/writing-tests,我写了我的,但似乎 fetchMock 不起作用。redux 操作上的 get 请求使用原始值而不是 fetchMock 数据。

谁能告诉我哪里错了?

行动:

import { types } from "./types"
import axios from "axios"
import { getPosts } from "../apis"
export const fetchPosts = () => (dispatch) => {
    return getPosts()
        .then((res) => {
            dispatch({
                type: types.GET_POSTS,
                payload: res.data
            })
        })
        .catch((err) => {
            // console.log(err);
        })
}

测试:

import moxios from "moxios"
import { testStore } from "./../../Utils"
import { fetchPosts } from "./../actions"
import configureMockStore from "redux-mock-store"
import thunk from "redux-thunk"
import fetchMock from "fetch-mock"
import { types } from "../actions/types"

const middlewares = [thunk]
const mockStore = configureMockStore(middlewares)

describe("select_actions", () => {
    afterEach(() => {
        fetchMock.restore()
    })

    it("Dispatches the correct action and payload", () => {
        const expectedState = [
            {
                title: "Example title 1",
                body: "Some Text"
            },
            {
                title: "Example title 2",
                body: "Some Text"
            },
            {
                title: "Example title 3",
                body: "Some Text"
            }
        ]
        const store = mockStore({})

        fetchMock.getOnce("https://jsonplaceholder.typicode.com/posts?_limit=10", {
            body: expectedState,
            headers: { "content-type": "application/json" }
        })

        const expectedActions = [{ type: types.GET_POSTS, payload: expectedState }]

        return store.dispatch(fetchPosts()).then(() => {
            expect(store.getActions()).toEqual(expectedActions)
        })
    })
})

接口:

import axios from "axios"
export const getPosts = async () => await axios.get("https://jsonplaceholder.typicode.com/posts?_limit=10")

4

0 回答 0