From 369e2200bde8ad72ef1114eb5f716b14b86d0673 Mon Sep 17 00:00:00 2001
From: gamana618 <anjanap1509@gmail.com>
Date: Fri, 12 Jun 2026 17:34:35 +0530
Subject: [PATCH] test: add theme contrast tests for RepoPerformanceTable

- Add 5 test cases for dark/light mode visual cohesion
- Verify Tailwind classes for both themes
- Ensure table content accessibility
- Closes #4489
---
 ...poPerformanceTable.theme-contrast.test.tsx | 69 +++++++++++++++++++
 1 file changed, 69 insertions(+)
 create mode 100644 components/dashboard/PRInsights/RepoPerformanceTable.theme-contrast.test.tsx

diff --git a/components/dashboard/PRInsights/RepoPerformanceTable.theme-contrast.test.tsx b/components/dashboard/PRInsights/RepoPerformanceTable.theme-contrast.test.tsx
new file mode 100644
index 000000000..3b715142e
--- /dev/null
+++ b/components/dashboard/PRInsights/RepoPerformanceTable.theme-contrast.test.tsx
@@ -0,0 +1,69 @@
+import { render, screen } from '@testing-library/react';
+import RepoPerformanceTable from './RepoPerformanceTable';
+import { describe, expect, it } from 'vitest';
+
+const mockData = {
+  repoPerformance: [
+    {
+      name: 'owner/test-repo',
+      totalPRs: 25,
+      mergeRate: 80,
+      reviewCount: 15,
+    },
+  ],
+};
+
+describe('RepoPerformanceTable Theme Contrast', () => {
+  it('renders light theme styling classes', () => {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const { container } = render(<RepoPerformanceTable data={mockData as any} />);
+
+    const heading = screen.getByText('Repository Performance');
+    expect(heading.className).toContain('text-gray-900');
+    expect(heading.className).toContain('dark:text-white');
+
+    const root = container.firstChild as HTMLElement;
+    expect(root.className).toContain('bg-white');
+  });
+
+  it('includes dark theme styling classes', () => {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const { container } = render(<RepoPerformanceTable data={mockData as any} />);
+
+    const root = container.firstChild as HTMLElement;
+
+    expect(root.className).toContain('dark:bg-zinc-900/50');
+    expect(root.className).toContain('dark:border-white/10');
+  });
+
+  it('maintains readable repository text contrast', () => {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    render(<RepoPerformanceTable data={mockData as any} />);
+
+    const repoName = screen.getByText('test-repo');
+
+    expect(repoName.className).toContain('text-gray-900');
+    expect(repoName.className).toContain('dark:text-white');
+  });
+
+  it('maintains readable metrics contrast', () => {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    render(<RepoPerformanceTable data={mockData as any} />);
+
+    const mergeRate = screen.getByText('80%');
+
+    expect(mergeRate.className).toContain('text-gray-700');
+    expect(mergeRate.className).toContain('dark:text-gray-300');
+  });
+
+  it('keeps table content visible and accessible', () => {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    render(<RepoPerformanceTable data={mockData as any} />);
+
+    expect(screen.getByRole('table')).toBeInTheDocument();
+    expect(screen.getByText('Repository')).toBeInTheDocument();
+    expect(screen.getByText('PRs')).toBeInTheDocument();
+    expect(screen.getByText('Merge Rate')).toBeInTheDocument();
+    expect(screen.getByText('Reviews')).toBeInTheDocument();
+  });
+});