Simplify and standardize testing structure

2026-01-28 14:04:04 -07:00
parent e7a31789e3
commit 7ea724a8d9
95 changed files with 1534 additions and 15485 deletions
@@ -0,0 +1,66 @@
+import React from "react";
+import { render, screen } from "@testing-library/react";
+import { describe, it, expect } from "vitest";
+import HeroBanner from "../../app/components/HeroBanner";
+import {
+  componentTestSuite,
+  ComponentTestSuiteConfig,
+} from "../utils/componentTestSuite";
+
+type HeroBannerProps = React.ComponentProps<typeof HeroBanner>;
+
+const baseProps: HeroBannerProps = {
+  title: "Welcome",
+};
+
+const config: ComponentTestSuiteConfig<HeroBannerProps> = {
+  component: HeroBanner,
+  name: "HeroBanner",
+  props: baseProps,
+  optionalProps: {
+    subtitle: "Subtitle",
+    description: "Description",
+    ctaText: "CTA",
+    ctaHref: "/link",
+  },
+  primaryRole: "region",
+  testCases: {
+    renders: true,
+    accessibility: true,
+    keyboardNavigation: false,
+    disabledState: false,
+    errorState: false,
+  },
+};
+
+componentTestSuite<HeroBannerProps>(config);
+
+describe("HeroBanner (behavioral tests)", () => {
+  it("renders title", () => {
+    render(<HeroBanner title="Test Title" />);
+    expect(
+      screen.getByRole("heading", { name: "Test Title" }),
+    ).toBeInTheDocument();
+  });
+
+  it("renders subtitle when provided", () => {
+    render(<HeroBanner title="Test" subtitle="Subtitle" />);
+    expect(screen.getByRole("heading", { name: "Subtitle" })).toBeInTheDocument();
+  });
+
+  it("renders hero image", () => {
+    render(<HeroBanner title="Test" />);
+    expect(
+      screen.getByRole("img", { name: "Hero illustration" }),
+    ).toBeInTheDocument();
+  });
+
+  it("renders CTA button when provided", () => {
+    render(
+      <HeroBanner title="Test" ctaText="Get Started" ctaHref="/start" />,
+    );
+    expect(
+      screen.getAllByRole("button", { name: "Get Started" }).length,
+    ).toBeGreaterThan(0);
+  });
+});