1821251 - Quick search box can't be activated in screen reader browse mode

Status: RESOLVED FIXED

(bugzilla.mozilla.org :: User Interface, defect)

Description

[James Teh [:Jamie]]

STR (with the NVDA screen reader):

1. Go to https://bugzilla.mozilla.org/
2. Press control+home to ensure you're at the top of the document.
3. Press e to find the search edit box. Observe that there's no edit box.
4. Press c to jump to the search combo box.
5. Press enter.
   • Expected: The search box gets focus, ready for input.
   • Actual: Nothing happens.

Recently (a few days ago?), the quick search input control was wrapped in a role="combobox". However, the first child of that combobox is a heading. A combobox itself shouldn't contain a heading, although it can be labelled by one. Since the heading is the first child of a combobox, NVDA only renders that and doesn't render the text box.

I would recommend either:

1. Removing the combobox role altogether and instead labelling the input. I don't think the combobox serves any purpose here. As far as I can tell, the combo box doesn't seem to expand a list anyway.
2. If there really is a pop-up suggestions list and I just haven't seen it for some reason, the heading should be moved outside of the combobox.

For now, I can work around this by manually tabbing to the input in focus mode, but this is a pretty significant efficiency killer.

Comment 1

[:glob ✱]

What's changed is the index page used to have a search field in addition to the one that's present in the header. To avoid duplication the search field on the index page has been removed, so you're now hitting the one from the header.

Focusing the search field does display a list of suggestions (#header-search-dropdown, has a role of listbox), so comboxbox appears to be correct.

The header (#header-search-label) within the combobox is not visible: it's positioned absolutely off screen at left: -99999px. I don't know why this is, but as it appears to be getting in the way we should just remove it.

While we're here we should probably add a keyboard shortcut to focus the search field.

Comment 2

[:glob ✱]

Testing with NVDA hitting e indeed tells me there's no next edit field.
However, hitting c tells me there's no combo box.

I'll see if I can grab you on Slack to guide me through reproducing this locally.

Comment 3

[James Teh [:Jamie]]

(In reply to :glob ✱ from comment #2)

However, hitting c tells me there's no combo box.

I think this is outdated compared to our conversation on Slack, but for the record, I can reproduce this in Chromium but not Firefox. The reason for that is a slight difference in the way Chromium exposes this combobox. Either way, removing the inner heading should fix it in both browsers.

Comment 4

[BMO Automation]

Attachment: [mozilla-bteam/bmo] Bug 1821251 - fix accessibilty to search field in header, and add a shortcut to focus it (#2028)

Comment 5

[David Lawrence [:dkl]]

Merged
https://github.com/mozilla-bteam/bmo/commit/08975e30d9d08410a5bf4df9afa22c7bc90795c7