From b586d6c800c2aeaaae446b7f81932f0e0d417112 Mon Sep 17 00:00:00 2001 From: Igor Danchenko <64441155+igordanchenko@users.noreply.github.com> Date: Mon, 12 Aug 2024 14:11:53 -0400 Subject: [PATCH] test: remove vitest globals --- test/client/ColumnsPhotoAlbum.spec.tsx | 2 ++ test/client/MasonryPhotoAlbum.spec.tsx | 2 ++ test/client/PhotoAlbum.spec.tsx | 2 ++ test/client/RowsPhotoAlbum.spec.tsx | 2 ++ test/core/heap.spec.ts | 2 ++ test/scroll/InfiniteScroll.spec.tsx | 38 ++++++++++++------------ test/server/ServerPhotoAlbum.spec.tsx | 2 ++ test/ssr/SSR.spec.tsx | 2 ++ test/test-utils.ts | 40 +++++--------------------- test/vitest.setup.ts | 29 ++++++++++++++++++- tsconfig.json | 3 +- vite.config.ts | 1 - 12 files changed, 69 insertions(+), 56 deletions(-) diff --git a/test/client/ColumnsPhotoAlbum.spec.tsx b/test/client/ColumnsPhotoAlbum.spec.tsx index dbbe1e8..a7741b8 100644 --- a/test/client/ColumnsPhotoAlbum.spec.tsx +++ b/test/client/ColumnsPhotoAlbum.spec.tsx @@ -1,3 +1,5 @@ +import { describe, expect, it } from "vitest"; + import { ColumnsPhotoAlbum } from "../../src"; import { render, renderAndMatchSnapshot } from "../test-utils"; import photos from "../photos"; diff --git a/test/client/MasonryPhotoAlbum.spec.tsx b/test/client/MasonryPhotoAlbum.spec.tsx index e2862c5..527e545 100644 --- a/test/client/MasonryPhotoAlbum.spec.tsx +++ b/test/client/MasonryPhotoAlbum.spec.tsx @@ -1,3 +1,5 @@ +import { describe, expect, it } from "vitest"; + import { ColumnsPhotoAlbum, MasonryPhotoAlbum } from "../../src"; import { render, renderAndMatchSnapshot } from "../test-utils"; import photos from "../photos"; diff --git a/test/client/PhotoAlbum.spec.tsx b/test/client/PhotoAlbum.spec.tsx index a2b8b0e..30dacb7 100644 --- a/test/client/PhotoAlbum.spec.tsx +++ b/test/client/PhotoAlbum.spec.tsx @@ -1,3 +1,5 @@ +import { describe, expect, it, vi } from "vitest"; + import PhotoAlbum from "../../src"; import { render, renderAndMatchSnapshot } from "../test-utils"; import photos from "../photos"; diff --git a/test/client/RowsPhotoAlbum.spec.tsx b/test/client/RowsPhotoAlbum.spec.tsx index 85cfb4c..8b21e93 100644 --- a/test/client/RowsPhotoAlbum.spec.tsx +++ b/test/client/RowsPhotoAlbum.spec.tsx @@ -1,3 +1,5 @@ +import { describe, expect, it } from "vitest"; + import { RowsPhotoAlbum } from "../../src"; import { render, renderAndMatchSnapshot } from "../test-utils"; import photos from "../photos"; diff --git a/test/core/heap.spec.ts b/test/core/heap.spec.ts index 9575ad1..07327a8 100644 --- a/test/core/heap.spec.ts +++ b/test/core/heap.spec.ts @@ -1,3 +1,5 @@ +import { describe, expect, it } from "vitest"; + import MinHeap, { rankingFunctionComparator } from "../../src/layouts/rows/heap"; const NumericComparator = rankingFunctionComparator((x) => x); diff --git a/test/scroll/InfiniteScroll.spec.tsx b/test/scroll/InfiniteScroll.spec.tsx index d268696..bc9ce70 100644 --- a/test/scroll/InfiniteScroll.spec.tsx +++ b/test/scroll/InfiniteScroll.spec.tsx @@ -1,10 +1,12 @@ +import { describe, expect, it, vi } from "vitest"; + import { MasonryPhotoAlbum, RowsPhotoAlbum } from "../../src"; import { UnstableInfiniteScroll as InfiniteScroll } from "../../src/scroll"; import { act, fireEvent, render } from "../test-utils"; import photos from "../photos"; async function triggerIntersection() { - await act(() => fireEvent(window, new Event("intersect"))); + await act(async () => fireEvent(window, new Event("intersect"))); } function fetcher(index: number) { @@ -22,12 +24,10 @@ describe("InfiniteScroll", () => { }); it("loads photos asynchronously", async () => { - const { getPhotos, queryByText } = await act(async () => - render( - - - , - ), + const { getPhotos, queryByText } = render( + + + , ); expect(getPhotos().length).toBe(0); @@ -43,8 +43,8 @@ describe("InfiniteScroll", () => { it("handles fetch errors", async () => { vi.useFakeTimers(); - const { queryByText } = await act(async () => - render( + try { + const { queryByText } = render( { throw new Error(); @@ -54,16 +54,16 @@ describe("InfiniteScroll", () => { > , - ), - ); - - await triggerIntersection(); - await triggerIntersection(); - await triggerIntersection(); - await act(vi.runAllTimers); - expect(queryByText("Error")).toBeTruthy(); - - vi.useRealTimers(); + ); + + await triggerIntersection(); + await triggerIntersection(); + await triggerIntersection(); + await act(async () => vi.runAllTimers()); + expect(queryByText("Error")).toBeTruthy(); + } finally { + vi.useRealTimers(); + } }); it("unloads offscreen photos", async () => { diff --git a/test/server/ServerPhotoAlbum.spec.tsx b/test/server/ServerPhotoAlbum.spec.tsx index fc5bab4..d2b0dcc 100644 --- a/test/server/ServerPhotoAlbum.spec.tsx +++ b/test/server/ServerPhotoAlbum.spec.tsx @@ -1,3 +1,5 @@ +import { describe, expect, it } from "vitest"; + import { LayoutType } from "../../src"; import { UnstableServerPhotoAlbum as ServerPhotoAlbum } from "../../src/server"; import { render } from "../test-utils"; diff --git a/test/ssr/SSR.spec.tsx b/test/ssr/SSR.spec.tsx index 8da844d..180303c 100644 --- a/test/ssr/SSR.spec.tsx +++ b/test/ssr/SSR.spec.tsx @@ -1,3 +1,5 @@ +import { describe, expect, it } from "vitest"; + import { RowsPhotoAlbum } from "../../src"; import { UnstableSSR as SSR } from "../../src/ssr"; import { render } from "../test-utils"; diff --git a/test/test-utils.ts b/test/test-utils.ts index e94985c..8c05563 100644 --- a/test/test-utils.ts +++ b/test/test-utils.ts @@ -1,5 +1,8 @@ import type React from "react"; -import { act, render, RenderOptions } from "@testing-library/react"; +import { expect } from "vitest"; +import { render as originalRender, RenderOptions } from "@testing-library/react"; + +export * from "@testing-library/react"; function getPhotos(container: HTMLElement) { return container.querySelectorAll(".react-photo-album--photo") as NodeListOf; @@ -20,8 +23,8 @@ function getContainerWidth(container: HTMLElement) { return cw ? Number.parseInt(cw, 10) : undefined; } -function customRender(ui: React.ReactElement, options?: RenderOptions) { - const { container, ...rest } = render(ui, options); +export function render(ui: React.ReactElement, options?: RenderOptions) { + const { container, ...rest } = originalRender(ui, options); return { container, @@ -34,34 +37,5 @@ function customRender(ui: React.ReactElement, options?: RenderOptions) { } export function renderAndMatchSnapshot(ui: React.ReactElement, options?: RenderOptions) { - expect(customRender(ui, options).asFragment()).toMatchSnapshot(); + expect(render(ui, options).asFragment()).toMatchSnapshot(); } - -export function mockObserver(event: string, mockEntry?: () => MockEntry) { - return vi.fn().mockImplementation((callback) => { - const targets: Element[] = []; - - const listener = () => { - act(() => { - callback(targets.map((target) => ({ target, ...mockEntry?.() }))); - }); - }; - - window.addEventListener(event, listener); - - return { - observe: (target: Element) => { - targets.push(target); - }, - unobserve: (target: Element) => { - targets.splice(targets.indexOf(target), 1); - }, - disconnect: () => { - window.removeEventListener(event, listener); - }, - }; - }); -} - -export * from "@testing-library/react"; -export { customRender as render }; diff --git a/test/vitest.setup.ts b/test/vitest.setup.ts index babdf30..155b82e 100644 --- a/test/vitest.setup.ts +++ b/test/vitest.setup.ts @@ -1,6 +1,7 @@ import "@testing-library/jest-dom/vitest"; +import { afterEach, beforeEach, vi } from "vitest"; -import { act, cleanup, fireEvent, mockObserver } from "./test-utils"; +import { act, cleanup, fireEvent } from "./test-utils"; declare global { interface Window { @@ -43,6 +44,32 @@ window.resizeTo = (width: number, height: number) => { }); }; +function mockObserver(event: string, mockEntry?: () => MockEntry) { + return vi.fn().mockImplementation((callback) => { + const targets: Element[] = []; + + const listener = () => { + act(() => { + callback(targets.map((target) => ({ target, ...mockEntry?.() }))); + }); + }; + + window.addEventListener(event, listener); + + return { + observe: (target: Element) => { + targets.push(target); + }, + unobserve: (target: Element) => { + targets.splice(targets.indexOf(target), 1); + }, + disconnect: () => { + window.removeEventListener(event, listener); + }, + }; + }); +} + global.ResizeObserver = mockObserver("resize"); global.IntersectionObserver = mockObserver("intersect", () => ({ isIntersecting: window.isIntersecting })); diff --git a/tsconfig.json b/tsconfig.json index 3cc2bb0..71ca649 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -13,7 +13,6 @@ "stripInternal": true, "isolatedModules": true, "allowSyntheticDefaultImports": true, - "forceConsistentCasingInFileNames": true, - "types": ["vitest/globals"] + "forceConsistentCasingInFileNames": true } } diff --git a/vite.config.ts b/vite.config.ts index afede7e..a26b2d2 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -8,7 +8,6 @@ import cleanup from "rollup-plugin-cleanup"; export default defineConfig({ test: { dir: "test", - globals: true, environment: "jsdom", setupFiles: "./test/vitest.setup.ts", coverage: {