时间戳

首页 > 解决方案 > 对组件的 fetchdata 的反应测试返回“无法读取未定义的属性 'catch'”

reactjs - 对组件的 fetchdata 的反应测试返回“无法读取未定义的属性 'catch'”

问题描述

我有一个fetchData使用 Promise.all 的组件，其中包含一个捕获，fetchBloomreachData因此即使fetchBloomreachData失败，另一个承诺也可以继续。

如果 fetchBloomreachData 拒绝，它仍应等待 newSearch 解决。但基本上如果 newSearch 失败 fetchBloomreachData 是无关紧要的。因此，即使 fetchBloomreachData 失败，newSearch 仍应继续。如果 newSearch 失败，那么它不应该。

我忽略了什么吗？我第一次看到这个错误发生在我身上。

ProductListing.fetchData = ({ dispatch }, rawParams, location, clubId) => {
  const nextQuery = getListingParams(rawParams, location.query);
  return Promise.all([
    dispatch(newSearch(nextQuery, clubId, location)),
    dispatch(fetchBloomreachData(nextQuery, location.pathname)).catch(() => {})
  ]);
};

添加捕获后，此测试失败并且测试说cannot read property 'catch' of undefined

it("should fetchBloomreachData", () => {
  const ProductListing = require("src/components/product-listing").ProductListing;
  const bloomreachStub = sinon.stub(listingActions, "fetchBloomreachData").resolves();
  const dispatchStub = sinon.stub();
  ProductListing.fetchData(
    { dispatch: dispatchStub },
    { searchTerm: "" },
    { pathname: "/b/1234" },
    {}
  );
  expect(bloomreachStub).to.have.been.calledWith({ searchTerm: "" }, "/b/1234");
});

标签： reactjsreduxpromisemocha.jssinon

解决方案

能够通过更新到使其dispatchStub工作const dispatchStub = () => Promise.resolve();

it("should fetchBloomreachData", () => {
  const ProductListing = require("src/components/product-listing").ProductListing;
  const bloomreachStub = sinon.stub(listingActions, "fetchBloomreachData").resolves();
  const dispatchStub = () => Promise.resolve();
  ProductListing.fetchData(
    { dispatch: dispatchStub },
    { searchTerm: "" },
    { pathname: "/b/1234" },
    {}
  );
  expect(bloomreachStub).to.have.been.calledWith({ searchTerm: "" }, "/b/1234");
});

推荐阅读