reactjs - redux-saga "all + takeEvery" 单元测试

Question

我是新来的反应。请帮助我进行 redux-saga/effecs 的单元测试。假设我对分离功能有 redux 效果

export function* appEffects() {
    yield all([
        takeEvery(Types.CONFIGURE_LANGUAGE, configureLanguage),
        // other effects for this feature (removed to simplify example)
    ]);
}

function* configureLanguage(action: Actions.ConfigureLanguageAction) {
    const currentLanguage: string = 'en'; // simplified example
    yield put({ type: Types.SET_CURRENT_LANGUAGE, payload: currentLanguage });
}

我可以configureLanguage直接用下面的代码测试

import { runSaga } from 'redux-saga';


    async function recordSaga(saga: any, initialAction: any) {
        const dispatched: any = [];
        await runSaga(
            { dispatch: (action: any) => dispatched.push(action) },
            saga,
            initialAction
        ).toPromise;
        return dispatched;
    }

    it('should configure language', async () => {
        const action = appActions.service.configureLanguage('en');
        const dispatched = await recordSaga(
            configureLanguage
            action
        );
        expect(dispatched).toEqual([{ type: Types.SET_CURRENT_LANGUAGE, payload: 'en' }]);
    });

我该如何configureLanguage测试appEffects？如果我尝试

const dispatched = await recordSaga(
            appEffects
            action
        );

我收到dispatched === []

标签： reactjstypescriptreduxredux-saga

Answer 1

您没有调用该toPromise方法来返回承诺 - 现在您正在调用await该toPromise方法本身，因此在完成recordSaga之前继续，因此当您到达.runSagadispatchedexpect

    async function recordSaga(saga: any, initialAction: any) {
        const dispatched: any = [];
        await runSaga(
            { dispatch: (action: any) => dispatched.push(action) },
            saga,
            initialAction
        ).toPromise(); // update here
        return dispatched;
    }