Fix tests after ts change

tests/integration/layout.integration.test.jsx

@@ -14,7 +14,7 @@ describe("Layout Integration", () => {
       <div>
         <Header />
         <Footer />
-      </div>,
+      </div>
     );
 
     // Check that CommunityRule branding appears in both header and footer
@@ -30,31 +30,33 @@ describe("Layout Integration", () => {
       <div>
         <Header />
         <Footer />
-      </div>,
+      </div>
     );
 
     // Header navigation items
     expect(
       screen.getAllByRole("menuitem", { name: "Navigate to Use cases page" })
-        .length,
+        .length
     ).toBeGreaterThan(0);
     expect(
-      screen.getAllByRole("menuitem", { name: "Navigate to Learn page" })
-        .length,
+      screen.getAllByRole("menuitem", { name: "Navigate to Learn page" }).length
     ).toBeGreaterThan(0);
     expect(
-      screen.getAllByRole("menuitem", { name: "Navigate to About page" })
-        .length,
+      screen.getAllByRole("menuitem", { name: "Navigate to About page" }).length
     ).toBeGreaterThan(0);
 
     // Footer navigation items (should be present in footer as well)
-    const useCasesLinks = screen.getAllByRole("link", { name: "Use cases" });
-    const learnLinks = screen.getAllByRole("link", { name: "Learn" });
-    const aboutLinks = screen.getAllByRole("link", { name: "About" });
+    // Footer has navigation links that match header
+    const footerUseCasesLinks = screen.getAllByRole("link", {
+      name: "Use cases",
+    });
+    const footerLearnLinks = screen.getAllByRole("link", { name: "Learn" });
+    const footerAboutLinks = screen.getAllByRole("link", { name: "About" });
 
-    expect(useCasesLinks.length).toBeGreaterThan(0);
-    expect(learnLinks.length).toBeGreaterThan(0);
-    expect(aboutLinks.length).toBeGreaterThan(0);
+    // Check that footer has these links (they may be in header too, so getAllByRole will find both)
+    expect(footerUseCasesLinks.length).toBeGreaterThan(0);
+    expect(footerLearnLinks.length).toBeGreaterThan(0);
+    expect(footerAboutLinks.length).toBeGreaterThan(0);
   });
 
   test("header navigation is interactive", async () => {
@@ -94,23 +96,23 @@ describe("Layout Integration", () => {
     // Contact information
     expect(screen.getByText("medlab@colorado.edu")).toBeInTheDocument();
     expect(
-      screen.getByRole("link", { name: "medlab@colorado.edu" }),
+      screen.getByRole("link", { name: "medlab@colorado.edu" })
     ).toHaveAttribute("href", "mailto:medlab@colorado.edu");
 
     // Social media links
     expect(
-      screen.getByRole("link", { name: "Follow us on Bluesky" }),
+      screen.getByRole("link", { name: "Follow us on Bluesky" })
     ).toBeInTheDocument();
     expect(
-      screen.getByRole("link", { name: "Follow us on GitLab" }),
+      screen.getByRole("link", { name: "Follow us on GitLab" })
     ).toBeInTheDocument();
 
     // Legal links
     expect(
-      screen.getByRole("link", { name: "Privacy Policy" }),
+      screen.getByRole("link", { name: "Privacy Policy" })
     ).toBeInTheDocument();
     expect(
-      screen.getByRole("link", { name: "Terms of Service" }),
+      screen.getByRole("link", { name: "Terms of Service" })
     ).toBeInTheDocument();
   });
 
@@ -136,7 +138,7 @@ describe("Layout Integration", () => {
       <div>
         <Header />
         <Footer />
-      </div>,
+      </div>
     );
 
     // Header should have banner role
@@ -157,7 +159,7 @@ describe("Layout Integration", () => {
       <div>
         <Header />
         <Footer />
-      </div>,
+      </div>
     );
 
     // Header should have responsive navigation elements
@@ -174,7 +176,7 @@ describe("Layout Integration", () => {
       <div>
         <Header />
         <Footer />
-      </div>,
+      </div>
     );
 
     // Get all interactive elements
@@ -197,7 +199,7 @@ describe("Layout Integration", () => {
       <div>
         <Header />
         <Footer />
-      </div>,
+      </div>
     );
 
     // Header provides main navigation
@@ -217,7 +219,7 @@ describe("Layout Integration", () => {
       <div>
         <Header />
         <Footer />
-      </div>,
+      </div>
     );
 
     // Main navigation in header
@@ -230,13 +232,13 @@ describe("Layout Integration", () => {
       (link) =>
         link.textContent?.includes("Use cases") ||
         link.textContent?.includes("Learn") ||
-        link.textContent?.includes("About"),
+        link.textContent?.includes("About")
     );
     expect(navigationLinks.length).toBeGreaterThan(0);
 
     // Contact information in footer
     expect(
-      screen.getByRole("link", { name: "medlab@colorado.edu" }),
+      screen.getByRole("link", { name: "medlab@colorado.edu" })
     ).toBeInTheDocument();
   });
 });

tests/unit/BlogPage.test.jsx

@@ -111,9 +111,8 @@ describe("BlogPostPage", () => {
     vi.clearAllMocks();
 
     // Mock the content functions
-    const { getBlogPostBySlug, getAllBlogPosts } = await import(
-      "../../lib/content"
-    );
+    const { getBlogPostBySlug, getAllBlogPosts } =
+      await import("../../lib/content");
     vi.mocked(getBlogPostBySlug).mockReturnValue(mockPost);
     vi.mocked(getAllBlogPosts).mockReturnValue([mockPost, ...mockRelatedPosts]);
   });

tests/unit/Footer.test.jsx

@@ -27,7 +27,7 @@ describe("Footer", () => {
     expect(schemaData.email).toBe("medlab@colorado.edu");
     expect(schemaData.url).toBe("https://communityrule.com");
     expect(schemaData.sameAs).toContain(
-      "https://bsky.app/profile/medlabboulder",
+      "https://bsky.app/profile/medlabboulder"
     );
     expect(schemaData.sameAs).toContain("https://gitlab.com/medlabboulder");
   });
@@ -36,7 +36,7 @@ describe("Footer", () => {
     render(<Footer />);
 
     expect(
-      screen.getAllByText("Media Economies Design Lab").length,
+      screen.getAllByText("Media Economies Design Lab").length
     ).toBeGreaterThan(0);
 
     const emailLinks = screen.getAllByRole("link", {
@@ -86,13 +86,13 @@ describe("Footer", () => {
     render(<Footer />);
 
     expect(
-      screen.getAllByRole("link", { name: "Use cases" }).length,
+      screen.getAllByRole("link", { name: "Use cases" }).length
     ).toBeGreaterThan(0);
     expect(
-      screen.getAllByRole("link", { name: "Learn" }).length,
+      screen.getAllByRole("link", { name: "Learn" }).length
     ).toBeGreaterThan(0);
     expect(
-      screen.getAllByRole("link", { name: "About" }).length,
+      screen.getAllByRole("link", { name: "About" }).length
     ).toBeGreaterThan(0);
   });
 
@@ -100,13 +100,13 @@ describe("Footer", () => {
     render(<Footer />);
 
     expect(
-      screen.getAllByRole("link", { name: "Privacy Policy" }).length,
+      screen.getAllByRole("link", { name: "Privacy Policy" }).length
     ).toBeGreaterThan(0);
     expect(
-      screen.getAllByRole("link", { name: "Terms of Service" }).length,
+      screen.getAllByRole("link", { name: "Terms of Service" }).length
     ).toBeGreaterThan(0);
     expect(
-      screen.getAllByRole("link", { name: "Cookies Settings" }).length,
+      screen.getAllByRole("link", { name: "Cookies Settings" }).length
     ).toBeGreaterThan(0);
   });
 
@@ -114,7 +114,7 @@ describe("Footer", () => {
     render(<Footer />);
 
     expect(screen.getAllByText("© All right reserved").length).toBeGreaterThan(
-      0,
+      0
     );
   });
 
@@ -123,7 +123,7 @@ describe("Footer", () => {
 
     // Check that logo containers exist for different breakpoints
     const logoContainers = document.querySelectorAll(
-      '[class*="block sm:hidden"], [class*="hidden sm:block lg:hidden"], [class*="hidden lg:block"]',
+      '[class*="block sm:hidden"], [class*="hidden sm:block lg:hidden"], [class*="hidden lg:block"]'
     );
     expect(logoContainers.length).toBeGreaterThan(0);
   });
@@ -147,7 +147,7 @@ describe("Footer", () => {
 
     // The Separator component should be rendered (it uses a div with border, not hr)
     const separator = document.querySelector(
-      ".bg-\\[var\\(--border-color-default-secondary\\)\\]",
+      ".bg-\\[var\\(--border-color-default-secondary\\)\\]"
     );
     expect(separator).toBeInTheDocument();
   });
@@ -263,10 +263,10 @@ describe("Footer", () => {
       expect(emailLink).toHaveClass("focus:ring-2");
       expect(emailLink).toHaveClass("focus:ring-offset-2");
       expect(emailLink).toHaveClass(
-        "focus:ring-[var(--color-content-default-primary)]",
+        "focus:ring-[var(--color-content-default-primary)]"
       );
       expect(emailLink).toHaveClass(
-        "focus:ring-offset-[var(--color-surface-default-primary)]",
+        "focus:ring-offset-[var(--color-surface-default-primary)]"
       );
     });
 
@@ -276,10 +276,10 @@ describe("Footer", () => {
       expect(link).toHaveClass("focus:ring-2");
       expect(link).toHaveClass("focus:ring-offset-2");
       expect(link).toHaveClass(
-        "focus:ring-[var(--color-content-default-primary)]",
+        "focus:ring-[var(--color-content-default-primary)]"
       );
       expect(link).toHaveClass(
-        "focus:ring-offset-[var(--color-surface-default-primary)]",
+        "focus:ring-offset-[var(--color-surface-default-primary)]"
       );
     });
   });