Redux-Saga 使用 Generator.prototype.next() 失败的错误处理测试答案

【问题标题】：Redux-Saga failing error handling tests using Generator.prototype.next()Redux-Saga 使用 Generator.prototype.next() 失败的错误处理测试
【发布时间】：2021-08-03 13:04:16
【问题描述】：

我正在访问一个旧项目并运行测试。然而，测试我的 Redux-Saga 并没有通过它的错误处理测试。

所有其他测试都顺利通过，所以我知道函数被正确调用。下面是测试文件

import { takeLatest, call, put } from 'redux-saga/effects'
    
import { firestore, convertCollectionsSnapshotToMap } from '../../firebase/firebase.utils'

import { fetchCollectionsSuccess, fetchCollectionsFailure } from './shop.actions'

import ShopActionTypes from './shop.types'

import { fetchCollectionsAsync, fetchCollectionsStart } from './shop.sagas'

describe('fetch collections start saga', () => {
    it('should trigger on FETCH_COLLECTIONS_START', () => {
        const generator = fetchCollectionsStart()
        expect(generator.next().value).toEqual(
            takeLatest(ShopActionTypes.FETCH_COLLECTIONS_START, fetchCollectionsAsync)
        )
    })
})

describe('fetch collections async saga', () => {
    const generator = fetchCollectionsAsync()

    it('should call firestore collection ', () => {
        const getCollection = jest.spyOn(firestore, 'collection')
        generator.next()
        expect(getCollection).toHaveBeenCalled()
    })

    it('should call convertCollectionsSnapshot saga ', () => {
        const mockSnapshot = {}
        expect(generator.next(mockSnapshot).value).toEqual(
            call(convertCollectionsSnapshotToMap, mockSnapshot)
        )
    })

    it('should fire fetchCollectionsSuccess if collectionsMap is succesful', () => {
        const mockCollectionsMap = {
            hats: { id: 1 }
        }

        expect(generator.next(mockCollectionsMap).value).toEqual(
            put(fetchCollectionsSuccess(mockCollectionsMap))
        )
    })

    // THIS IS THE FAILING CODE
    it('should fire fetchCollectionsFailure if get collection fails at any point', () => {
        const newGenerator = fetchCollectionsAsync()
        newGenerator.next()
        expect(newGenerator.throw({ message: 'error' }).value).toEqual(
            put(fetchCollectionsFailure('error'))
        )
    })
})

下面是我的店铺 Saga.js 文件

import { takeLatest, call, put, all } from 'redux-saga/effects'

import { firestore, convertCollectionsSnapshotToMap } from '../../firebase/firebase.utils'

import { fetchCollectionsSuccess, fetchCollectionsFailure } from './shop.actions'

import ShopActionTypes from './shop.types'

export function* fetchCollectionsAsync() {
    try {
        const collectionRef = firestore.collection('collections')
        const snapshot = yield collectionRef.get()
        const collectionsMap = yield call(convertCollectionsSnapshotToMap, snapshot)
        yield put(fetchCollectionsSuccess(collectionsMap))
    } catch (error) {
        yield put(fetchCollectionsFailure(error.message))
    }
}

export function* fetchCollectionsStart() {
    yield takeLatest(ShopActionTypes.FETCH_COLLECTIONS_START, fetchCollectionsAsync)
}

export function* shopSagas() {
    yield all([call(fetchCollectionsStart)])
}

我尝试过模拟错误并将其也传递到我的测试中，但无论我如何重构代码，我在下面的测试中都得到了相同的输出。

 PASS  src/pages/checkout/checkout.test.js
 FAIL  src/redux/shop/shop.sagas.test.js
  ● fetch collections async saga › should fire fetchCollectionsFailure if get collection fails at any point

    error



Test Suites: 1 failed, 1 passed, 2 total
Tests:       1 failed, 5 passed, 6 total
Snapshots:   1 passed, 1 total
Time:        3.076 s
Ran all test suites related to changed files

如果有人对在哪里查找以及如何解决此问题有任何建议，我们将不胜感激。提前致谢

【问题讨论】：

什么是错误详情？
如果我控制台记录 newGenerator.next()，我得到这个作为回报。很难准确定位。 console.log { value: undefined, done: true }
你可以把console.log放在catch里面：console.log(error)
就目前而言，如果我在 fetchCollectionAsync 传奇函数中 console.log 它，代码不会捕获错误。如果我在 try catch 块中进行控制台日志，即使 console.error 也会在测试控制台中给我完全相同的结果。玩弄它，如果我删除测试 try 块的测试（成功的功能），测试失败的代码通过。
我没有复制它。你的测试通过了。如果只是为shop.sagas.test.js 文件运行测试会怎样

标签： javascript reactjs enzyme redux-saga

【解决方案1】：

我编写了以下代码作为解决方法。测试现在正在通过，并且正在调用 fetchCollectionsFailure。这不是最漂亮的代码，但它是一种解决方法，目前满足标准。

it('should fire fetchCollectionsFailure if get collection fails at any point', () => {
        const newGenerator = fetchCollectionsAsync()
        const error = {
            '@@redux-saga/IO': true,
            combinator: false,
            payload: {
                action: {
                    payload: "Cannot read property 'get' of undefined",
                    type: 'FETCH_COLLECTIONS_FAILURE'
                },
                channel: undefined
            },
            type: 'PUT'
        }
        expect(newGenerator.next().value).toMatchObject(error)
    })

【讨论】：