47 lines
1.4 KiB
TypeScript
47 lines
1.4 KiB
TypeScript
|
import { renderHook } from "@testing-library/react";
|
||
|
|
import { useMediaQuery } from "./useMediaQuery";
|
||
|
|
|
||
|
|
describe("useMediaQuery", () => {
|
||
|
|
let matchMedia: jasmine.Spy;
|
||
|
|
let addListener: jasmine.Spy;
|
||
|
|
let removeListener: jasmine.Spy;
|
||
|
|
|
||
|
|
beforeEach(() => {
|
||
|
|
addListener = jasmine.createSpy("addEventListener");
|
||
|
|
removeListener = jasmine.createSpy("removeEventListener");
|
||
|
|
|
||
|
|
matchMedia = jasmine.createSpy("matchMedia").and.returnValue({
|
||
|
|
matches: false,
|
||
|
|
addEventListener: addListener,
|
||
|
|
removeEventListener: removeListener,
|
||
|
|
});
|
||
|
|
|
||
|
|
(window as any).matchMedia = matchMedia;
|
||
|
|
});
|
||
|
|
|
||
|
|
it("should return false by default", () => {
|
||
|
|
const { result } = renderHook(() => useMediaQuery("(min-width: 768px)"));
|
||
|
|
expect(result.current).toBe(false);
|
||
|
|
});
|
||
|
|
|
||
|
|
it("should call matchMedia with the provided query", () => {
|
||
|
|
const query = "(min-width: 768px)";
|
||
|
|
renderHook(() => useMediaQuery(query));
|
||
|
|
expect(matchMedia).toHaveBeenCalledWith(query);
|
||
|
|
});
|
||
|
|
|
||
|
|
it("should add event listener on mount", () => {
|
||
|
|
renderHook(() => useMediaQuery("(min-width: 768px)"));
|
||
|
|
expect(addListener).toHaveBeenCalledWith("change", jasmine.any(Function));
|
||
|
|
});
|
||
|
|
|
||
|
|
it("should remove event listener on unmount", () => {
|
||
|
|
const { unmount } = renderHook(() => useMediaQuery("(min-width: 768px)"));
|
||
|
|
unmount();
|
||
|
|
expect(removeListener).toHaveBeenCalledWith(
|
||
|
|
"change",
|
||
|
|
jasmine.any(Function),
|
||
|
|
);
|
||
|
|
});
|
||
|
|
});
|