问题

I am testing a saga generator function in my code.

Here is the code:

 export function* mainFunction({ payload: { authorization } }) {
  try {
    const response = yield call(
      fetch,
      `${url}/api`,
      {
        headers: {
          Authorization: authorization,
        },
      }
    );

    if (response.status !== 200) {
      throw new Error("Failed to load");
    }

    const jsonResponse = yield response.json();

    const data = yield call(
      helperFunction1,
      Array.from(jsonResponse)
    );

    const updatedData = yield call(helperFunction2, data);

    yield put(setData({ finalData: updatedData }));
    yield put(helperFunction3({ authorization }));
  } catch ({ message }) {
    yield showError(message);
    yield put(setError(message));
  }
}

Here is the test:

const payload = {
      authorization: "authorization",
    };
const apiCall = call(
      fetch,
      `${url}/api`,
      {
        headers: {
          Authorization: authorization,
        },
      }
    );
 describe("success", () => {
      const saga = mainFunction({ payload });
      const data = "data";
      const response = {
        status: 200,
        json: () => data,
      };
      const jsonResponse = response.json();

      it("should call API", () => {
        expect(saga.next().value).toEqual(apiCall);
      });

      it("should get response with data", () => {
        expect(saga.next(response).value).toEqual(data);
      });

      it("should call helperFunction1", () => {
        expect(saga.next(jsonResponse).value).toEqual(
          call(helperFunction1, Array.from(jsonResponse))
        );
      });

      it("should call helperFunction2", () => {
        expect(saga.next(data).value).toEqual(call(helperFunction2, data));
      });

      it("should dispatch success action with data", () => {
        expect(saga.next(data).value).toEqual(
          put(setData({ finalData: data }))
        );
      });

      it("should dispatch status check", () => {
        expect(saga.next(data).value).toEqual(
          put(helperFunction3({ accessToken: "token" }))
        );
      });

      it("should be done", () => {
        expect(saga.next().done).toBe(true);
      });
    });

The first two tests run fine, however, the third test, to test the call of helperFunction1, each test from here is telling me that the actual yield is "fetch" and not the helperFunction1 that was expected. Basically, the "actual" result that it is yielding is the api variable declared before the test, the same expected result of the first test. The remaining tests pass, which appear to be written the same way as the third one. I am completely unsure of why the fetch function is yielded again for the third test while all the rest are correct. I thought the first saga.next() would have completed the fetch yield call. For the record, none of the helper functions themselves are generator functions.

 export function* mainFunction({ payload: { authorization } }) {
try {
const response = yield call(
fetch,
`${url}/api`,
{
headers: {
Authorization: authorization ,
},
}
);
if (response.status !== 200) {
throw new Error("Failed to load");
}
const jsonResponse = yield response.json();
const data = yield call(
helperFunction1,
Array.from(jsonResponse)
);
const updatedData = yield call(helperFunction2, data);
yield put(setData({ finalData: updatedData }));
yield put(helperFunction3({ authorization }));
} catch ({ message }) {
yield showError(message);
yield put(setError(message));
}
}

const payload = {
authorization: "authorization",
};
const apiCall = call(
fetch,
`${url}/api`,
{
headers: {
Authorization: authorization,
},
}
);
describe("success", () => {
const saga = mainFunction({ payload });
const data = "data";
const response = {
status: 200,
json: () => data,
};
const jsonResponse = response.json();
it("should call API", () => {
expect(saga.next().value).toEqual(apiCall);
});
it("should get response with data", () => {
expect(saga.next(response).value).toEqual(data);
});
it("should call helperFunction1", () => {
expect(saga.next(jsonResponse).value).toEqual(
call(helperFunction1, Array.from(jsonResponse))
);
});
it("should call helperFunction2", () => {
expect(saga.next(data).value).toEqual(call(helperFunction2, data));
});
it("should dispatch success action with data", () => {
expect(saga.next(data).value).toEqual(
put(setData({ finalData: data }))
);
});
it("should dispatch status check", () => {
expect(saga.next(data).value).toEqual(
put(helperFunction3({ accessToken: "token" }))
);
});
it("should be done", () => {
expect(saga.next().done).toBe(true);
});
});

答案1

得分: 1

问题的简单答案是，我是在隔离环境中运行测试，因此产生的顺序不是预期的顺序。当我一次性运行与此函数相关的所有测试时，它们都通过了。