Question

我一直在使用Visual Studio提供的.Net Core示例来测试React + Redux。我不确定是否完全走错了路，但是我正在尝试测试为生成天气数据而编写的一项操作。我正在看这个动作：

export const actionCreators = {
    requestWeatherForecasts: (startDateIndex) => async (dispatch, getState) => {

        if (startDateIndex === getState().weatherForecasts.startDateIndex) {
            // Don't issue a duplicate request (we already have or are loading the requested data)
            return;
        }


        dispatch({ type: requestWeatherForecastsType, startDateIndex });

        const url = `api/SampleData/WeatherForecasts?startDateIndex=${startDateIndex}`;
        const response = await fetch(url);
        const forecasts = await response.json();
        dispatch({ type: receiveWeatherForecastsType, startDateIndex, forecasts });
    }
};

当我对此进行测试时，出现以下错误：

TypeError: Cannot read property 'startDateIndex' of undefined

我认为这是由操作开始时的检查引起的，但我似乎无法弄清楚为什么测试到达测试线后仍然会失败。这是我测试的完整代码：

import configureMockStore from 'redux-mock-store';
import expect from 'expect';
import { actionCreators } from './WeatherForecasts';
import thunk from 'redux-thunk';
import fetchMock from 'fetch-mock';

const middlewares = [thunk];
const mockStore = configureMockStore(middlewares);
let state = { startDateIndex: 5, forecasts: [], isLoading: false };
const store = mockStore(() => state);

describe('WeatherForecasts Actions', () => {

    afterEach(function () {
        fetchMock.restore();
    });   

    it('Creates a Request and a Receive signal', () => {
        fetchMock.get('api/SampleData/WeatherForecasts?startDateIndex=0', {
            body: [{ "dateFormatted": "12/12/2018", "temperatureC": 6, "summary": "Warm", "temperatureF": 42 }, { "dateFormatted": "13/12/2018", "temperatureC": -17, "summary": "Scorching", "temperatureF": 2 }, { "dateFormatted": "14/12/2018", "temperatureC": 10, "summary": "Scorching", "temperatureF": 49 }, { "dateFormatted": "15/12/2018", "temperatureC": 30, "summary": "Hot", "temperatureF": 85 }, { "dateFormatted": "16/12/2018", "temperatureC": -4, "summary": "Balmy", "temperatureF": 25 }],
            headers: { 'content-type': 'application/json' }
        })

        const expectedActions = [
            { type: "REQUEST_WEATHER_FORECASTS", startDateIndex: 0},
            { type: "RECEIVE_WEATHER_FORECASTS", startDateIndex: 0, forecasts: [{ "dateFormatted": "12/12/2018", "temperatureC": 6, "summary": "Warm", "temperatureF": 42 }, { "dateFormatted": "13/12/2018", "temperatureC": -17, "summary": "Scorching", "temperatureF": 2 }, { "dateFormatted": "14/12/2018", "temperatureC": 10, "summary": "Scorching", "temperatureF": 49 }, { "dateFormatted": "15/12/2018", "temperatureC": 30, "summary": "Hot", "temperatureF": 85 }, { "dateFormatted": "16/12/2018", "temperatureC": -4, "summary": "Balmy", "temperatureF": 25 }] }
        ];    
        const startDateIndex = 0;

        return store.dispatch(actionCreators.requestWeatherForecasts(startDateIndex)).then(() => {
            expect(store.getActions()).toEqual(expectedActions);
        });
    });
});

任何帮助，将不胜感激！

Answer 1

您的操作创建者假设该状态具有weatherForecasts属性。在实际的生产代码中可能会具有的功能，但是在测试中为测试目的设置伪状态的测试中，没有weatherForecasts属性。相反，相关数据位于状态的顶层，没有命名空间。

以下是两种可能的解决方案：

A。从操作创建者中删除对weatherForecasts命名空间的错误假设。这将是我的首选解决方案，因为它可以稍微简化一些事情。

if (startDateIndex === getState().startDateIndex) {

B。在创建名称空间时将其添加到状态中，以匹配操作创建者的现有假设。

let state = { weatherForecasts : { startDateIndex: 5, forecasts: [], isLoading: false } };

Redux测试-getState（）TypeError：无法读取未定义的属性“ startDateIndex”

1 个答案: