DMC/studentportalen
1
1
Fork 0
Code Issues 50 Pull Requests Actions Projects 1 Wiki Activity

Combobox - Screen reader accessibility #53

New Issue
Open
opened 2025-12-16 13:22:26 +01:00 by jare2473 · 0 comments
jare2473 commented 2025-12-16 13:22:26 +01:00
Owner
Copy Link

This a combobox that works good when using a screen reader (tested using VoiceOver on mac):
https://designsystem.digital.gov/components/combo-box/

What to fix

I have identified four issues, presented below in screenshots. Each screenshot contains an example from the accessible combobox linked above, alongside how our combobox work.

Note: On these screenshots, the gray box displays what the screen reader (VoiceOver) reads out loud.

Feedback: "Focusing" on the combo box

Frame 1.jpg

Feedback: Number of results when typing

Frame 2.jpg

Feedback: No results found

Frame 3.jpg

Feedback: Current selection in list

Frame 4.jpg

This a combobox that works good when using a screen reader (tested using VoiceOver on mac): https://designsystem.digital.gov/components/combo-box/ --- ## What to fix I have identified four issues, presented below in screenshots. Each screenshot contains an example from the accessible combobox linked above, alongside how our combobox work. Note: On these screenshots, the gray box displays what the screen reader (VoiceOver) reads out loud. ### Feedback: "Focusing" on the combo box ![Frame 1.jpg](/attachments/142cadf6-c211-47c4-901f-388603519bc0) --- ### Feedback: Number of results when typing ![Frame 2.jpg](/attachments/80b94ab1-5566-4b42-aafe-16042dd57c0e) --- ### Feedback: No results found ![Frame 3.jpg](/attachments/8595da4b-bed1-44c6-bb9c-c8c0c870af4f) --- ### Feedback: Current selection in list ![Frame 4.jpg](/attachments/5d230793-b5fe-4c5c-94d0-bfa7a43a3f36)
Frame 1.jpg
209 KiB
Frame 2.jpg
194 KiB
Frame 3.jpg
164 KiB
Frame 4.jpg
267 KiB
jare2473 added the
Front end
 label 2025-12-16 14:10:07 +01:00
jare2473 added this to the Design -> Front end project 2025-12-16 14:12:57 +01:00
jare2473 added this to the Misc. design system stuff milestone 2025-12-16 14:13:06 +01:00
jare2473 changed title from Combobox - Improve Screen reader accessibility to Combobox - Screen reader accessibility 2025-12-16 14:13:30 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2025-12-17 14:00:11 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2025-12-22 10:22:22 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2025-12-22 10:59:03 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2025-12-22 11:01:26 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2025-12-22 12:43:52 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2025-12-29 12:03:08 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2025-12-30 11:27:18 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2025-12-30 11:27:24 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-07 11:30:31 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-08 10:30:05 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-08 13:36:28 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-08 14:14:39 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-08 14:20:00 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-08 14:29:31 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-08 15:17:02 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-08 15:19:29 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-09 09:05:41 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-09 16:20:51 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-15 10:17:46 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-15 10:22:09 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-15 10:39:11 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-15 11:31:24 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-15 13:27:30 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-15 13:30:52 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-15 15:47:55 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-15 15:50:25 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-15 15:50:29 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-15 15:50:32 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-16 11:57:17 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-16 14:26:02 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-16 14:27:05 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-16 14:52:23 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-19 14:59:38 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-19 15:02:18 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-20 14:04:30 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-20 14:05:49 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-21 11:14:11 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-21 11:14:15 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-21 11:14:19 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-22 09:16:09 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-22 09:16:15 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-22 09:21:24 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-23 12:54:34 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-26 11:57:30 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-26 15:47:19 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-26 15:47:53 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-26 15:48:03 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-26 15:48:35 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-26 15:55:24 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-28 09:16:44 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-28 09:23:57 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-28 09:24:01 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-28 13:58:36 +01:00
jare2473 moved this to Ready for dev in Design -> Front end on 2026-01-28 15:10:11 +01:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
Code Review
Design
Component
Design
Page
Design Review
Design in progress
Design system
Front end
bug
Something is not working
duplicate
This issue or pull request already exists
enhancement
New feature
help wanted
Need some help
invalid
Something is wrong
priority
question
More information is needed
wontfix
This won't be fixed
No Label
Front end
Milestone
No items
No Milestone Misc. design system stuff
Projects
Clear projects
No project Design -> Front end
Assignees
Clear assignees
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: DMC/studentportalen#53
No description provided.
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?