feat: add separate tsconfig for test files

.pre-commit-config.yaml

@@ -99,6 +99,9 @@ repos:
       - id: check-case-conflict
       - id: check-executables-have-shebangs
       - id: check-json
+        # tsconfig.json uses JSONC (comments).
+        # Matches frontend/tsconfig.json and frontend/**/tsconfig.json
+        exclude: ^frontend/(?:[^/]+/)*tsconfig\.json$
       - id: check-merge-conflict
       - id: check-toml
       - id: check-yaml

docker/frontend/Dockerfile.a11y.test

@@ -19,7 +19,8 @@ RUN --mount=type=cache,id=pnpm,target=/pnpm/store \
 
 COPY __tests__/a11y __tests__/a11y
 COPY __tests__/mockData __tests__/mockData
-COPY .pnpmrc jest.config.ts jest.setup.ts tsconfig.json ./
+COPY __tests__/jest.setup.ts __tests__/jest.setup.ts
+COPY .pnpmrc jest.config.ts tsconfig.json ./
 COPY public public
 COPY src src
 

docker/frontend/Dockerfile.unit.test

@@ -19,7 +19,9 @@ RUN --mount=type=cache,id=pnpm,target=/pnpm/store \
 
 COPY __tests__/unit __tests__/unit
 COPY __tests__/mockData __tests__/mockData
-COPY .pnpmrc jest.config.ts jest.setup.ts tsconfig.json ./
+COPY __tests__/jest.setup.ts __tests__/jest.setup.ts
+COPY __tests__/tsconfig.json __tests__/tsconfig.json
+COPY .pnpmrc jest.config.ts tsconfig.json ./
 COPY public public
 COPY src src
 

frontend/__tests__/a11y/components/CardDetailsPage.a11y.test.tsx

@@ -188,8 +188,8 @@ describe.each([
             name: 'Intro to Web',
             description: 'A beginner friendly module.',
             experienceLevel: ExperienceLevelEnum.Beginner,
-            startedAt: 1735689600, // 2025-01-01
-            endedAt: 1740787200, // 2025-03-01
+            startedAt: '2025-01-01T00:00:00.000Z',
+            endedAt: '2025-03-01T00:00:00.000Z',
             mentors: [
               {
                 id: 'mentor-mentor1',

frontend/__tests__/a11y/components/LeadersList.a11y.test.tsx

@@ -41,7 +41,9 @@ describe.each([
     document.documentElement.classList.toggle('dark', theme === 'dark')
   })
   it('should not have any accessibility violations', async () => {
-    const { container } = render(<LeadersList leaders={'John Doe, Jane Smith, Bob Johnson'} />)
+    const { container } = render(
+      <LeadersList entityKey="a11y-leaders" leaders={'John Doe, Jane Smith, Bob Johnson'} />
+    )
 
     const results = await axe(container)
 

frontend/__tests__/a11y/components/MentorshipPullRequest.a11y.test.tsx

@@ -15,7 +15,7 @@ const mockPR: PullRequest = {
     avatarUrl: 'https://example.com/avatar.png',
     key: 'testuser',
     contributionsCount: 10,
-    createdAt: 0,
+    createdAt: '1970-01-01T00:00:00.000Z',
     followersCount: 5,
     followingCount: 3,
     publicRepositoriesCount: 8,

frontend/__tests__/a11y/components/ModuleCard.a11y.test.tsx

@@ -1,6 +1,7 @@
 import { render } from '@testing-library/react'
 import { axe } from 'jest-axe'
 import { useTheme } from 'next-themes'
+import { ExperienceLevelEnum } from 'types/__generated__/graphql'
 import ModuleCard from 'components/ModuleCard'
 
 jest.mock('@apollo/client/react', () => ({
@@ -12,11 +13,25 @@ const mockModules = [
     key: 'module-1',
     name: 'Intro to Web Security',
     description: 'A beginner module',
-    experienceLevel: 'BEGINNER',
+    experienceLevel: ExperienceLevelEnum.Beginner,
     startedAt: '2025-01-01',
     endedAt: '2025-03-01',
-    mentors: [{ login: 'mentor1', name: 'Mentor One', avatarUrl: 'https://example.com/m1.png' }],
-    mentees: [{ login: 'mentee1', name: 'Mentee One', avatarUrl: 'https://example.com/me1.png' }],
+    mentors: [
+      {
+        id: 'm1',
+        login: 'mentor1',
+        name: 'Mentor One',
+        avatarUrl: 'https://example.com/m1.png',
+      },
+    ],
+    mentees: [
+      {
+        id: 'e1',
+        login: 'mentee1',
+        name: 'Mentee One',
+        avatarUrl: 'https://example.com/me1.png',
+      },
+    ],
     tags: ['web'],
     domains: ['security'],
   },
@@ -33,7 +48,7 @@ describe.each([
   it('should have no accessibility violations', async () => {
     const { container } = render(
       <main>
-        <ModuleCard modules={mockModules as never[]} login="testuser" />
+        <ModuleCard modules={mockModules} />
       </main>
     )
 

frontend/__tests__/a11y/components/ProgramCard.a11y.test.tsx

@@ -15,8 +15,8 @@ const baseMockProgram: Program = {
   name: 'Test Program',
   description: 'This is a test program description',
   status: ProgramStatusEnum.Published,
-  startedAt: 1704067200,
-  endedAt: 1735646400,
+  startedAt: '2024-01-01T00:00:00.000Z',
+  endedAt: '2024-12-31T00:00:00.000Z',
   userRole: 'admin',
 }
 

frontend/__tests__/a11y/components/RecentPullRequests.a11y.test.tsx

@@ -54,7 +54,7 @@ const minimalData = [
     title: 'Test Pull Request',
     url: 'https://github.com/test-org/test-repo/pull/1',
     state: 'open',
-    mergedAt: 1717329600,
+    mergedAt: new Date(1717329600 * 1000).toISOString(),
   },
 ]
 

frontend/__tests__/a11y/components/RecentRelease.a11y.test.tsx

@@ -3,10 +3,13 @@ import { axe } from 'jest-axe'
 import { Release } from 'types/release'
 import RecentReleases from 'components/RecentReleases'
 
+const publishedAtIso = new Date(Date.now()).toISOString()
+
 const mockReleases: Release[] = [
   {
+    id: 'release-a11y-1',
     name: 'v1.0 The First Release',
-    publishedAt: Date.now(),
+    publishedAt: publishedAtIso,
     repositoryName: 'our-awesome-project',
     organizationName: 'our-org',
     tagName: 'v1.0',
@@ -25,8 +28,9 @@ const mockReleases: Release[] = [
     },
   },
   {
+    id: 'release-a11y-2',
     name: 'v2.0 The Second Release',
-    publishedAt: Date.now(),
+    publishedAt: publishedAtIso,
     repositoryName: 'another-cool-project',
     organizationName: 'our-org',
     tagName: 'v2.0',

frontend/__tests__/a11y/components/RecentReleases.a11y.test.tsx

@@ -9,7 +9,7 @@ const mockReleases: ReleaseType[] = [
     id: '1',
     name: 'v1.0.0',
     tagName: 'v1.0.0',
-    publishedAt: Date.now(),
+    publishedAt: new Date(Date.now()).toISOString(),
     repositoryName: 'test-repo',
     organizationName: 'test-org',
     isPreRelease: false,
@@ -19,7 +19,7 @@ const mockReleases: ReleaseType[] = [
       avatarUrl: 'https://example.com/avatar.png',
       key: 'testuser',
       contributionsCount: 10,
-      createdAt: 0,
+      createdAt: '1970-01-01T00:00:00.000Z',
       followersCount: 5,
       followingCount: 3,
       publicRepositoriesCount: 8,

frontend/__tests__/a11y/components/Release.a11y.test.tsx

@@ -5,8 +5,9 @@ import type { Release as ReleaseType } from 'types/release'
 import Release from 'components/Release'
 
 const release: ReleaseType = {
+  id: 'release-a11y-single',
   name: 'v1.0 The First Release',
-  publishedAt: Date.now(),
+  publishedAt: new Date(Date.now()).toISOString(),
   repositoryName: 'our-awesome-project',
   organizationName: 'our-org',
   tagName: 'v1.0',

frontend/__tests__/a11y/components/RepositoryCard.a11y.test.tsx

@@ -11,20 +11,20 @@
   key: `repo-${index}`,
   name: `Repository ${index}`,
   openIssuesCount: 3 + index,
   organization: {
     login: `org-${index}`,
     name: `Organization ${index}`,
     key: `org-${index}`,
     url: `https://github.com/org-${index}`,
     avatarUrl: `https://github.com/org-${index}.png`,
     description: `Organization ${index} description`,
     objectID: `org-${index}`,
     collaboratorsCount: 10,
     followersCount: 50,
     publicRepositoriesCount: 20,
-    createdAt: Date.now(),
-    updatedAt: Date.now(),
-  } as Organization,
+    createdAt: new Date(Date.now()).toISOString(),
+    updatedAt: new Date(Date.now()).toISOString(),
+  } as unknown as Organization,
   starsCount: 100 + index,
   subscribersCount: 20 + index,
   url: `https://github.com/org-${index}/repo-${index}`,

frontend/__tests__/a11y/components/SingleModuleCard.a11y.test.tsx

@@ -58,7 +58,7 @@ const mockModule: Module = {
     },
   ],
   startedAt: 1704067200,
-  endedAt: 1735689599,
+  endedAt: new Date(1735689599 * 1000).toISOString(),
   domains: ['frontend', 'backend'],
   tags: ['react', 'nodejs'],
   labels: ['good first issue', 'bug'],

frontend/__tests__/a11y/components/ToggleableList.a11y.test.tsx

@@ -13,7 +13,9 @@ describe.each([
   })
   it('should not have any accessibility violations', async () => {
     const mockItems = Array.from({ length: 15 }, (_, i) => `Item ${i + 1}`)
-    const { container } = render(<ToggleableList items={mockItems} label="test-label" />)
+    const { container } = render(
+      <ToggleableList entityKey="toggle-a11y" items={mockItems} label="test-label" />
+    )
 
     const results = await axe(container)
 

frontend/__tests__/tsconfig.json

@@ -0,0 +1,14 @@
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    // Do not emit a .tsbuildinfo.
+    "incremental": false,
+    "isolatedModules": true,
+    "noEmit": true,
+    // Tightening would require typed mocks across many a11y files.
+    "strict": false,
+    "types": ["jest", "node"]
+  },
+  "exclude": ["e2e", "node_modules"],
+  "include": ["**/*.ts", "**/*.tsx", "../jest.config.ts"]
+}

frontend/__tests__/unit/components/CardDetailsPage.test.tsx

@@ -698,7 +698,7 @@
   const mockUser = {
     avatarUrl: 'https://example.com/avatar.jpg',
     contributionsCount: 100,
-    createdAt: Date.now() - 31536000000,
+    createdAt: new Date(Date.now() - 31536000000).toISOString(),
     followersCount: 50,
     followingCount: 25,
     key: 'test-user',
@@ -711,7 +711,7 @@
   const mockRecentIssues = [
     {
       author: mockUser,
-      createdAt: Date.now() - 86400000,
+      createdAt: new Date(Date.now() - 86400000).toISOString(),
       hint: 'Bug fix needed',
       labels: ['bug', 'high-priority'],
       number: '123',
@@ -720,7 +720,7 @@
       projectUrl: 'https://github.com/test/project',
       body: 'Issue summary',
       title: 'Test Issue',
-      updatedAt: Date.now(),
+      updatedAt: new Date(Date.now()).toISOString(),
       url: 'https://github.com/test/project/issues/123',
       objectID: 'issue-123',
     },
@@ -759,7 +759,7 @@
       author: mockUser,
       isPreRelease: false,
       name: 'v1.0.0',
-      publishedAt: Date.now() - 604800000,
+      publishedAt: new Date(Date.now() - 604800000).toISOString(),
       repositoryName: 'test-repo',
       tagName: 'v1.0.0',
       url: 'https://github.com/test/repo/releases/tag/v1.0.0',
@@ -768,7 +768,7 @@
 
   const mockChapterGeoData = [
     {
-      createdAt: Date.now() - 31536000000,
+      createdAt: new Date(Date.now() - 31536000000).toISOString(),
       isActive: true,
       key: 'test-chapter',
       leaders: ['John Doe', 'Jane Smith'],
@@ -779,7 +779,7 @@
       suggestedLocation: 'New York, NY',
       summary: 'Test chapter summary',
       topContributors: mockContributors,
-      updatedAt: Date.now(),
+      updatedAt: new Date(Date.now()).toISOString(),
       url: 'https://owasp.org/test-chapter',
       _geoloc: { lat: 40.7128, lng: -74.006 },
     },
@@ -964,7 +964,7 @@
         <CardDetailsPage
           {...defaultProps}
           type="module"
           pullRequests={mockPullRequests as unknown as PullRequest[]}
         />
       )
 
@@ -993,7 +993,7 @@
         <CardDetailsPage
           {...defaultProps}
           type="module"
           pullRequests={mockPullRequests as unknown as PullRequest[]}
           onLoadMorePullRequests={jest.fn()}
         />
       )
@@ -1005,7 +1005,7 @@
         <CardDetailsPage
           {...defaultProps}
           type="module"
           pullRequests={mockPullRequests as unknown as PullRequest[]}
           onResetPullRequests={jest.fn()}
           onLoadMorePullRequests={undefined}
         />
@@ -1018,7 +1018,7 @@
         <CardDetailsPage
           {...defaultProps}
           type="module"
           pullRequests={mockPullRequests as unknown as PullRequest[]}
           onLoadMorePullRequests={jest.fn()}
           onResetPullRequests={jest.fn()}
           isFetchingMore={true}
@@ -1671,7 +1671,7 @@
     it('renders Leaders with Unknown when value is null', () => {
       const propsWithNullLeader = {
         ...defaultProps,
-        type: 'chapter',
+        type: 'chapter' as const,
         details: [{ label: 'Leaders', value: null }],
       }
       render(<CardDetailsPage {...propsWithNullLeader} />)
@@ -2269,7 +2269,7 @@
       const moduleProps: DetailsCardProps = {
         ...defaultProps,
         type: 'module' as const,
         pullRequests: manyPRs as unknown as PullRequest[],
       }
 
       render(<CardDetailsPage {...moduleProps} />)
@@ -2290,7 +2290,7 @@
       const moduleProps: DetailsCardProps = {
         ...defaultProps,
         type: 'module' as const,
         pullRequests: manyPRs as unknown as PullRequest[],
       }
 
       render(<CardDetailsPage {...moduleProps} />)
@@ -2309,7 +2309,7 @@
       const moduleProps: DetailsCardProps = {
         ...defaultProps,
         type: 'module' as const,
         pullRequests: manyPRs as unknown as PullRequest[],
       }
 
       render(<CardDetailsPage {...moduleProps} />)
@@ -2328,7 +2328,7 @@
       const moduleProps: DetailsCardProps = {
         ...defaultProps,
         type: 'module' as const,
         pullRequests: fewPRs as unknown as PullRequest[],
       }
 
       render(<CardDetailsPage {...moduleProps} />)
@@ -2735,7 +2735,7 @@
       const singleModuleProps: DetailsCardProps = {
         ...defaultProps,
         type: 'program' as const,
         modules: [mockModules![0]],
       }
 
       render(<CardDetailsPage {...singleModuleProps} />)

frontend/__tests__/unit/components/HealthMetrics.test.tsx

@@ -150,7 +150,6 @@ describe('HealthMetrics', () => {
           projectKey: 'null-project',
         },
       ]
-      // @ts-expect-error - testing specific edge case with mocked data
       render(<HealthMetrics data={nullData} />)
 
       const lineCharts = screen.getAllByTestId('LineChart')

frontend/__tests__/unit/components/ItemCardList.test.tsx

@@ -630,7 +630,7 @@ describe('ItemCardList Component', () => {
 
     it('renders custom renderDetails content', () => {
       const customRenderDetails = (item: {
-        createdAt: number
+        createdAt: string
         commentsCount: number
         organizationName: string
         publishedAt: number

frontend/__tests__/unit/components/RecentRelease.test.tsx

@@ -64,7 +64,7 @@ jest.mock('next/image', () => ({
   },
 }))
 
-const now = Date.now()
+const now = new Date(Date.now()).toISOString()
 const mockReleases: Release[] = [
   {
     id: 'release-recent-1',

frontend/__tests__/unit/components/Release.test.tsx

@@ -68,7 +68,7 @@ jest.mock('next/image', () => ({
   },
 }))
 
-const now = Date.now()
+const now = new Date(Date.now()).toISOString()
 const mockReleases: ReleaseType[] = [
   {
     id: 'release-test-1',

frontend/__tests__/unit/components/RepositoryCard.test.tsx

@@ -54,20 +54,20 @@
     key: `repo-${index}`,
     name: `Repository ${index}`,
     openIssuesCount: 3 + index,
     organization: {
       login: `org-${index}`,
       name: `Organization ${index}`,
       key: `org-${index}`,
       url: `https://github.com/org-${index}`,
       avatarUrl: `https://github.com/org-${index}.png`,
       description: `Organization ${index} description`,
       objectID: `org-${index}`,
       collaboratorsCount: 10,
       followersCount: 50,
       publicRepositoriesCount: 20,
-      createdAt: Date.now(),
-      updatedAt: Date.now(),
-    } as Organization,
+      createdAt: new Date(Date.now()).toISOString(),
+      updatedAt: new Date(Date.now()).toISOString(),
+    } as unknown as Organization,
     starsCount: 100 + index,
     subscribersCount: 20 + index,
     url: `https://github.com/org-${index}/repo-${index}`,

frontend/__tests__/unit/components/SingleModuleCard.test.tsx

@@ -111,7 +111,7 @@ const mockModule: Module = {
     },
   ],
   startedAt: 1704067200,
-  endedAt: 1735689599,
+  endedAt: new Date(1735689599 * 1000).toISOString(),
   domains: ['frontend', 'backend'],
   tags: ['react', 'nodejs'],
   labels: ['good first issue', 'bug'],

frontend/__tests__/unit/components/SnapshotCard.test.tsx

@@ -50,11 +50,11 @@ describe('SnapshotCard', () => {
   })
 
   it('handles missing startAt or endAt (conditional rendering) - timezone safe', () => {
-    const { rerender } = render(<SnapshotCard {...defaultProps} startAt={0} />)
+    const { rerender } = render(<SnapshotCard {...defaultProps} startAt={0 as unknown as string} />)
     const onlyEnd = formatDate(defaultProps.endAt)
     expect(screen.getByText(new RegExp(onlyEnd))).toBeInTheDocument()
 
-    rerender(<SnapshotCard {...defaultProps} endAt={0} />)
+    rerender(<SnapshotCard {...defaultProps} endAt={0 as unknown as string} />)
     const onlyStart = formatDate(defaultProps.startAt)
     expect(screen.getByText(new RegExp(onlyStart))).toBeInTheDocument()
   })

frontend/__tests__/unit/utils/getIcsFileUrl.test.ts

@@ -40,6 +40,7 @@ describe('getIcsFileUrl', () => {
     ;(createEvent as jest.Mock).mockImplementation((attr, cb) => cb(null, 'val'))
 
     const eventWithTimestamps = {
+      title: 'Multi-day',
       startDate: '2025-01-01T00:00:00Z',
       endDate: '2025-01-03T00:00:00Z',
     }
@@ -59,6 +60,7 @@ describe('getIcsFileUrl', () => {
     ;(createEvent as jest.Mock).mockImplementation((attr, cb) => cb(null, 'val'))
 
     const eventWithTimestamps = {
+      title: 'Multi-day UTC',
       startDate: '2025-01-01T00:00:00Z',
       endDate: '2025-01-03T00:00:00Z',
     }
@@ -78,6 +80,7 @@ describe('getIcsFileUrl', () => {
     ;(createEvent as jest.Mock).mockImplementation((attr, cb) => cb(null, 'val'))
 
     const singleDayEvent = {
+      title: 'Single day',
       startDate: '2025-01-01T00:00:00Z',
       endDate: '2025-01-01T00:00:00Z',
     }