Skip to content

Commit 61b0282

Browse files
committed
Fix tests
1 parent 0ca30dc commit 61b0282

File tree

2 files changed

+67
-23
lines changed

2 files changed

+67
-23
lines changed

frontend/__tests__/unit/pages/About.test.tsx

Lines changed: 59 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { addToast } from '@heroui/toast'
33
import { fireEvent, screen, waitFor, within } from '@testing-library/react'
44
import { mockAboutData } from '@unit/data/mockAboutData'
55
import { useRouter } from 'next/navigation'
6+
import { act } from 'react'
67
import { render } from 'wrappers/testUtil'
78
import About from 'app/about/page'
89
import { GET_PROJECT_METADATA, GET_TOP_CONTRIBUTORS } from 'server/queries/projectQueries'
@@ -138,7 +139,9 @@ describe('About Component', () => {
138139
})
139140

140141
test('renders project history correctly', async () => {
141-
render(<About />)
142+
await act(async () => {
143+
render(<About />)
144+
})
142145

143146
const historySection = screen.getByText('History').closest('div')
144147
expect(historySection).toBeInTheDocument()
@@ -152,7 +155,9 @@ describe('About Component', () => {
152155
})
153156

154157
test('renders leaders section with three leaders', async () => {
155-
render(<About />)
158+
await act(async () => {
159+
render(<About />)
160+
})
156161

157162
const leadersSection = screen.getByText('Leaders').closest('div')
158163
expect(leadersSection).toBeInTheDocument()
@@ -178,7 +183,9 @@ describe('About Component', () => {
178183
return { loading: true }
179184
})
180185

181-
render(<About />)
186+
await act(async () => {
187+
render(<About />)
188+
})
182189

183190
await waitFor(() => {
184191
expect(screen.getByText("Error loading arkid15r's data")).toBeInTheDocument()
@@ -188,7 +195,9 @@ describe('About Component', () => {
188195
})
189196

190197
test('renders top contributors section correctly', async () => {
191-
render(<About />)
198+
await act(async () => {
199+
render(<About />)
200+
})
192201

193202
await waitFor(() => {
194203
expect(screen.getByText('Top Contributors')).toBeInTheDocument()
@@ -199,7 +208,9 @@ describe('About Component', () => {
199208
})
200209

201210
test('toggles contributors list when show more/less is clicked', async () => {
202-
render(<About />)
211+
await act(async () => {
212+
render(<About />)
213+
})
203214
await waitFor(() => {
204215
expect(screen.getByText('Contributor 6')).toBeInTheDocument()
205216
expect(screen.queryByText('Contributor 10')).not.toBeInTheDocument()
@@ -222,7 +233,9 @@ describe('About Component', () => {
222233
})
223234

224235
test('renders technologies section correctly', async () => {
225-
render(<About />)
236+
await act(async () => {
237+
render(<About />)
238+
})
226239

227240
const technologiesSection = screen.getByText('Technologies & Tools').closest('div')
228241
expect(technologiesSection).toBeInTheDocument()
@@ -256,7 +269,9 @@ describe('About Component', () => {
256269
})
257270

258271
test('renders roadmap correctly', async () => {
259-
render(<About />)
272+
await act(async () => {
273+
render(<About />)
274+
})
260275

261276
const roadmapSection = screen.getByRole('heading', { name: 'Roadmap' }).closest('div')
262277
expect(roadmapSection).toBeInTheDocument()
@@ -266,15 +281,17 @@ describe('About Component', () => {
266281
.filter((link) => link.getAttribute('href') !== '#roadmap')
267282

268283
for (let i = 0; i < roadmapData.length; i++) {
269-
const milestone = roadmapData[i]
284+
const milestone = [...roadmapData].sort((a, b) => (a.title > b.title ? 1 : -1))[i]
270285
expect(screen.getByText(milestone.title)).toBeInTheDocument()
271286
expect(screen.getByText(milestone.body)).toBeInTheDocument()
272287
expect(links[i].getAttribute('href')).toBe(milestone.url)
273288
}
274289
})
275290

276291
test('renders project stats cards correctly', async () => {
277-
render(<About />)
292+
await act(async () => {
293+
render(<About />)
294+
})
278295

279296
await waitFor(() => {
280297
expect(screen.getByText('Contributors')).toBeInTheDocument()
@@ -298,7 +315,9 @@ describe('About Component', () => {
298315
return { loading: true }
299316
})
300317

301-
render(<About />)
318+
await act(async () => {
319+
render(<About />)
320+
})
302321

303322
await waitFor(() => {
304323
expect(screen.getByText('Loading arkid15r...')).toBeInTheDocument()
@@ -327,7 +346,9 @@ describe('About Component', () => {
327346
return { loading: true }
328347
})
329348

330-
render(<About />)
349+
await act(async () => {
350+
render(<About />)
351+
})
331352

332353
await waitFor(() => {
333354
expect(screen.getByText('No data available for arkid15r')).toBeInTheDocument()
@@ -352,7 +373,9 @@ describe('About Component', () => {
352373
return { loading: true }
353374
})
354375

355-
render(<About />)
376+
await act(async () => {
377+
render(<About />)
378+
})
356379

357380
await waitFor(() => {
358381
expect(screen.getByText('Data not found')).toBeInTheDocument()
@@ -374,7 +397,9 @@ describe('About Component', () => {
374397
return { loading: true }
375398
})
376399

377-
render(<About />)
400+
await act(async () => {
401+
render(<About />)
402+
})
378403

379404
await waitFor(() => {
380405
expect(screen.getByText('No data available for arkid15r')).toBeInTheDocument()
@@ -384,7 +409,9 @@ describe('About Component', () => {
384409
})
385410

386411
test('navigates to user details on View Profile button click', async () => {
387-
render(<About />)
412+
await act(async () => {
413+
render(<About />)
414+
})
388415

389416
await waitFor(() => {
390417
const viewDetailsButtons = screen.getAllByText('View Profile')
@@ -420,7 +447,9 @@ describe('About Component', () => {
420447
return { loading: true }
421448
})
422449

423-
render(<About />)
450+
await act(async () => {
451+
render(<About />)
452+
})
424453

425454
await waitFor(() => {
426455
expect(screen.getByText('arkid15r')).toBeInTheDocument()
@@ -443,7 +472,9 @@ describe('About Component', () => {
443472
return { loading: true }
444473
})
445474

446-
render(<About />)
475+
await act(async () => {
476+
render(<About />)
477+
})
447478

448479
await waitFor(() => {
449480
expect(screen.getByText(/No data available for arkid15r/i)).toBeInTheDocument()
@@ -462,7 +493,9 @@ describe('About Component', () => {
462493
}
463494
})
464495

465-
render(<About />)
496+
await act(async () => {
497+
render(<About />)
498+
})
466499
await waitFor(() => {
467500
// Look for the element with alt text "Loading indicator"
468501
const spinner = screen.getAllByAltText('Loading indicator')
@@ -481,7 +514,9 @@ describe('About Component', () => {
481514
error: null,
482515
}
483516
})
484-
render(<About />)
517+
await act(async () => {
518+
render(<About />)
519+
})
485520
await waitFor(() => {
486521
expect(screen.getByText(/Data not found/)).toBeInTheDocument()
487522
expect(
@@ -501,7 +536,9 @@ describe('About Component', () => {
501536
error: null,
502537
}
503538
})
504-
render(<About />)
539+
await act(async () => {
540+
render(<About />)
541+
})
505542
await waitFor(() => {
506543
expect(addToast).toHaveBeenCalledWith({
507544
color: 'danger',
@@ -525,7 +562,9 @@ describe('About Component', () => {
525562
error: null,
526563
}
527564
})
528-
render(<About />)
565+
await act(async () => {
566+
render(<About />)
567+
})
529568
await waitFor(() => {
530569
expect(addToast).toHaveBeenCalledWith({
531570
color: 'danger',

frontend/src/app/about/page.tsx

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -169,11 +169,16 @@ const About = () => {
169169
.sort((a, b) => (a.title > b.title ? 1 : -1))
170170
.map((milestone, index) => (
171171
<div
172-
key={index}
172+
key={milestone.url || milestone.title || index}
173173
className="flex items-center gap-4 overflow-hidden rounded-lg bg-gray-200 p-6 dark:bg-gray-700"
174174
>
175175
<div className="flex-1">
176-
<Link href={milestone.url} target="_blank" className="inline-block">
176+
<Link
177+
href={milestone.url}
178+
target="_blank"
179+
rel="noopener noreferrer"
180+
className="inline-block"
181+
>
177182
<h3 className="mb-2 text-xl font-semibold text-blue-400">
178183
{milestone.title}
179184
<Tooltip
@@ -185,7 +190,7 @@ const About = () => {
185190
? 'In Progress'
186191
: 'Not Started'
187192
}
188-
id={`level-tooltip-progress`}
193+
id={`tooltip-state-${index}`}
189194
delay={100}
190195
placement="top"
191196
showArrow

0 commit comments

Comments
 (0)