geonetwork / geonetwork/core-geonetwork

Search bar accessibility issue

Open
#7,970 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
Java
Stars
521
Forks
515
Avg merge
6d 13h
Merged PRs (30d)
19

Description

**Describe the bug**
A clear and concise description of what the bug is.

Hi, it's been brought to our attention during a recent accessibility test that the search bar on the Search and Editor board pages has an unsupported ARIA attribute (aria-expanded = "false") (see screenshot)

**Please NOTE:** this doesn't happen on the home page.

I tracked this down to possibly coming from https://github.com/geonetwork/core-geonetwork/blob/e8e0e5bda2ecba0db70ecef718cb9f9673f0163c/web-ui/src/main/resources/catalog/lib/angular.ext/typeahead.js#L85

**To Reproduce in Google Chrome**
Steps to reproduce the behavior:
1. Go to the Search page
2. Right click and go to Inspect
3. Go to Lighthouse
4. Pick the following options: Mode: Navigation (Default); Device: Desktop; Categories: Accessibility
5. Click Analyze page load
6. See error: [aria-*] attributes do not match their roles

**Expected behavior**
A clear and concise description of what you expected to happen.
https://dequeuniversity.com/rules/axe/4.8/aria-allowed-attr

**Screenshots**
If applicable, add screenshots to help explain your problem.

![image](https://github.com/geonetwork/core-geonetwork/assets/36423106/2aca14a1-d1c8-427c-ad79-394186d5423f)

**Log file**
If applicable, add the server log file to help trace your problem.

**Desktop (please complete the following information):**
- Browser [e.g. chrome, safari]: Chrome
- GeoNetwork Version [e.g. 22]: 4.2.9
- Server Application [e.g. Tomcat 7 with Java 8]: Jetty in Docker

**Additional context**
Add any other context about the problem here.

Contributor guide

Open the contributing guide

Research direction

Review web-ui/src/main/resources/catalog/lib/angular.ext/typeahead.js around line 85 and reproduce the issue on the Search and Editor board pages using Chrome Lighthouse's accessibility audit. Done means the search bar no longer reports an aria-* attribute and role violation, while the home page behavior remains unaffected.

Written by the indexing model from the issue text.

Assessment

Tech stack
angularjs, javascript
Domain
accessibility, frontend
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.