From 9a3eb59a8d4c6bf334913e8d09b4596c8de2c0b5 Mon Sep 17 00:00:00 2001 From: Devin Villarosa Date: Wed, 11 Dec 2024 10:11:33 -0800 Subject: [PATCH] [UI v2] test: Adds tests for global concurrency view and task run view] --- .../data-table/active-cell.tsx | 1 + .../data-table/data-table.test.tsx | 81 +++++++++++++++++ .../data-table/data-table.tsx | 46 +++++++--- .../create-or-edit-limit-dialog.test.tsx | 88 +++++++++++++++++++ ...ex.tsx => create-or-edit-limit-dialog.tsx} | 0 .../create-or-edit-limit-dialog/index.ts | 1 + .../dialog/delete-limit-dialog.test.tsx | 43 +++++++++ ...bal-concurrency-limit-empty-state.test.tsx | 20 ++--- .../global-concurrency-limits-header.test.tsx | 26 ++++++ .../global-concurrency-limits-header.tsx | 0 .../global-concurrency-view/header/index.ts | 1 + .../global-concurrency-view/index.tsx | 2 +- .../data-table/data-table.test.tsx | 70 +++++++++++++++ .../data-table/data-table.tsx | 44 ++++++++-- .../dialogs/create-dialog.test.tsx | 48 ++++++++++ .../dialogs/delete-dialog.test.tsx | 41 +++++++++ .../dialogs/reset-dialog.test.tsx | 45 ++++++++++ .../task-run-concurrenct-view/header/index.ts | 1 + .../task-run-concurrency-limit-header.tsx} | 0 .../task-run-conrrency-limits-header.test.tsx | 26 ++++++ 20 files changed, 553 insertions(+), 31 deletions(-) create mode 100644 ui-v2/src/components/concurrency/global-concurrency-view/data-table/data-table.test.tsx create mode 100644 ui-v2/src/components/concurrency/global-concurrency-view/dialog/create-or-edit-limit-dialog/create-or-edit-limit-dialog.test.tsx rename ui-v2/src/components/concurrency/global-concurrency-view/dialog/create-or-edit-limit-dialog/{index.tsx => create-or-edit-limit-dialog.tsx} (100%) create mode 100644 ui-v2/src/components/concurrency/global-concurrency-view/dialog/create-or-edit-limit-dialog/index.ts create mode 100644 ui-v2/src/components/concurrency/global-concurrency-view/dialog/delete-limit-dialog.test.tsx create mode 100644 ui-v2/src/components/concurrency/global-concurrency-view/header/global-concurrency-limits-header.test.tsx rename ui-v2/src/components/concurrency/global-concurrency-view/{ => header}/global-concurrency-limits-header.tsx (100%) create mode 100644 ui-v2/src/components/concurrency/global-concurrency-view/header/index.ts create mode 100644 ui-v2/src/components/concurrency/task-run-concurrenct-view/data-table/data-table.test.tsx create mode 100644 ui-v2/src/components/concurrency/task-run-concurrenct-view/dialogs/create-dialog.test.tsx create mode 100644 ui-v2/src/components/concurrency/task-run-concurrenct-view/dialogs/delete-dialog.test.tsx create mode 100644 ui-v2/src/components/concurrency/task-run-concurrenct-view/dialogs/reset-dialog.test.tsx create mode 100644 ui-v2/src/components/concurrency/task-run-concurrenct-view/header/index.ts rename ui-v2/src/components/concurrency/task-run-concurrenct-view/{header.tsx => header/task-run-concurrency-limit-header.tsx} (100%) create mode 100644 ui-v2/src/components/concurrency/task-run-concurrenct-view/header/task-run-conrrency-limits-header.test.tsx diff --git a/ui-v2/src/components/concurrency/global-concurrency-view/data-table/active-cell.tsx b/ui-v2/src/components/concurrency/global-concurrency-view/data-table/active-cell.tsx index 17d3ad943165..ce0a452b9a4a 100644 --- a/ui-v2/src/components/concurrency/global-concurrency-view/data-table/active-cell.tsx +++ b/ui-v2/src/components/concurrency/global-concurrency-view/data-table/active-cell.tsx @@ -41,6 +41,7 @@ export const ActiveCell = ( return ( handleCheckedChange(checked, rowId)} /> diff --git a/ui-v2/src/components/concurrency/global-concurrency-view/data-table/data-table.test.tsx b/ui-v2/src/components/concurrency/global-concurrency-view/data-table/data-table.test.tsx new file mode 100644 index 000000000000..162194c5628e --- /dev/null +++ b/ui-v2/src/components/concurrency/global-concurrency-view/data-table/data-table.test.tsx @@ -0,0 +1,81 @@ +import { render, screen } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; +import { createWrapper } from "@tests/utils"; +import { describe, expect, it, vi } from "vitest"; +import { Table } from "./data-table"; + +const MOCK_DATA = [ + { + id: "0", + created: "2021-01-01T00:00:00Z", + updated: "2021-01-01T00:00:00Z", + active: true, + name: "global concurrency limit 0", + limit: 0, + active_slots: 0, + slot_decay_per_second: 0, + }, +]; + +describe("GlobalConcurrencyLimitTable -- table", () => { + it("renders row data", () => { + render( + , + { wrapper: createWrapper() }, + ); + expect( + screen.getByRole("cell", { name: /global concurrency limit 0/i }), + ).toBeVisible(); + expect( + screen.getByRole("switch", { name: /toggle active/i }), + ).toBeChecked(); + }); + + it("calls onDelete upon clicking delete action menu item", async () => { + const user = userEvent.setup(); + + const mockFn = vi.fn(); + + render( +
, + { wrapper: createWrapper() }, + ); + await user.click( + screen.getByRole("button", { name: /open menu/i, hidden: true }), + ); + await user.click(screen.getByRole("menuitem", { name: /delete/i })); + expect(mockFn).toHaveBeenCalledOnce(); + }); + it("calls onEdit upon clicking rest action menu item", async () => { + const user = userEvent.setup(); + const mockFn = vi.fn(); + + render( +
, + { wrapper: createWrapper() }, + ); + await user.click( + screen.getByRole("button", { name: /open menu/i, hidden: true }), + ); + await user.click(screen.getByRole("menuitem", { name: /edit/i })); + expect(mockFn).toHaveBeenCalledOnce(); + }); +}); diff --git a/ui-v2/src/components/concurrency/global-concurrency-view/data-table/data-table.tsx b/ui-v2/src/components/concurrency/global-concurrency-view/data-table/data-table.tsx index 77ae3de0184d..d246a82a0885 100644 --- a/ui-v2/src/components/concurrency/global-concurrency-view/data-table/data-table.tsx +++ b/ui-v2/src/components/concurrency/global-concurrency-view/data-table/data-table.tsx @@ -69,9 +69,40 @@ export const GlobalConcurrencyDataTable = ({ ); }, [data, deferredSearch]); + return ( +
+ void navigate({ + to: ".", + search: (prev) => ({ ...prev, search: value }), + }) + } + /> + ); +}; + +type TableProps = { + data: Array; + onDeleteRow: (row: GlobalConcurrencyLimit) => void; + onEditRow: (row: GlobalConcurrencyLimit) => void; + onSearchChange: (value: string) => void; + searchValue: string | undefined; +}; + +export function Table({ + data, + onDeleteRow, + onEditRow, + onSearchChange, + searchValue, +}: TableProps) { const table = useReactTable({ - data: filteredData, - columns: createColumns({ onEditRow, onDeleteRow }), + data, + columns: createColumns({ onDeleteRow, onEditRow }), getCoreRowModel: getCoreRowModel(), getPaginationRowModel: getPaginationRowModel(), //load client-side pagination code }); @@ -80,15 +111,10 @@ export const GlobalConcurrencyDataTable = ({
- void navigate({ - to: ".", - search: (prev) => ({ ...prev, search: e.target.value }), - }) - } + value={searchValue} + onChange={(e) => onSearchChange(e.target.value)} />
); -}; +} diff --git a/ui-v2/src/components/concurrency/global-concurrency-view/dialog/create-or-edit-limit-dialog/create-or-edit-limit-dialog.test.tsx b/ui-v2/src/components/concurrency/global-concurrency-view/dialog/create-or-edit-limit-dialog/create-or-edit-limit-dialog.test.tsx new file mode 100644 index 000000000000..e8473af769a8 --- /dev/null +++ b/ui-v2/src/components/concurrency/global-concurrency-view/dialog/create-or-edit-limit-dialog/create-or-edit-limit-dialog.test.tsx @@ -0,0 +1,88 @@ +import { CreateOrEditLimitDialog } from "./create-or-edit-limit-dialog"; + +import { render, screen } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; +import { createWrapper } from "@tests/utils"; +import { beforeAll, describe, expect, it, vi } from "vitest"; + +const MOCK_DATA = { + id: "0", + created: "2021-01-01T00:00:00Z", + updated: "2021-01-01T00:00:00Z", + active: false, + name: "global concurrency limit 0", + limit: 0, + active_slots: 0, + slot_decay_per_second: 0, +}; + +describe("CreateOrEditLimitDialog", () => { + beforeAll(() => { + class ResizeObserverMock { + observe() {} + unobserve() {} + disconnect() {} + } + + global.ResizeObserver = ResizeObserverMock; + }); + + it("able to create a new limit", async () => { + const user = userEvent.setup(); + + // ------------ Setup + const mockOnSubmitFn = vi.fn(); + render( + , + { wrapper: createWrapper() }, + ); + // ------------ Act + + await user.type(screen.getByLabelText(/name/i), MOCK_DATA.name); + await user.type( + screen.getByLabelText("Concurrency Limit"), + MOCK_DATA.limit.toString(), + ); + await user.type( + screen.getByLabelText("Slot Decay Per Second"), + MOCK_DATA.slot_decay_per_second.toString(), + ); + await user.click(screen.getByRole("button", { name: /save/i })); + + // ------------ Assert + expect(mockOnSubmitFn).toHaveBeenCalledOnce(); + }); + + it("able to edit a limit", async () => { + const user = userEvent.setup(); + + // ------------ Setup + const mockOnSubmitFn = vi.fn(); + render( + , + { wrapper: createWrapper() }, + ); + // ------------ Act + + await user.type(screen.getByLabelText(/name/i), MOCK_DATA.name); + await user.type( + screen.getByLabelText("Concurrency Limit"), + MOCK_DATA.limit.toString(), + ); + await user.type( + screen.getByLabelText("Slot Decay Per Second"), + MOCK_DATA.slot_decay_per_second.toString(), + ); + await user.click(screen.getByRole("button", { name: /update/i })); + + // ------------ Assert + expect(mockOnSubmitFn).toHaveBeenCalledOnce(); + }); +}); diff --git a/ui-v2/src/components/concurrency/global-concurrency-view/dialog/create-or-edit-limit-dialog/index.tsx b/ui-v2/src/components/concurrency/global-concurrency-view/dialog/create-or-edit-limit-dialog/create-or-edit-limit-dialog.tsx similarity index 100% rename from ui-v2/src/components/concurrency/global-concurrency-view/dialog/create-or-edit-limit-dialog/index.tsx rename to ui-v2/src/components/concurrency/global-concurrency-view/dialog/create-or-edit-limit-dialog/create-or-edit-limit-dialog.tsx diff --git a/ui-v2/src/components/concurrency/global-concurrency-view/dialog/create-or-edit-limit-dialog/index.ts b/ui-v2/src/components/concurrency/global-concurrency-view/dialog/create-or-edit-limit-dialog/index.ts new file mode 100644 index 000000000000..3d271c515e53 --- /dev/null +++ b/ui-v2/src/components/concurrency/global-concurrency-view/dialog/create-or-edit-limit-dialog/index.ts @@ -0,0 +1 @@ +export { CreateOrEditLimitDialog } from "./create-or-edit-limit-dialog"; diff --git a/ui-v2/src/components/concurrency/global-concurrency-view/dialog/delete-limit-dialog.test.tsx b/ui-v2/src/components/concurrency/global-concurrency-view/dialog/delete-limit-dialog.test.tsx new file mode 100644 index 000000000000..3f9f227f8618 --- /dev/null +++ b/ui-v2/src/components/concurrency/global-concurrency-view/dialog/delete-limit-dialog.test.tsx @@ -0,0 +1,43 @@ +import { DeleteLimitDialog } from "./delete-limit-dialog"; + +import { render, screen } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; +import { createWrapper } from "@tests/utils"; +import { expect, test, vi } from "vitest"; + +const MOCK_DATA = { + id: "0", + created: "2021-01-01T00:00:00Z", + updated: "2021-01-01T00:00:00Z", + active: false, + name: "global concurrency limit 0", + limit: 0, + active_slots: 0, + slot_decay_per_second: 0, +}; + +test("DeleteLimitDialog can successfully call delete", async () => { + const user = userEvent.setup(); + + // ------------ Setup + const mockOnDeleteFn = vi.fn(); + render( + , + { wrapper: createWrapper() }, + ); + + // ------------ Act + expect(screen.getByRole("heading", { name: /delete concurrency limit/i })); + await user.click( + screen.getByRole("button", { + name: /delete/i, + }), + ); + + // ------------ Assert + expect(mockOnDeleteFn).toHaveBeenCalledOnce(); +}); diff --git a/ui-v2/src/components/concurrency/global-concurrency-view/empty-state/global-concurrency-limit-empty-state.test.tsx b/ui-v2/src/components/concurrency/global-concurrency-view/empty-state/global-concurrency-limit-empty-state.test.tsx index 48cf3bb962a1..b2590e75f2dc 100644 --- a/ui-v2/src/components/concurrency/global-concurrency-view/empty-state/global-concurrency-limit-empty-state.test.tsx +++ b/ui-v2/src/components/concurrency/global-concurrency-view/empty-state/global-concurrency-limit-empty-state.test.tsx @@ -1,18 +1,16 @@ import { render, screen } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; -import { describe, expect, it, vi } from "vitest"; +import { expect, test, vi } from "vitest"; import { GlobalConcurrencyLimitEmptyState } from "./global-concurrency-limit-empty-state"; -describe("GlobalConcurrencyLimitEmptyState", () => { - it("when adding limit, callback gets fired", async () => { - const user = userEvent.setup(); +test("GlobalConcurrencyLimitEmptyState", async () => { + const user = userEvent.setup(); - const mockFn = vi.fn(); + const mockFn = vi.fn(); - render(); - await user.click( - screen.getByRole("button", { name: /Add Concurrency Limit/i }), - ); - expect(mockFn).toHaveBeenCalledOnce(); - }); + render(); + await user.click( + screen.getByRole("button", { name: /Add Concurrency Limit/i }), + ); + expect(mockFn).toHaveBeenCalledOnce(); }); diff --git a/ui-v2/src/components/concurrency/global-concurrency-view/header/global-concurrency-limits-header.test.tsx b/ui-v2/src/components/concurrency/global-concurrency-view/header/global-concurrency-limits-header.test.tsx new file mode 100644 index 000000000000..c067a7d29a42 --- /dev/null +++ b/ui-v2/src/components/concurrency/global-concurrency-view/header/global-concurrency-limits-header.test.tsx @@ -0,0 +1,26 @@ +import { GlobalConcurrencyLimitsHeader } from "./global-concurrency-limits-header"; + +import { render, screen } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; +import { expect, test, vi } from "vitest"; + +test("GlobalConcurrencyLimitsHeader can successfully call onAdd", async () => { + const user = userEvent.setup(); + + // ------------ Setup + const mockOnAddFn = vi.fn(); + render(); + + // ------------ Act + expect( + screen.getByRole("heading", { name: /global concurrency limits/i }), + ).toBeVisible(); + await user.click( + screen.getByRole("button", { + name: /add global concurrency limit/i, + }), + ); + + // ------------ Assert + expect(mockOnAddFn).toHaveBeenCalledOnce(); +}); diff --git a/ui-v2/src/components/concurrency/global-concurrency-view/global-concurrency-limits-header.tsx b/ui-v2/src/components/concurrency/global-concurrency-view/header/global-concurrency-limits-header.tsx similarity index 100% rename from ui-v2/src/components/concurrency/global-concurrency-view/global-concurrency-limits-header.tsx rename to ui-v2/src/components/concurrency/global-concurrency-view/header/global-concurrency-limits-header.tsx diff --git a/ui-v2/src/components/concurrency/global-concurrency-view/header/index.ts b/ui-v2/src/components/concurrency/global-concurrency-view/header/index.ts new file mode 100644 index 000000000000..421bd0174d83 --- /dev/null +++ b/ui-v2/src/components/concurrency/global-concurrency-view/header/index.ts @@ -0,0 +1 @@ +export { GlobalConcurrencyLimitsHeader } from "./global-concurrency-limits-header"; diff --git a/ui-v2/src/components/concurrency/global-concurrency-view/index.tsx b/ui-v2/src/components/concurrency/global-concurrency-view/index.tsx index 11d9d1a31a99..b66109159506 100644 --- a/ui-v2/src/components/concurrency/global-concurrency-view/index.tsx +++ b/ui-v2/src/components/concurrency/global-concurrency-view/index.tsx @@ -7,7 +7,7 @@ import { useState } from "react"; import { GlobalConcurrencyDataTable } from "./data-table"; import { type DialogState, DialogView } from "./dialog"; import { GlobalConcurrencyLimitEmptyState } from "./empty-state"; -import { GlobalConcurrencyLimitsHeader } from "./global-concurrency-limits-header"; +import { GlobalConcurrencyLimitsHeader } from "./header"; export const GlobalConcurrencyView = () => { const [openDialog, setOpenDialog] = useState({ diff --git a/ui-v2/src/components/concurrency/task-run-concurrenct-view/data-table/data-table.test.tsx b/ui-v2/src/components/concurrency/task-run-concurrenct-view/data-table/data-table.test.tsx new file mode 100644 index 000000000000..b15331a57494 --- /dev/null +++ b/ui-v2/src/components/concurrency/task-run-concurrenct-view/data-table/data-table.test.tsx @@ -0,0 +1,70 @@ +import { render, screen } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; +import { describe, expect, it, vi } from "vitest"; +import { Table } from "./data-table"; + +const MOCK_DATA = [ + { + id: "0", + created: "2021-01-01T00:00:00Z", + updated: "2021-01-01T00:00:00Z", + tag: "my tag 0", + concurrency_limit: 1, + active_slots: [] as Array, + }, +]; + +describe("TaskRunDataTable -- table", () => { + it("renders row data", () => { + render( +
, + ); + expect(screen.getByRole("cell", { name: /my tag 0/i })).toBeVisible(); + expect(screen.getByRole("cell", { name: /1/i })).toBeVisible(); + }); + it("calls onDelete upon clicking delete action menu item", async () => { + const user = userEvent.setup(); + + const mockFn = vi.fn(); + + render( +
, + ); + await user.click( + screen.getByRole("button", { name: /open menu/i, hidden: true }), + ); + await user.click(screen.getByRole("menuitem", { name: /delete/i })); + expect(mockFn).toHaveBeenCalledOnce(); + }); + it("calls onReset upon clicking rest action menu item", async () => { + const user = userEvent.setup(); + const mockFn = vi.fn(); + + render( +
, + ); + await user.click( + screen.getByRole("button", { name: /open menu/i, hidden: true }), + ); + await user.click(screen.getByRole("menuitem", { name: /reset/i })); + expect(mockFn).toHaveBeenCalledOnce(); + }); +}); diff --git a/ui-v2/src/components/concurrency/task-run-concurrenct-view/data-table/data-table.tsx b/ui-v2/src/components/concurrency/task-run-concurrenct-view/data-table/data-table.tsx index 1fda29f44fd7..e0a2b8fc2e66 100644 --- a/ui-v2/src/components/concurrency/task-run-concurrenct-view/data-table/data-table.tsx +++ b/ui-v2/src/components/concurrency/task-run-concurrenct-view/data-table/data-table.tsx @@ -65,8 +65,39 @@ export const TaskRunConcurrencyDataTable = ({ ); }, [data, deferredSearch]); + return ( +
+ void navigate({ + to: ".", + search: (prev) => ({ ...prev, search: value }), + }) + } + /> + ); +}; + +type TableProps = { + data: Array; + onDeleteRow: (row: TaskRunConcurrencyLimit) => void; + onResetRow: (row: TaskRunConcurrencyLimit) => void; + onSearchChange: (value: string) => void; + searchValue: string | undefined; +}; + +export function Table({ + data, + onDeleteRow, + onResetRow, + onSearchChange, + searchValue, +}: TableProps) { const table = useReactTable({ - data: filteredData, + data, columns: createColumns({ onDeleteRow, onResetRow }), getCoreRowModel: getCoreRowModel(), getPaginationRowModel: getPaginationRowModel(), //load client-side pagination code @@ -76,15 +107,10 @@ export const TaskRunConcurrencyDataTable = ({
- void navigate({ - to: ".", - search: (prev) => ({ ...prev, search: e.target.value }), - }) - } + value={searchValue} + onChange={(e) => onSearchChange(e.target.value)} />
); -}; +} diff --git a/ui-v2/src/components/concurrency/task-run-concurrenct-view/dialogs/create-dialog.test.tsx b/ui-v2/src/components/concurrency/task-run-concurrenct-view/dialogs/create-dialog.test.tsx new file mode 100644 index 000000000000..393e12b0ac05 --- /dev/null +++ b/ui-v2/src/components/concurrency/task-run-concurrenct-view/dialogs/create-dialog.test.tsx @@ -0,0 +1,48 @@ +import { CreateLimitDialog } from "./create-dialog"; + +import { render, screen } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; +import { createWrapper } from "@tests/utils"; +import { beforeAll, describe, expect, it, vi } from "vitest"; + +const MOCK_DATA = { + id: "0", + created: "2021-01-01T00:00:00Z", + updated: "2021-01-01T00:00:00Z", + tag: "my tag 0", + concurrency_limit: 1, + active_slots: [] as Array, +}; + +describe("CreateLimitDialog", () => { + beforeAll(() => { + class ResizeObserverMock { + observe() {} + unobserve() {} + disconnect() {} + } + global.ResizeObserver = ResizeObserverMock; + }); + + it.skip("calls onSubmit upon entering form data", async () => { + const user = userEvent.setup(); + + // ------------ Setup + const mockOnSubmitFn = vi.fn(); + render( + , + { wrapper: createWrapper() }, + ); + // ------------ Act + await user.type(screen.getByLabelText(/tag/i), MOCK_DATA.tag); + await user.type( + screen.getByLabelText("Concurrency Limit"), + MOCK_DATA.concurrency_limit.toString(), + ); + + await user.click(screen.getByRole("button", { name: /add/i })); + + // ------------ Assert + expect(mockOnSubmitFn).toHaveBeenCalledOnce(); + }); +}); diff --git a/ui-v2/src/components/concurrency/task-run-concurrenct-view/dialogs/delete-dialog.test.tsx b/ui-v2/src/components/concurrency/task-run-concurrenct-view/dialogs/delete-dialog.test.tsx new file mode 100644 index 000000000000..2eae080d669e --- /dev/null +++ b/ui-v2/src/components/concurrency/task-run-concurrenct-view/dialogs/delete-dialog.test.tsx @@ -0,0 +1,41 @@ +import { DeleteLimitDialog } from "./delete-dialog"; + +import { render, screen } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; +import { createWrapper } from "@tests/utils"; +import { expect, test, vi } from "vitest"; + +const MOCK_DATA = { + id: "0", + created: "2021-01-01T00:00:00Z", + updated: "2021-01-01T00:00:00Z", + tag: "my tag 0", + concurrency_limit: 1, + active_slots: [] as Array, +}; + +test("DeleteLimitDialog can successfully call delete", async () => { + const user = userEvent.setup(); + + // ------------ Setup + const mockOnDeleteFn = vi.fn(); + render( + , + { wrapper: createWrapper() }, + ); + + // ------------ Act + expect(screen.getByRole("heading", { name: /delete concurrency limit/i })); + await user.click( + screen.getByRole("button", { + name: /delete/i, + }), + ); + + // ------------ Assert + expect(mockOnDeleteFn).toHaveBeenCalledOnce(); +}); diff --git a/ui-v2/src/components/concurrency/task-run-concurrenct-view/dialogs/reset-dialog.test.tsx b/ui-v2/src/components/concurrency/task-run-concurrenct-view/dialogs/reset-dialog.test.tsx new file mode 100644 index 000000000000..fc789ac15a75 --- /dev/null +++ b/ui-v2/src/components/concurrency/task-run-concurrenct-view/dialogs/reset-dialog.test.tsx @@ -0,0 +1,45 @@ +import { ResetLimitDialog } from "./reset-dialog"; + +import { render, screen } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; +import { createWrapper } from "@tests/utils"; +import { expect, test, vi } from "vitest"; + +const MOCK_DATA = { + id: "0", + created: "2021-01-01T00:00:00Z", + updated: "2021-01-01T00:00:00Z", + tag: "my tag 0", + concurrency_limit: 1, + active_slots: [] as Array, +}; + +test("ResetLimitDialog can successfully call delete", async () => { + const user = userEvent.setup(); + + // ------------ Setup + const mockOnResetFn = vi.fn(); + render( + , + { wrapper: createWrapper() }, + ); + + // ------------ Act + expect( + screen.getByRole("heading", { + name: /reset concurrency limit for tag my tag 0/i, + }), + ); + await user.click( + screen.getByRole("button", { + name: /reset/i, + }), + ); + + // ------------ Assert + expect(mockOnResetFn).toHaveBeenCalledOnce(); +}); diff --git a/ui-v2/src/components/concurrency/task-run-concurrenct-view/header/index.ts b/ui-v2/src/components/concurrency/task-run-concurrenct-view/header/index.ts new file mode 100644 index 000000000000..5c98b17a6b83 --- /dev/null +++ b/ui-v2/src/components/concurrency/task-run-concurrenct-view/header/index.ts @@ -0,0 +1 @@ +export { TaskRunConcurrencyLimitsHeader } from "./task-run-concurrency-limit-header"; diff --git a/ui-v2/src/components/concurrency/task-run-concurrenct-view/header.tsx b/ui-v2/src/components/concurrency/task-run-concurrenct-view/header/task-run-concurrency-limit-header.tsx similarity index 100% rename from ui-v2/src/components/concurrency/task-run-concurrenct-view/header.tsx rename to ui-v2/src/components/concurrency/task-run-concurrenct-view/header/task-run-concurrency-limit-header.tsx diff --git a/ui-v2/src/components/concurrency/task-run-concurrenct-view/header/task-run-conrrency-limits-header.test.tsx b/ui-v2/src/components/concurrency/task-run-concurrenct-view/header/task-run-conrrency-limits-header.test.tsx new file mode 100644 index 000000000000..6a8198620b2f --- /dev/null +++ b/ui-v2/src/components/concurrency/task-run-concurrenct-view/header/task-run-conrrency-limits-header.test.tsx @@ -0,0 +1,26 @@ +import { TaskRunConcurrencyLimitsHeader } from "./task-run-concurrency-limit-header"; + +import { render, screen } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; +import { expect, test, vi } from "vitest"; + +test("TaskRunConcurrencyLimitsHeader can successfully call onAdd", async () => { + const user = userEvent.setup(); + + // ------------ Setup + const mockOnAddFn = vi.fn(); + render(); + + // ------------ Act + expect( + screen.getByRole("heading", { name: /task run concurrency limits/i }), + ).toBeVisible(); + await user.click( + screen.getByRole("button", { + name: /add task run concurrency limit/i, + }), + ); + + // ------------ Assert + expect(mockOnAddFn).toHaveBeenCalledOnce(); +});