Jest Vue 测试 - 无法测试 window.scrollTo fn()答案

【问题标题】：Jest Vue Test - Can't test window.scrollTo fn()Jest Vue 测试 - 无法测试 window.scrollTo fn()
【发布时间】：2021-06-17 08:15:37
【问题描述】：

使用 getBoundingClientRect 和 window.scrollTo 简单滚动到 Element 函数，但无法获得 Jest 测试的任何迭代来获得超出 branch: 100 的任何覆盖范围。所有其他测试覆盖率为 0。

要测试的功能：

export default function scrollToEl(el) {
  let elRect = el.getBoundingClientRect();
  return window.scrollTo(
    elRect.left + document.documentElement.scrollLeft,
    elRect.top + document.documentElement.scrollTop
  );
}

无法在所有类别中提供 100% 覆盖率的开玩笑测试：

import * as scroll from "../scrollToEl";

describe("scrollToEl test", () => {
  let element;
  let ev = jest.fn();
  scroll.scrollToEl = jest.fn(() => {
    ev;
  });
  beforeEach(() => {
    element = document.createElement("div");
  });
  it("should be called", () => {
    ev(element)
    expect(ev).toHaveBeenCalled();
  });
});

如何获得全面 100% 的全面覆盖？请帮忙。

编辑 - 现在全面覆盖 100%：

JS函数：

我不得不将 export default function 更改为 export const scrollToEl = function (el)

export const scrollToEl = function (el) {
  // ...
};

测试：

我必须简化测试以获得 100% 的全面覆盖率。我添加并检查了 window.scrollTo 以及在新创建的元素 (el) 上调用实际函数。

import * as scroll from "../scrollToEl";

describe("scrollToEl test", () => {
  beforeEach(() => {
    window.scrollTo = jest.fn();
  });
  it("`window.scrollTo` should be called", () => {
    const el = document.createElement("span");
    scroll.scrollToEl(el);
    expect(window.scrollTo).toHaveBeenCalled();
  });
});

【问题讨论】：

标签： javascript vue.js jestjs

【解决方案1】：

所以，首先我对您想要 100% 代码覆盖率的目标有疑问。但这不是关于那个的问题，所以我们现在将跳过它。

要让 Jest 不抱怨 scrollTo，你必须嘲笑它。

window.scrollTo = jest.fn();

【讨论】：