diff --git a/website/src/components/TaskSelection/TaskOption.test.tsx b/website/src/components/TaskSelection/TaskOption.test.tsx index bc051338..75eb6070 100644 --- a/website/src/components/TaskSelection/TaskOption.test.tsx +++ b/website/src/components/TaskSelection/TaskOption.test.tsx @@ -1,23 +1,34 @@ -import { render, screen } from "@testing-library/react"; +import { fireEvent, render, screen } from "@testing-library/react"; +import { RouterContext } from "next/dist/shared/lib/router-context"; import React from "react"; +import { createMockRouter } from "src/test-utils/createMockRouter"; import { OptionProps, TaskOption } from "./TaskOption"; describe("TaskOption component", () => { const testProps: OptionProps = { + title: "Task Title", alt: "Task Title", img: "/imgPath", - title: "Task Title", - link: "/create/summarize_story", + link: "/fake/path", }; - beforeEach(() => { + it("should render", () => { render(); + expect(screen.getByRole("heading")).toHaveTextContent("Task Title"); + expect(screen.getByRole("img")).toHaveAttribute("alt", "Task Title"); + expect(screen.getByRole("link")).toHaveAttribute("href", "/fake/path"); }); - it("should render Task Option component", () => { - expect(screen.getByRole("heading")).toHaveTextContent(testProps.title); - expect(screen.getByRole("link")).toHaveAttribute("href", testProps.link); - expect(screen.queryByText("hi")).toBeNull(); + it("should navigate properly on click", () => { + const router = createMockRouter({ pathname: "/fake/path" }); + render( + + + + ); + expect(screen.getByRole("link")).toHaveAttribute("href", "/fake/path"); + fireEvent.click(screen.getByRole("link")); + expect(router.push).toHaveBeenCalledWith("/fake/path", expect.anything(), expect.anything()); }); }); diff --git a/website/src/pages.test/about.test.tsx b/website/src/pages.test/about.test.tsx new file mode 100644 index 00000000..f4603bf2 --- /dev/null +++ b/website/src/pages.test/about.test.tsx @@ -0,0 +1,10 @@ +import { render, screen } from "@testing-library/react"; +import AboutPage from "src/pages/about"; + +describe("About page", () => { + it("should render correctly", () => { + render(); + + expect(screen.getByRole("heading", {level: 1})).toHaveTextContent("What is OpenAssistant?"); + }); +}); diff --git a/website/src/test-utils/createMockRouter.ts b/website/src/test-utils/createMockRouter.ts new file mode 100644 index 00000000..121ddf24 --- /dev/null +++ b/website/src/test-utils/createMockRouter.ts @@ -0,0 +1,31 @@ +import { NextRouter } from "next/router"; + +export function createMockRouter(router: Partial): NextRouter { + const mockRouter: NextRouter = { + route: "/", + pathname: "/", + query: {}, + asPath: "/", + basePath: "", + defaultLocale: "en", + domainLocales: [], + isLocaleDomain: false, + push: jest.fn(), + replace: jest.fn(), + reload: jest.fn(), + back: jest.fn(), + forward: jest.fn(), + prefetch: jest.fn(), + beforePopState: jest.fn(), + isFallback: false, + isReady: true, + isPreview: false, + events: { + on: jest.fn(), + off: jest.fn(), + emit: jest.fn(), + }, + ...router + }; + return mockRouter; +}