时间戳

首页 > 解决方案 > 使用 Jest 对仅在函数存在时调用函数的 JavaScript 进行单元测试

javascript - 使用 Jest 对仅在函数存在时调用函数的 JavaScript 进行单元测试

问题描述

对于这样的代码：

export const addMediaQueryEventListener = (media, onChange) => {
  if (root.matchMedia) {
    const mediaQueryList = root.matchMedia(media);
    ...

您如何使用 Jest 测试两个代码“分支”，即何时root.matchMedia为假以及何时存在？

我可以模拟matchMedia成为一个函数并断言它被称为 OK。但是要反过来测试以获得 100% 的测试覆盖率，我需要模拟matchMedia为虚假，但还要断言它没有被作为函数调用。

有没有办法模拟该属性 matchMedia是虚假的，同时也作为一个函数进行监视matchMedia？或者是否需要重写此函数以使其可测试？

标签： javascriptunit-testingjestjs

解决方案

我在评论中遵循了@Taplar 的建议（再次感谢！）并像这样解决了它：

describe('when matchMedia is unsupported', () => {
    beforeEach(() => {
      root.matchMedia = undefined;
    });

    test('it does not error', () => {
      addMediaQueryEventListener(media, onChange);
    });
  });
});

我开始思考要做出什么断言，但只需调用函数就足够了，因为如果它尝试undefined作为函数调用，那么它会出错并导致测试失败。这使测试覆盖率达到了预期的 100%。

推荐阅读