似乎无法获得在 useEffect 内部调度的 setTimeout 操作的测试覆盖率

Question

我在使用 window.setTimeout() 获取反应动作分派的测试覆盖时遇到问题，测试通过 done() 但它实际上并没有为伊斯坦布尔覆盖提供任何覆盖。我尝试了几件事，但到目前为止没有任何效果。有人熟悉测试这个吗？我也尝试过使用 lolex 来模拟时间而不是使用 window.setTimeout() 但它没有说 getBrSeoData 从未被调用过。

这是我的代码

  useEffect(() => {
    if (!Config.ui.isBot) {
      window.setTimeout(() => {
        getBrSeoData(productType, productId, productName, productStatus);
      }, BR_DELAY);
    }
  }, [getBrSeoData, productType, productId, productName, productStatus]);

这是测试

  it("should make the blooomreach api call if !Config.ui.isBot", done => {
    const BR_DELAY = 6000;
    const response = {
      status: "SUCCESS",
      payload: {
        "related-item": bloomreachState["related-item"],
        "related-category": [],
        "more-results": []
      }
    };
    props = {
      relatedSearches: bloomreachState["related-item"],
      relatedCategories: bloomreachState["related-category"],
      relatedProducts: bloomreachState["more-results"],
      getBrSeoData: sinon.spy(() => new Promise(resolve => resolve({ response })))
    };
    Config.ui.isBot = false;
    component = render(<BloomreachSeo {...props} />);
    window.setTimeout(() => {
      expect(props.getBrSeoData).to.have.been.calledOnce;
    }, BR_DELAY);
    done();
  });

伊斯坦布尔显示线路未覆盖

Answer 1

我能够通过使用 npm 包 lolex 来让它工作。如果有人在使用 React 测试库以及测试 window.setTimeout()

时遇到问题

  let clock;

  beforeEach(() => {
    clock = lolex.install({ now: 4476701471000, toFake: ["setTimeout"] });
  });

  afterEach(() => {
    clock.uninstall();
  });

  it("should make the bloomreach api call if !Config.ui.isBot", () => {
    const BR_DELAY = 5000;
    const response = {
      status: "SUCCESS",
      payload: {
        "related-item": bloomreachState["related-item"],
        "related-category": [],
        "more-results": []
      }
    };
    props = {
      relatedSearches: bloomreachState["related-item"],
      relatedCategories: bloomreachState["related-category"],
      relatedProducts: bloomreachState["more-results"],
      getBrSeoData: sinon.spy(() => new Promise(resolve => resolve({ response })))
    };
    Config.ui.isBot = false;
    component = render(<BloomreachSeo {...props} />);
    clock.tick(BR_DELAY);
    clock.setTimeout(() => {
      expect(props.getBrSeoData).to.have.been.called;
    }, BR_DELAY);
  });

似乎无法获得在 useEffect 内部调度的 setTimeout 操作的测试覆盖率

Can't seem to get test coverage for a setTimeout action dispatched inside of an useEffect

settimeout

istanbul

reactjs

enzyme

react-testing-library