正在测试滚动查看Jest

cuxqih21 于 2022-12-08 发布在 Jest

关注(0)|答案(2)|浏览(207)

我有一个简单的函数：

scrollToSecondPart() {
    this.nextPartRef.current.scrollIntoView({ behavior: "smooth" });
}

我想用Jest来测试它。当我调用函数时，出现了以下错误：

TypeError: Cannot read property 'scrollIntoView' of null

这段代码在应用程序中运行良好，但在单元测试中就不行了。

it("should scroll to the second block", () => {

    const scrollToSecondPart = jest.spyOn(LandingPage.prototype, 'scrollToSecondPart');
    const wrapper = shallow(<LandingPage />);
    const instance = wrapper.instance();
    instance.scrollToSecondPart();

    expect(scrollToSecondPart).toHaveBeenCalled();
});

我猜问题是单元测试不能访问this.nextPartRef，但我不知道我应该如何模拟这个元素。顺便说一下，我使用的"Refs"已经在https://reactjs.org/docs/refs-and-the-dom.html中描述过了（我使用的是React.createRef()）。
谢谢你，谢谢你

jestjs

来源：https://stackoverflow.com/questions/51527362/testing-scrollintoview-jest

2条答案

按热度按时间

zpgglvta1#

所以我偶然发现了这个问题，因为我以为它是关于如何测试Element.scrollIntoView()的，这可以通过用下面的笑话来嘲笑它来完成：

let scrollIntoViewMock = jest.fn();
window.HTMLElement.prototype.scrollIntoView = scrollIntoViewMock;

<execute application code that triggers scrollIntoView>

expect(scrollIntoViewMock).toBeCalled();

然而，这似乎不是你的目标。在你的测试中，你在测试中调用scrollToSecondPart()，然后调用expect(scrollToSecondPart).toHaveBeenCalled()，这本质上是测试scrollToSecondPart是LandingPage的函数，还是我遗漏了什么？

赞(0）回复(0）举报 2022-12-08

a0zr77ik2#

对我来说，我不得不模拟scrollIntoView的元素，如下所示：

const scrollIntoViewMock = jest.fn();

Element.prototype.scrollIntoView = scrollIntoViewMock()

如下所示：https://github.com/jsdom/jsdom/issues/1695#issuecomment-449931788

赞(0）回复(0）举报 2022-12-08

我来回答

正在测试滚动查看Jest

2条答案

相关问题

热门标签

最新问答