Scroll.js
import React from "react";
export const ScrollToTop = ({ children, location }) => {
React.useEffect(() => window.scrollTo(0, 0), [location.pathname]);
return children;
};
Scroll.test.js
import React from "react";
import { ScrollToTop } from "./ScrollToTop";
describe("ScrollToTop", () => {
it("", () => {
expect(
ScrollToTop({
children: "some children",
location: { pathname: "the path" }
})
).toEqual();
});
});
and the result I'm getting is enter image description here
You should not call ScrollToTop as a function directly, this is what error message is complaining about.
React docs recommend the Testing Library for writing tests.
Here is an example of how you can write Scroll.test.js using the library above:
import React from "react";
import { render } from '@testing-library/react';
import { ScrollToTop } from "./ScrollToTop";
describe("ScrollToTop", () => {
it('calls window.scrollTo()', () => {
window.scrollTo = jest.fn(); // create a moack function and record all calls
render(<ScrollToTop location={{ pathname: 'pathname' }}>Text</ScrollToTop>); // render a component
expect(window.scrollTo).toHaveBeenCalledWith(0, 0); // check that scrollTo mock was called
});
});