Skip to content

Commit 57b05f3

Browse files
mirnumaanDishant1804arkid15rkasya
authored
Add aria-labels to interactive elements for WCAG 2.1 compliance (#2657)
* add the aria-label * fixed the code style, fixed by the formatter * Handled the undefined repositoryName in aria-label. * fix the white spaces * Add aria-labels to interactive elements for WCAG 2.1 compliance * Sync www-repopsitories (#2164) * spelling fixes and tests * sonar and code rabbit suggestions implemented * json chunking and suggestions implemented * code rabbit and sonar qube suggestions * code rabbit suggestions * suggestions implemented * github advance security addressed * tests fixed * fixed tests * Clean up backend/test_commands.py --------- Co-authored-by: Arkadii Yakovets <[email protected]> Co-authored-by: Arkadii Yakovets <[email protected]> * Update docker-compose/local.yaml * Nestbot MVP (#2113) * Sync www-repopsitories (#2164) * spelling fixes and tests * sonar and code rabbit suggestions implemented * json chunking and suggestions implemented * code rabbit and sonar qube suggestions * code rabbit suggestions * suggestions implemented * github advance security addressed * tests fixed * fixed tests * Clean up backend/test_commands.py --------- Co-authored-by: Arkadii Yakovets <[email protected]> Co-authored-by: Arkadii Yakovets <[email protected]> * Consolidate code commits * Update cspell/custom-dict.txt * Update docker-compose/local.yaml * local yaml worder volume fix * instance check * poetry file updated --------- Co-authored-by: Arkadii Yakovets <[email protected]> Co-authored-by: Arkadii Yakovets <[email protected]> * fixed the duplication error for chunks and context (#2343) * Fix slack and duplication errors (#2352) * fix slack and duplication errors * code rabbit suggestions * integrity error solved * using set * Update code --------- Co-authored-by: Arkadii Yakovets <[email protected]> * Response improvements and refactoring (#2407) * improvements and refactoring * added prompt checks and tests for it * question detection refining (#2443) * question detection refining * sonar qube fixes * fix tests * Agentic rag (#2432) * agentic rag * spelling fixes * code rabbit and sonar qube suggestions * code rabbit suggestions * refining * fix test * refining * added question detectoor to nestbot mentions (#2473) * Merge NestBot AI Assistant feature branch * Update docker-compose/local.yaml * Update backend/Makefile * fix the white spaces * Add aria-labels to interactive elements for WCAG 2.1 compliance * Fix equality checks with floating point values (#2658) * Edit in test cases for the new aira-label update * More edits to make the test more unbreakable and few regex edits . * Revert one change regards two seperate Contributors * Regex check fix * Global 10-second timeout and increased other mobile timeout to fix the Mobile Safari flaky tests --------- Co-authored-by: Dishant Miyani <[email protected]> Co-authored-by: Arkadii Yakovets <[email protected]> Co-authored-by: Arkadii Yakovets <[email protected]> Co-authored-by: Kate Golovanova <[email protected]>
1 parent c228b80 commit 57b05f3

22 files changed

+83
-47
lines changed

‎frontend/__tests__/e2e/pages/About.spec.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ test.describe('About Page', () => {
3636

3737
test('renders main sections correctly', async ({ page }) => {
3838
await expect(page.getByRole('heading', { name: 'About' })).toBeVisible()
39-
await expect(page.getByRole('heading', { name: 'Project Timeline', exact: true })).toBeVisible()
39+
await expect(page.getByRole('heading', { name: 'Project Timeline' })).toBeVisible()
4040
await expect(page.getByRole('heading', { name: 'Our Story' })).toBeVisible()
4141
await expect(page.getByRole('heading', { name: 'Leaders' })).toBeVisible()
4242
await expect(page.getByRole('heading', { name: 'Roadmap' })).toBeVisible()

‎frontend/__tests__/e2e/pages/Chapters.spec.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ test.describe('Chapters Page', () => {
2525
})
2626

2727
test('renders chapter data correctly', async ({ page }) => {
28-
await expect(page.getByRole('link', { name: 'Chapter 1' })).toBeVisible()
28+
await expect(page.getByRole('link', { name: 'Chapter 1' })).toBeVisible({ timeout: 10000 })
2929
await expect(page.getByText('This is a summary of Chapter')).toBeVisible()
3030
await expect(page.getByRole('link', { name: "Isanori Sakanashi's avatar" })).toBeVisible()
3131
await expect(page.getByRole('button', { name: 'View Details' })).toBeVisible()

‎frontend/__tests__/e2e/pages/Contribute.spec.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ test.describe('Contribute Page', () => {
2525
})
2626

2727
test('renders issue data correctly', async ({ page }) => {
28-
await expect(page.getByRole('link', { name: 'Contribution 1' })).toBeVisible()
28+
await expect(page.getByRole('link', { name: 'Contribution 1' })).toBeVisible({ timeout: 10000 })
2929
await expect(page.getByText('4 months ago')).toBeVisible()
3030
await expect(page.getByRole('link', { name: 'Owasp Nest', exact: true })).toBeVisible()
3131
await expect(page.getByText('This is a summary of Contribution 1')).toBeVisible()

‎frontend/__tests__/e2e/pages/Home.spec.ts‎

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -48,10 +48,12 @@ test.describe('Home Page', () => {
4848
})
4949

5050
test('should have posts', async ({ page }) => {
51-
await expect(page.getByRole('heading', { name: 'News & Opinions' })).toBeVisible()
51+
await expect(page.getByRole('heading', { name: 'News & Opinions' })).toBeVisible({
52+
timeout: 10000,
53+
})
5254
await expect(page.getByRole('link', { name: 'Post 1', exact: true })).toBeVisible()
5355
await expect(page.getByText('Author 1')).toBeVisible()
54-
await expect(page.getByText('Mar 6, 2025').first()).toBeVisible({ timeout: 10000 })
56+
await expect(page.getByText('Mar 6, 2025').first()).toBeVisible()
5557
await page.getByRole('link', { name: 'Post 1' }).click()
5658
})
5759

@@ -93,7 +95,9 @@ test.describe('Home Page', () => {
9395
})
9496

9597
test('should have upcoming events', async ({ page }) => {
96-
await expect(page.getByRole('heading', { name: 'Upcoming Events' })).toBeVisible()
98+
await expect(page.getByRole('heading', { name: 'Upcoming Events' })).toBeVisible({
99+
timeout: 10000,
100+
})
97101
await expect(page.getByRole('button', { name: 'Event 1' })).toBeVisible()
98102
await expect(page.getByText('Apr 5 — 6, 2025')).toBeVisible()
99103
await page.getByRole('button', { name: 'Event 1' }).click()

‎frontend/__tests__/e2e/pages/OrganizationDetails.spec.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,9 @@ test.describe('Organization Details Page', () => {
4545
})
4646

4747
test('should have organization recent milestones', async ({ page }) => {
48-
await expect(page.getByRole('heading', { name: 'Recent Milestones' })).toBeVisible()
48+
await expect(page.getByRole('heading', { name: 'Recent Milestones' })).toBeVisible({
49+
timeout: 10000,
50+
})
4951
await expect(page.getByRole('heading', { name: 'v2.0.0 Release' })).toBeVisible()
5052
await expect(page.getByText('Mar 1, 2025')).toBeVisible()
5153
await expect(page.getByText('Project Repo 1')).toBeVisible()

‎frontend/__tests__/e2e/pages/ProjectsHealthDashboardMetrics.spec.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ test.describe('Projects Health Dashboard Metrics', () => {
2121
await mockDashboardCookies(page, mockHealthMetricsData, true)
2222
await page.goto('/projects/dashboard/metrics')
2323
const firstMetric = mockHealthMetricsData.projectHealthMetrics[0]
24-
await expect(page.getByText(firstMetric.projectName)).toBeVisible()
24+
await expect(page.getByText(firstMetric.projectName)).toBeVisible({ timeout: 10000 })
2525
await expect(page.getByText(firstMetric.starsCount.toString())).toBeVisible()
2626
await expect(page.getByText(firstMetric.forksCount.toString())).toBeVisible()
2727
await expect(page.getByText(firstMetric.contributorsCount.toString())).toBeVisible()

‎frontend/__tests__/e2e/pages/Users.spec.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ test.describe('Users Page', () => {
4141
})
4242

4343
test('handles page change correctly', async ({ page }) => {
44-
const nextPageButton = await page.getByRole('button', { name: '2', exact: true })
44+
const nextPageButton = await page.getByRole('button', { name: 'Go to page 2' })
4545
await nextPageButton.waitFor({ state: 'visible' })
4646
await nextPageButton.click()
4747
await expect(page).toHaveURL(/page=2/)

‎frontend/__tests__/unit/components/ModuleList.test.tsx‎

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -186,14 +186,16 @@ describe('ModuleList', () => {
186186

187187
describe('Module Text Truncation', () => {
188188
it('truncates module names longer than 50 characters', () => {
189-
const longModuleName = 'A'.repeat(60) // 60 characters
190-
const modules = [longModuleName, 'Short Module']
189+
const longModuleName =
190+
'This is a very long module name that exceeds fifty characters and should be truncated'
191+
const modules = [longModuleName]
191192

192193
render(<ModuleList modules={modules} />)
193194

194-
const expectedTruncated = 'A'.repeat(50) + '...'
195-
expect(screen.getByText(expectedTruncated)).toBeInTheDocument()
196-
expect(screen.queryByText(longModuleName)).not.toBeInTheDocument()
195+
const truncatedButton = screen.getByRole('button', {
196+
name: `Module: ${longModuleName}`,
197+
})
198+
expect(truncatedButton).toHaveAttribute('title', longModuleName)
197199
})
198200

199201
it('does not truncate module names 50 characters or shorter', () => {
@@ -225,7 +227,7 @@ describe('ModuleList', () => {
225227

226228
render(<ModuleList modules={modules} />)
227229

228-
const button = screen.getByRole('button', { name: shortModuleName })
230+
const button = screen.getByRole('button', { name: `Module: ${shortModuleName}` })
229231
expect(button).not.toHaveAttribute('title')
230232
})
231233
})
@@ -235,7 +237,7 @@ describe('ModuleList', () => {
235237
const modules = ['Test Module']
236238
render(<ModuleList modules={modules} />)
237239

238-
const button = screen.getByRole('button', { name: 'Test Module' })
240+
const button = screen.getByRole('button', { name: 'Module: Test Module' })
239241
expect(button).toHaveClass(
240242
'rounded-lg',
241243
'border',
@@ -257,7 +259,7 @@ describe('ModuleList', () => {
257259
const modules = ['Test Module']
258260
render(<ModuleList modules={modules} />)
259261

260-
const button = screen.getByRole('button', { name: 'Test Module' })
262+
const button = screen.getByRole('button', { name: 'Module: Test Module' })
261263
expect(button).toHaveAttribute('type', 'button')
262264
})
263265

‎frontend/__tests__/unit/components/Pagination.test.tsx‎

Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -41,40 +41,40 @@ describe('<Pagination />', () => {
4141
renderComponent({ currentPage: 2, totalPages: 4 })
4242

4343
// Prev / Next
44-
const prev = screen.getByRole('button', { name: 'Prev' })
45-
const next = screen.getByRole('button', { name: 'Next' })
44+
const prev = screen.getByRole('button', { name: 'Go to previous page' })
45+
const next = screen.getByRole('button', { name: 'Go to next page' })
4646

4747
expect(prev).toBeEnabled()
4848
expect(next).toBeEnabled()
4949

5050
// Pages 1–4
5151
for (let n = 1; n <= 4; n++) {
52-
expect(screen.getByRole('button', { name: String(n) })).toBeInTheDocument()
52+
expect(screen.getByRole('button', { name: `Go to page ${n}` })).toBeInTheDocument()
5353
}
5454
})
5555

5656
it('disables Prev on first page', () => {
5757
const { container } = renderComponent({ currentPage: 1, totalPages: 3 })
58-
const prevBtn = within(container).getByRole('button', { name: 'Prev' })
58+
const prevBtn = within(container).getByRole('button', { name: 'Go to previous page' })
5959
expect(prevBtn).toBeDisabled()
6060
})
6161

6262
it('disables Next on last page', () => {
6363
const { container } = renderComponent({ currentPage: 3, totalPages: 3 })
64-
const nextBtn = within(container).getByRole('button', { name: 'Next' })
64+
const nextBtn = within(container).getByRole('button', { name: 'Go to next page' })
6565
expect(nextBtn).toBeDisabled()
6666
})
6767

6868
it('calls onPageChange with correct page number on button clicks', () => {
6969
renderComponent({ currentPage: 2, totalPages: 5 })
7070

71-
fireEvent.click(screen.getByRole('button', { name: 'Prev' }))
71+
fireEvent.click(screen.getByRole('button', { name: 'Go to previous page' }))
7272
expect(onPageChange).toHaveBeenCalledWith(1)
7373

74-
fireEvent.click(screen.getByRole('button', { name: 'Next' }))
74+
fireEvent.click(screen.getByRole('button', { name: 'Go to next page' }))
7575
expect(onPageChange).toHaveBeenCalledWith(3)
7676

77-
fireEvent.click(screen.getByRole('button', { name: '4' }))
77+
fireEvent.click(screen.getByRole('button', { name: 'Go to page 4' }))
7878
expect(onPageChange).toHaveBeenCalledWith(4)
7979
})
8080

@@ -83,26 +83,26 @@ describe('<Pagination />', () => {
8383

8484
// Should show first 3 pages
8585
for (const n of [1, 2, 3]) {
86-
expect(screen.getByRole('button', { name: String(n) })).toBeInTheDocument()
86+
expect(screen.getByRole('button', { name: `Go to page ${n}` })).toBeInTheDocument()
8787
}
8888

89-
// Should show exactly two “More pages” indicators
89+
// Should show exactly two "More pages" indicators
9090
const ellipses = screen.getAllByLabelText('More pages')
9191
expect(ellipses).toHaveLength(2)
9292

9393
// Should show pages around currentPage: 9, 10, 11
9494
for (const n of [9, 10, 11]) {
95-
expect(screen.getByRole('button', { name: String(n) })).toBeInTheDocument()
95+
expect(screen.getByRole('button', { name: `Go to page ${n}` })).toBeInTheDocument()
9696
}
9797

9898
// Last page
99-
expect(screen.getByRole('button', { name: '20' })).toBeInTheDocument()
99+
expect(screen.getByRole('button', { name: 'Go to page 20' })).toBeInTheDocument()
100100
})
101101

102102
it('applies active styles and aria-current on the selected page', () => {
103103
renderComponent({ currentPage: 3, totalPages: 5 })
104104

105-
const activeBtn = screen.getByRole('button', { name: '3' })
105+
const activeBtn = screen.getByRole('button', { name: 'Go to page 3' })
106106
// check for class used in active state
107107
expect(activeBtn).toHaveClass('bg-[#83a6cc]')
108108
// accessibility: mark current page
@@ -113,25 +113,25 @@ describe('<Pagination />', () => {
113113
// No overrides → currentPage=1, totalPages=5, isLoaded=true
114114
renderComponent()
115115

116-
expect(screen.getByRole('button', { name: 'Prev' })).toBeDisabled()
117-
expect(screen.getByRole('button', { name: 'Next' })).toBeEnabled()
118-
expect(screen.getByRole('button', { name: '5' })).toBeInTheDocument()
116+
expect(screen.getByRole('button', { name: 'Go to previous page' })).toBeDisabled()
117+
expect(screen.getByRole('button', { name: 'Go to next page' })).toBeEnabled()
118+
expect(screen.getByRole('button', { name: 'Go to page 5' })).toBeInTheDocument()
119119
})
120120

121121
// Edge-case: currentPage near the start of a large set
122122
it('shows correct pages when currentPage = 4 of 10', () => {
123123
renderComponent({ currentPage: 4, totalPages: 10 })
124124
// Should show 1,2,3,4,5 then ellipsis and 10
125125
for (const n of [1, 2, 3, 4, 5]) {
126-
expect(screen.getByRole('button', { name: String(n) })).toBeInTheDocument()
126+
expect(screen.getByRole('button', { name: `Go to page ${n}` })).toBeInTheDocument()
127127
}
128128

129-
expect(screen.getByRole('button', { name: '10' })).toBeInTheDocument()
129+
expect(screen.getByRole('button', { name: 'Go to page 10' })).toBeInTheDocument()
130130
})
131131

132132
// Edge-case: very small totalPages (2)
133133
it('renders exactly pages [1, 2] when totalPages = 2', () => {
134134
renderComponent({ totalPages: 2, currentPage: 2 })
135-
expect(screen.getAllByRole('button', { name: /^(1|2)$/ })).toHaveLength(2)
135+
expect(screen.getAllByRole('button', { name: /^Go to page (1|2)$/ })).toHaveLength(2)
136136
})
137137
})

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -294,7 +294,7 @@ describe('About Component', () => {
294294
render(<About />)
295295
})
296296

297-
const roadmapSection = screen.getByRole('heading', { name: 'Roadmap' }).closest('div')
297+
const roadmapSection = screen.getByRole('heading', { name: /Roadmap/ }).closest('div')
298298
expect(roadmapSection).toBeInTheDocument()
299299
const roadmapData = mockAboutData.project.recentMilestones
300300
const links = within(roadmapSection)

0 commit comments

Comments
 (0)