From bd6550fa2f5d482cf82f026363cb3c2051f4e0be Mon Sep 17 00:00:00 2001 From: Kai Date: Mon, 9 Feb 2026 21:40:08 -0800 Subject: [PATCH] test: align about and calculator page assertions with current UI --- __tests__/about-page.test.tsx | 123 ++++++++++++++++++----------- __tests__/calculator-page.test.tsx | 72 ++++++++++++----- 2 files changed, 130 insertions(+), 65 deletions(-) diff --git a/__tests__/about-page.test.tsx b/__tests__/about-page.test.tsx index 83177a83..7b32b3c0 100644 --- a/__tests__/about-page.test.tsx +++ b/__tests__/about-page.test.tsx @@ -1,7 +1,6 @@ /** @jest-environment jsdom */ - import React from "react"; -import { render } from "@testing-library/react"; +import { render, screen, waitFor } from "@testing-library/react"; import AboutPage from "@/app/about/page"; jest.setTimeout(10_000); @@ -63,58 +62,94 @@ jest.mock("next/navigation", () => ({ useParams: () => ({}), })); +const mockAboutPayload = { + mission: "Build reliable defaults for every autonomous software agent.", + team: [ + { + name: "Kai", + role: "Founder", + bio: "Builds product direction and platform roadmap.", + avatarUrl: "https://example.com/kai.png", + socialLinks: { GitHub: "https://github.com/kai" }, + }, + { + name: "Scout", + role: "Developer Relations", + bio: "Supports contributors and documentation quality.", + avatarUrl: "https://example.com/scout.png", + socialLinks: { X: "https://x.com/scout" }, + }, + ], + milestones: [ + { + date: "2025-01-10", + title: "Public launch", + description: "Opened contributions to the wider agent ecosystem.", + }, + ], + stats: { + launchDate: "2025-01-01", + totalSkills: 42, + totalAgents: 150, + contributorsCount: 18, + }, +}; + describe("/about page", () => { - test("renders without crashing", () => { - const { container } = render(); - expect(container).toBeInTheDocument(); - }); + let rafTime = 0; - test("displays hero section with tagline", () => { - const { getByText } = render(); - expect(getByText("Built by agents, for agents")).toBeInTheDocument(); - }); + beforeEach(() => { + rafTime = 0; - test("displays story section", () => { - const { getByText } = render(); - expect(getByText("📖 Our Story")).toBeInTheDocument(); - }); + jest.spyOn(window, "requestAnimationFrame").mockImplementation((cb: FrameRequestCallback) => { + rafTime += 1500; + return window.setTimeout(() => cb(rafTime), 0); + }); - test("displays team section with all members", () => { - const { getByText } = render(); - expect(getByText("👥 The Team")).toBeInTheDocument(); - expect(getByText("Kai")).toBeInTheDocument(); - expect(getByText("Scout")).toBeInTheDocument(); - expect(getByText("Link")).toBeInTheDocument(); - expect(getByText("Echo")).toBeInTheDocument(); + jest.spyOn(global, "fetch").mockResolvedValue({ + ok: true, + json: async () => mockAboutPayload, + } as Response); }); - test("displays stats section", () => { - const { getByText } = render(); - expect(getByText("📊 By The Numbers")).toBeInTheDocument(); - expect(getByText("Skills Listed")).toBeInTheDocument(); - expect(getByText("Agents Registered")).toBeInTheDocument(); + afterEach(() => { + jest.restoreAllMocks(); }); - test("displays values section", () => { - const { getByText } = render(); - expect(getByText("💎 Our Values")).toBeInTheDocument(); - expect(getByText("Open Source")).toBeInTheDocument(); - expect(getByText("Agent-First")).toBeInTheDocument(); - expect(getByText("Security")).toBeInTheDocument(); - expect(getByText("Community")).toBeInTheDocument(); - }); + test("renders hero and mission content from live payload", async () => { + const { container } = render(); + expect(container).toBeInTheDocument(); - test("displays timeline section", () => { - const { getByText } = render(); - expect(getByText("📅 Timeline")).toBeInTheDocument(); - expect(getByText("Born")).toBeInTheDocument(); - expect(getByText("First Launch")).toBeInTheDocument(); - expect(getByText("100 PRs Milestone")).toBeInTheDocument(); + await waitFor(() => { + expect(screen.getByText("Built by agents, for agents")).toBeInTheDocument(); + }); + + expect(screen.getByText("Live platform data")).toBeInTheDocument(); + expect(screen.getByText("Mission")).toBeInTheDocument(); + expect(screen.getByText(mockAboutPayload.mission)).toBeInTheDocument(); }); - test("displays Join Us CTA section", () => { - const { getByText } = render(); - expect(getByText("Join Us")).toBeInTheDocument(); - expect(getByText("Submit a Skill")).toBeInTheDocument(); + test("renders stats, team, milestones, and CTA sections", async () => { + render(); + + await waitFor(() => { + expect(screen.getByText("Platform Stats")).toBeInTheDocument(); + }); + + expect(screen.getByText("Skills")).toBeInTheDocument(); + expect(screen.getByText("Agents")).toBeInTheDocument(); + expect(screen.getByText("Contributors")).toBeInTheDocument(); + expect(screen.getByText("Days since launch")).toBeInTheDocument(); + + expect(screen.getByText("Team")).toBeInTheDocument(); + expect(screen.getByText("Kai")).toBeInTheDocument(); + expect(screen.getByText("Scout")).toBeInTheDocument(); + + expect(screen.getByText("Milestones")).toBeInTheDocument(); + expect(screen.getByText("Public launch")).toBeInTheDocument(); + + expect(screen.getByText("Build with us")).toBeInTheDocument(); + expect(screen.getByRole("link", { name: "Submit a Skill" })).toBeInTheDocument(); + expect(screen.getByRole("link", { name: "Contribute on GitHub" })).toBeInTheDocument(); }); }); diff --git a/__tests__/calculator-page.test.tsx b/__tests__/calculator-page.test.tsx index 1124a2e3..04bd0f6e 100644 --- a/__tests__/calculator-page.test.tsx +++ b/__tests__/calculator-page.test.tsx @@ -1,7 +1,6 @@ /** @jest-environment jsdom */ - import React from "react"; -import { render, screen } from "@testing-library/react"; +import { render, screen, waitFor } from "@testing-library/react"; import CalculatorPage from "../src/app/calculator/page"; type LinkProps = { @@ -19,34 +18,65 @@ jest.mock("next/link", () => { return LinkMock; }); +const mockPresets = [ + { + id: "preset-startup", + name: "Startup Team", + description: "Small team with fast automation wins", + inputs: { + agents: 4, + hoursSavedPerAgentPerDay: 1.5, + hourlyRate: 80, + monthlyToolCosts: 499, + }, + }, +]; + describe("Calculator Page", () => { - it("renders the calculator page", () => { - const { container } = render(); - expect(container).toBeInTheDocument(); + beforeEach(() => { + jest.spyOn(global, "fetch").mockResolvedValue({ + ok: true, + json: async () => ({ presets: mockPresets }), + } as Response); }); - it("displays the page title", () => { - render(); - expect(screen.getByText("AI Agent Cost Calculator")).toBeInTheDocument(); + afterEach(() => { + jest.restoreAllMocks(); }); - it("displays configuration section", () => { - render(); - expect(screen.getByText("Configuration")).toBeInTheDocument(); - }); + it("renders the updated calculator hero and primary sections", async () => { + const { container } = render(); + expect(container).toBeInTheDocument(); - it("displays estimated costs section", () => { - render(); - expect(screen.getByText("Estimated Costs")).toBeInTheDocument(); - }); + expect(screen.getByText("Agent ROI Calculator")).toBeInTheDocument(); - it("displays model comparison section", () => { - render(); - expect(screen.getByText("Model Comparison")).toBeInTheDocument(); + await waitFor(() => { + expect(screen.getByRole("button", { name: "Startup Team" })).toBeInTheDocument(); + }); + + expect(screen.getByText("Inputs")).toBeInTheDocument(); + expect(screen.getByText("Computed ROI")).toBeInTheDocument(); }); - it("displays optimization tips section", () => { + it("renders the current calculator input labels and ROI metrics", async () => { render(); - expect(screen.getByText("Cost Optimization Tips")).toBeInTheDocument(); + + await waitFor(() => { + expect(screen.getByText("Number of Agents")).toBeInTheDocument(); + }); + + expect(screen.getByText("Hours Saved per Agent per Day")).toBeInTheDocument(); + expect(screen.getByText("Average Hourly Rate (USD)")).toBeInTheDocument(); + expect(screen.getByText("Monthly Tool Costs (USD)")).toBeInTheDocument(); + + expect(screen.getByText("Monthly Productivity Value")).toBeInTheDocument(); + expect(screen.getByText("Monthly Savings")).toBeInTheDocument(); + expect(screen.getByText("Annual ROI")).toBeInTheDocument(); + expect(screen.getByText("Payback Period")).toBeInTheDocument(); + expect(screen.getByText("Efficiency Gain")).toBeInTheDocument(); + + const formulaText = screen.getByText(/Formula used:/i); + expect(formulaText).toBeInTheDocument(); + expect(formulaText).toHaveTextContent(/agents × hours saved × hourly rate × 22\s*days/i); }); });