No Code Attached Yet a11y a11y-audit-backlog a11y-priority-critical (Immediate)
avatar mbeganyi-a11y
mbeganyi-a11y
7 Sep 2026

Steps to reproduce the issue

NOTE: Accessibility backlog issue and work-in-progress. This issue has been opened to account for all the issues flagged in the initial Milestone 1a Audit Report. If this is a duplicate issue, it will be closed by the end of September 2026.

Milestone 1a finding ID M1a-010
Backlog priority Immediate
Severity — carried from Milestone 1a Critical
Implementation effort High
Target milestone(s) MS2a, MS2b, MS3a, MS3b, MS4, MS5a, MS5b, MS7a, MS7b, MS8a, MS9a, MS10
WCAG 2.2 success criterion 1.3.1 Info and Relationships; 1.4.1 Use of Color; 1.4.11 Non-text Contrast; 2.1.1 Keyboard; 4.1.2 Name, Role, Value; 4.1.3 Status Messages
Responsibility tag(s) from report Design, Development, Editorial
Affected Joomla area/component https://accessibility-project.joomla.org/results/Milestone-1a/milestone1/deliverable1/wcag-report#06fbccbe-a70a-404d-b6ef-782258b5c87d
Affected user journey(s) 06 – Media Manager (com_media)
Source report/reference Milestone 1a WCAG audit report
STF reporting reference To be assigned
Issue owner To be assigned
Status Triage

Audit finding

Media manager: Visual information is not conveyed programmatically, keyboard navigation is inconsistent, elements lack roles and states, names

User impact

Keyboard-only users and many assistive-technology users may be blocked from operating the interface or completing the task.

Remediation plan

Refactor the interaction so it is fully keyboard operable, uses correct semantics and states, preserves predictable focus movement, and avoids unexpected changes of context.

Steps to reproduce

  1. Open Media Manager.
  2. Navigate the interface with keyboard only using a screen reader.
  3. Select an item and attempt its available actions.
  4. Inspect roles, names, states, focus, and status messages.
  5. Observe that visual information and operations are not conveyed programmatically.

Version

6.1

Expected result

All controls in media manager are accessible to keyboard and assistive technology users. Toast messages are conveyed appropriately.

Instead of fixing the individual issues, it makes sense to re-think how the media manager is built and works and plan it from the ground up in an accessible way.

Actual result

In the grid view, the focusable icons for folders have no accessible name and no role. The checkmarks to select individual items have no role and hence also cannot receive the name through aria-label. Their status is not set. The checkboxes cannot be set using space or enter.

The ellipsis button that shows the sub menu to manage files does not expand using the arrow keys, but once expanded behaves like a toolbar with arrow navigation. This is inconsistent and also not communicated through roles and properties.

Keyboard interaction is inconsistent in the ellipsis menu in general. Sometimes the arrow key works as expected, occasionally the page scrolls, and sometimes the preview of a file is opened.

Pressing ESC does not close the ellipsis menu.

The table view is not keyboard accessible at all. Its columns can be sorted, but there is no programmatic indication of the current sorting direction.

In both views, the information panel cannot be filled when using the keyboard as activating an item immediately opens the folder or shows a preview of the file.

The toolbar also has accessibility issues:

The “Toggle select all” checkbox is implemented as a regular checkbox, and hence works as expected. (Consider dropping the word “toggle” from its accessible name, it is unnecessarily wordy and can be confusing. That the UI element toggles is implied by the fact that it is a checkbox.)

The file path navigation does not well convey what it is visually and also uses a navigation (

) element that has the aria-label of Breadcrumb. As this is not a classical navigation like a page navigation, consider using a different element. Pick a better accessible name than “Breadcrumb”, for example “Current path”.

The search field that filters the results shows an alert visually when there are no matches, but does not convey it to the assistive technologies.

The sort button (“Change ordering”) opens two select boxes that allow you to select what to order by and in which direction, but the select boxes are positioned after other buttons and the button does not convey that something would open. This makes the actual sorting options difficult to find.

The buttons to change the grid size look disabled when the minimum/maximum grid size is selected, but they are not made disabled programmatically. So the icons need to meet contrast requirements (at least 3∶1 contrast).

The switch from grid to list view and vice versa is named “Toggle between grid and table views” and gives users no indication on what mode is selected.

The toggle item info button does not indicate if the item info pane is shown or not.

The folder tree navigation is unclear to users and not properly implemented. Especially there roles need to be properly nested and expanded/collapsed set properly. See this example from W3C/WAI. That said, even the WAI treeview works sub-optimally on platforms that do not support treeviews natively, namely macOS and iOS.

What device were you using? (eg, phone, laptop)

Desktop web

What web browser were you using? (eg, Chrome, Safari)

Chrome, Firefox, Edge, Safari

Assistive Technology?

VoiceOver, JAWS, NVDA

Additional Comments

No response

avatar mbeganyi-a11y mbeganyi-a11y - open - 7 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - change - 7 Sep 2026
Labels Added: a11y a11y-audit-backlog a11y-priority-critical (Immediate)
avatar mbeganyi-a11y mbeganyi-a11y - labeled - 7 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - labeled - 7 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - labeled - 7 Sep 2026
avatar joomla-cms-bot joomla-cms-bot - change - 7 Sep 2026
Labels Added: No Code Attached Yet
avatar joomla-cms-bot joomla-cms-bot - labeled - 7 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - change - 7 Sep 2026
The description was changed
avatar mbeganyi-a11y mbeganyi-a11y - edited - 7 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - change - 8 Sep 2026
The description was changed
avatar mbeganyi-a11y mbeganyi-a11y - edited - 8 Sep 2026

Add a Comment

Login with GitHub to post a comment