Skip to content

Commit

Permalink
[UI v2] feat: Centralozes createWrapper for tests
Browse files Browse the repository at this point in the history
  • Loading branch information
devinvillarosa committed Dec 10, 2024
1 parent 37bf294 commit 708ecdd
Show file tree
Hide file tree
Showing 9 changed files with 169 additions and 198 deletions.
16 changes: 3 additions & 13 deletions ui-v2/src/hooks/deployments/deployments.test.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { renderHook, waitFor } from "@testing-library/react";
import { http, HttpResponse } from "msw";
import { describe, expect, it } from "vitest";
Expand All @@ -9,7 +8,7 @@ import {
usePaginateDeployments,
} from "./index";

import { server } from "@tests/mocks";
import { createWrapper, server } from "@tests/utils";

describe("deployments hooks", () => {
const seedDeployments = (): Deployment[] => [
Expand Down Expand Up @@ -52,13 +51,6 @@ describe("deployments hooks", () => {
);
};

const createQueryWrapper = ({ queryClient = new QueryClient() }) => {
const QueryWrapper = ({ children }: { children: React.ReactNode }) => (
<QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
);
return QueryWrapper;
};

const paginationFilter = {
page: 1,
limit: 10,
Expand All @@ -82,9 +74,7 @@ describe("deployments hooks", () => {
// Initialize hook
const { result } = renderHook(
() => usePaginateDeployments(paginationFilter),
{
wrapper: createQueryWrapper({}),
},
{ wrapper: createWrapper() },
);

// Assert
Expand All @@ -103,7 +93,7 @@ describe("deployments hooks", () => {

// Initialize hook
const { result } = renderHook(() => useCountDeployments(countFilter), {
wrapper: createQueryWrapper({}),
wrapper: createWrapper(),
});

// Assert
Expand Down
25 changes: 9 additions & 16 deletions ui-v2/src/hooks/global-concurrency-limits.test.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { QueryClient } from "@tanstack/react-query";
import { act, renderHook, waitFor } from "@testing-library/react";
import { server } from "@tests/mocks";
import { createWrapper, server } from "@tests/utils";
import { http, HttpResponse } from "msw";
import { describe, expect, it } from "vitest";

Expand Down Expand Up @@ -40,13 +40,6 @@ describe("global concurrency limits hooks", () => {
);
};

const createQueryWrapper = ({ queryClient = new QueryClient() }) => {
const QueryWrapper = ({ children }: { children: React.ReactNode }) => (
<QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
);
return QueryWrapper;
};

const filter = {
offset: 0,
};
Expand All @@ -63,7 +56,7 @@ describe("global concurrency limits hooks", () => {
// ------------ Initialize hooks to test
const { result } = renderHook(
() => useListGlobalConcurrencyLimits(filter),
{ wrapper: createQueryWrapper({}) },
{ wrapper: createWrapper() },
);

// ------------ Assert
Expand Down Expand Up @@ -94,12 +87,12 @@ describe("global concurrency limits hooks", () => {
// ------------ Initialize hooks to test
const { result: useListGlobalConcurrencyLimitsResult } = renderHook(
() => useListGlobalConcurrencyLimits(filter),
{ wrapper: createQueryWrapper({ queryClient }) },
{ wrapper: createWrapper({ queryClient }) },
);

const { result: useDeleteGlobalConcurrencyLimitResult } = renderHook(
useDeleteGlobalConcurrencyLimit,
{ wrapper: createQueryWrapper({ queryClient }) },
{ wrapper: createWrapper({ queryClient }) },
);

// ------------ Invoke mutation
Expand Down Expand Up @@ -157,11 +150,11 @@ describe("global concurrency limits hooks", () => {
// ------------ Initialize hooks to test
const { result: useListGlobalConcurrencyLimitsResult } = renderHook(
() => useListGlobalConcurrencyLimits(filter),
{ wrapper: createQueryWrapper({ queryClient }) },
{ wrapper: createWrapper({ queryClient }) },
);
const { result: useCreateGlobalConcurrencyLimitResult } = renderHook(
useCreateGlobalConcurrencyLimit,
{ wrapper: createQueryWrapper({ queryClient }) },
{ wrapper: createWrapper({ queryClient }) },
);

// ------------ Invoke mutation
Expand Down Expand Up @@ -221,12 +214,12 @@ describe("global concurrency limits hooks", () => {
// ------------ Initialize hooks to test
const { result: useListGlobalConcurrencyLimitsResult } = renderHook(
() => useListGlobalConcurrencyLimits(filter),
{ wrapper: createQueryWrapper({ queryClient }) },
{ wrapper: createWrapper({ queryClient }) },
);

const { result: useUpdateGlobalConcurrencyLimitResult } = renderHook(
useUpdateGlobalConcurrencyLimit,
{ wrapper: createQueryWrapper({ queryClient }) },
{ wrapper: createWrapper({ queryClient }) },
);

// ------------ Invoke mutation
Expand Down
26 changes: 9 additions & 17 deletions ui-v2/src/hooks/variables.test.tsx
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { QueryClient } from "@tanstack/react-query";
import { act, renderHook, waitFor } from "@testing-library/react";
import { http, HttpResponse } from "msw";
import { describe, expect, it } from "vitest";

import { components } from "@/api/prefect";
import { server } from "@tests/mocks";
import { createWrapper, server } from "@tests/utils";

import {
buildCountQuery,
Expand Down Expand Up @@ -39,14 +39,6 @@ describe("variable hooks", () => {
}),
);
};

const createQueryWrapper = ({ queryClient = new QueryClient() }) => {
const QueryWrapper = ({ children }: { children: React.ReactNode }) => (
<QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
);
return QueryWrapper;
};

const variableFilter = {
offset: 0,
sort: "CREATED_DESC" as const,
Expand All @@ -65,7 +57,7 @@ describe("variable hooks", () => {

// ------------ Initialize hooks to test
const { result } = renderHook(() => useVariables(variableFilter), {
wrapper: createQueryWrapper({ queryClient }),
wrapper: createWrapper({ queryClient }),
});

// ------------ Assert
Expand Down Expand Up @@ -102,11 +94,11 @@ describe("variable hooks", () => {
// ------------ Initialize hooks to test
const { result: useVariablesResult } = renderHook(
() => useVariables(variableFilter),
{ wrapper: createQueryWrapper({ queryClient }) },
{ wrapper: createWrapper({ queryClient }) },
);

const { result: useDeleteVariableResult } = renderHook(useDeleteVariable, {
wrapper: createQueryWrapper({ queryClient }),
wrapper: createWrapper({ queryClient }),
});

// ------------ Invoke mutation
Expand Down Expand Up @@ -165,10 +157,10 @@ describe("variable hooks", () => {
// ------------ Initialize hooks to test
const { result: useVariablesResult } = renderHook(
() => useVariables(variableFilter),
{ wrapper: createQueryWrapper({ queryClient }) },
{ wrapper: createWrapper({ queryClient }) },
);
const { result: useCreateVariableResult } = renderHook(useCreateVariable, {
wrapper: createQueryWrapper({ queryClient }),
wrapper: createWrapper({ queryClient }),
});

// ------------ Invoke mutation
Expand Down Expand Up @@ -227,10 +219,10 @@ describe("variable hooks", () => {
// ------------ Initialize hooks to test
const { result: useVariablesResult } = renderHook(
() => useVariables(variableFilter),
{ wrapper: createQueryWrapper({ queryClient }) },
{ wrapper: createWrapper({ queryClient }) },
);
const { result: useUpdateVariableResult } = renderHook(useUpdateVariable, {
wrapper: createQueryWrapper({ queryClient }),
wrapper: createWrapper({ queryClient }),
});

// ------------ Invoke mutation
Expand Down
1 change: 0 additions & 1 deletion ui-v2/tests/mocks/index.ts

This file was deleted.

2 changes: 1 addition & 1 deletion ui-v2/tests/setup.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import * as matchers from "@testing-library/jest-dom/matchers";
import { cleanup } from "@testing-library/react";
import { afterAll, afterEach, beforeAll, expect, vi } from "vitest";
import "@testing-library/jest-dom";
import { server } from "./mocks";
import { server } from "./utils";

beforeAll(() => {
server.listen({
Expand Down
File renamed without changes.
21 changes: 21 additions & 0 deletions ui-v2/tests/utils/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { createElement } from "react";
export { server } from "./node";

/* Wraps render() components with app-wide providers
*
* @example
* import { createWrapper } from '@tests/utils'
*
* ```tsx
* const result = render(<MyComponentToTest />, {
* wrapper: createWrapper(),
* });
* ```
*/
export const createWrapper = ({ queryClient = new QueryClient() } = {}) => {
// Written with createElement because our current vite config doesn't support jsx in tests/
const Wrapper = ({ children }: { children: React.ReactNode }) =>
createElement(QueryClientProvider, { client: queryClient }, children);
return Wrapper;
};
File renamed without changes.
Loading

0 comments on commit 708ecdd

Please sign in to comment.