Make it possible to activate browser toolbar overflow panels from the keyboard

RESOLVED FIXED in Firefox 67

Status

()

enhancement
P1
normal
RESOLVED FIXED
5 months ago
3 months ago

People

(Reporter: Jamie, Assigned: Jamie)

Tracking

(Blocks 1 bug, {access})

unspecified
Firefox 67
Points:
---
Dependency tree / graph

Firefox Tracking Flags

(firefox67 fixed)

Details

Attachments

(1 attachment)

Assignee

Description

5 months ago
Bug 1436086 will make it possible to navigate to the overflow button on the nav bar if it's visible. However, pressing space or enter does nothing.

The toolbar key nav code simulates a click event, but that doesn't work because the overflow button uses mousedown. Even if we fixed that, the panel doesn't get focus. This panel goes a step further in that pressing down arrow or tab doesn't even work to focus the first item.

This is trivial to fix with a keypress handler. I already have the fix, but still need to write tests.

Comment 1

5 months ago
I'm fairly sure keyboard navigation in this menu is explicitly disabled because it can contain the search bar, and having a text input in the middle of arrow-navigated menus doesn't really work the way people expect.

If you have a good idea about how to fix that, I'm all ears. There's also bug 1477673 and bug 1489974 and bug 1379387.

Comment 2

5 months ago
P1 given Jamie is working on this.
Priority: -- → P1
Assignee

Comment 3

5 months ago
(In reply to :Gijs (he/him) from comment #1)
> I'm fairly sure keyboard navigation in this menu is explicitly disabled
> because it can contain the search bar, and having a text input in the middle
> of arrow-navigated menus doesn't really work the way people expect.

It's true that the behaviour with the search box and the arrow keys is currently ugly; if you cursor into the search box, you can't get out with the arrows. However, you *can* use the tab key instead (which is equivalent to the arrows in these panels). Given that there is a workaround, I think not having it usable with the keyboard at all is far worse than this ugliness.

> If you have a good idea about how to fix that, I'm all ears.

Three possibilities:

1. Somehow make it so that the down/up arrow keys get handled by PanelMultiView instead of the search box when there's no text entered in the search box, assuming this doesn't already do something. I guess this would mean tweaking the search box so that it doesn't eat the key events in this case.
2. Have PanelMultiView Only navigate to buttons with up/down arrows. The user would have to tab to get to the search box. Perhaps a bit confusing, but it does solve the problem.
3. Have PanelMultiView disable up/down arrows altogether if there's a text box.

That said, I still think we should deal with this in a future bug.

Comment 4

3 months ago

However things progress … at some point, I reckon it'll be good to gauge how things 'feel', holistically, when navigating through the overflow and into an extension that has a relatively rich UI. Sesnes of consistency, predictability, throughout the various steps.

For what it's worth, the first extension that comes to mind is Conex, the popup of which does already have a direct keyboard shortcut (for the purposes of this bug 1515543, I should ignore that shortcut and take the step-by-step approach through the overflow). A while since I used the extension with Firefox, but I do recall it going through a few iterations before keyboard navigation began to feel consistent and predictable.

Comment 6

3 months ago
Pushed by jteh@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/fa59aea64e12
Support keyboard activation (space/enter) of toolbar overflow buttons when focused. r=Gijs
Assignee

Updated

3 months ago
Summary: Make browser toolbar overflow panels keyboard accessible → Make it possible to activate browser toolbar overflow panels from the keyboard

Comment 7

3 months ago
bugherder
Status: NEW → RESOLVED
Last Resolved: 3 months ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 67

Comment 8

3 months ago

! In D21614#597441, @Jamie wrote:

! In D21614#586894, @Gijs wrote:
Note that keyboard navigation inside the overflow menu is (was?) disabled because it doesn't work well if the search box is in there. We might need to rethink that...

Keyboard navigation inside the overflow panel does seem to work with this patch applied. However, I realised that's because DOM is (sort of) handling the arrow keys. Still, I think at least being able to tab here is better than nothing. Anyway, let's discuss this in the bug (or another one).

Did you try actually putting the search bar in the overflow panel?

I think we need a solution here for the arrow key behavior, and then need to enable the keyboard navigation in the panel, because as-is this enables navigating to the panel, but then the result is inconsistent with the other panels and potentially trappy wrt the search box.

Flags: needinfo?(jteh)
Assignee

Comment 9

3 months ago

(In reply to :Gijs (he/him) from comment #8)

Did you try actually putting the search bar in the overflow panel?

Yes. If you use the arrow keys, you will get trapped there, but you can press tab to get out.

I think we need a solution here for the arrow key behavior, and then need to enable the keyboard navigation in the panel, because as-is this enables navigating to the panel, but then the result is inconsistent with the other panels and potentially trappy wrt the search box.

I agree we need a solution, though I still think being able to tab here is a whole lot better than it being completely inaccessible with the keyboard in the short term. I'll open a new bug for the arrow key behaviour fixes.

Flags: needinfo?(jteh)
You need to log in before you can comment on or make changes to this bug.