1897411 - Add keyboard shortcut for expanding and hiding the sidebar

Status: VERIFIED FIXED

(Firefox :: Sidebar, enhancement, P1)

Description

[Sarah Clements [:sclements]]

We'll be adding new keyboard shortcuts to do the following:

• expand the sidebar - Ctrl + E (win and linux), Cmd + E (mac)
• open/close tabs from other devices - Ctrl + shift + M (win and linux), Cmd + shift + M (mac)

Comment 1

[Ania]

Hi Bryan,
Do you have any concerns about using these shortcuts from a localization standpoint?
I attached two videos to demonstrate what shortcuts would do.

Comment 2

[Ania]

Attachment: expand sidebar

Comment 3

[Ania]

Attachment: expand tabs from other devices/synced tabs

Comment 4

[Bryan Olsson [:bolsson]]

Hi Ania - from a localization point of view I don't have any issues.

But I do want to point out that Chrome browsers (at least Chrome and Edge) use Ctrl + Cmd + M for for logging in as a new user/guest - the equivalent of the profile selector feature being rolled out in 134.

Comment 5

[Ania]

Thank you so much for the callout, Bryan. I reached to the profile management team to see if they might have already planned to use it.

Comment 6

[Ania]

We decided to stick with implementing just one shortcut (expand the sidebar), and handle panel shortcuts in a more holistic way later, as a part of the customizable keyboard shortcuts effort, as few remaining shortcuts are either more appropriate for something else (e.g. + M for profile management) or have been staked out by popular extensions and we would rather not disrupt the pattern.

Please see spec for more details.

Comment 7

[Kelly Cochrane [:kcochrane]]

Attachment: Bug 1897411 - Add keyboard shortcut for expanding/collapsing the new sidebar

Comment 8

[Ania]

Hi folks,

We are trying to find available shortcuts for expanding the sidebar action.
On Windows, Ctrl + E seems to be used for the findSelection shortcut, and I was hoping to get your confirmation that we're estimating its usage correctly (and hence, remapping the shortcut to another action is a non-starter).

Have we correctly identified that it's the keyFindSelection value that's recorded in browser_ui_interaction_keyboard when Ctrl + E is used?
This query suggests that ~700k distinct clients have used it since the beginning of 2024, while this one suggests fairly heavy usage, with [1M MAU and 4M monthly interactions}(https://sql.telemetry.mozilla.org/queries/103895/source).
Is this a correct interpretation?

On macOS, the same action seems to be mapped to different key combinations (rather than Cmd + E or Ctrl + E), but the mapping still seems to exist in the code. We wanted to check in with you what's the source of truth?
User-facing docs on SUMO suggest that macOS shortcut for the same action is Cmd + J and the Linux one is Ctrl + J.

Comment 9

[Ania]

Hi Bryan,

Can we please ask for your help again? We're trying to find a free shortcut we might be able to use for expanding the sidebar. Ctrl/Cmd + E is already taken on Windows, and it makes sense to align its use for search on other platform instead of using it for the sidebar.

Here's where we need your expertise. It looks like:
alt + modifier key for Linux and Windows / ctrl + modifier key on macOS is the only viable option for adding new shortcuts. However, many of the combinations of alt + modifier keys are already mapped to open menu items, and these combinations are locale-dependent (e.g., en-US uses F, E, V, S, B, T, and H).

Are there any combinations of alt + modifier key that are free across all locales? English leaves the following keys seemingly unused:
a
c
g
i
j
k
n
o
p
q
w
r
y
u
x
z

P.S. The reason we're looking at the alt combinations is because:

• ctrl + modifier key - 100% of the combinations are taken.
• ctrl + shift + modifier key - 100% of the combinations are taken.
• ctrl + shift + alt/option - modifer key - arguably, not useful outside of power features.

Comment 10

[Bryan Olsson [:bolsson]]

Hi Ania - Unfortunately, it looks like all the letters you tagged are used in at least one locale.

You can see what letters are used by locales for the various menu items here:
https://transvision.mozfr.org/string/?entity=browser/browser/menubar.ftl:menu-file.accesskey&repo=gecko_strings
https://transvision.mozfr.org/string/?entity=browser/browser/menubar.ftl:menu-edit.accesskey&repo=gecko_strings
https://transvision.mozfr.org/string/?entity=browser/browser/menubar.ftl:menu-view.accesskey&repo=gecko_strings
https://transvision.mozfr.org/string/?entity=browser/browser/menubar.ftl:menu-history.accesskey&repo=gecko_strings
https://transvision.mozfr.org/string/?entity=browser/browser/menubar.ftl:menu-bookmarks-menu.accesskey&repo=gecko_strings
https://transvision.mozfr.org/string/?entity=browser/browser/menubar.ftl:menu-tools.accesskey&repo=gecko_strings
https://transvision.mozfr.org/string/?entity=browser/browser/menubar.ftl:menu-help.accesskey&repo=gecko_strings

Comment 11

[Ania]

Thank you for your help, Bryan!

Kelly, we had a quick conversation with Bryan, and it looks like our last remaining option are digits, so we are thinking of:

• Alt + 1 (Windows and Linux)/ Ctrl + 1 (macOS) - to expand the sidebar

Can you please help us investigate whether there are any barriers to using this combination?
There are several keyboard layouts where digits can only be reached using additional modifiers (usually Shift). I wonder if, for these keyboards, instead of using a three-symbol shortcut, we can use a combination of Alt and the symbol produced by the same key (1) without the additional modifier:

Czech - Alt + + symbol
Dutch - Alt + &
French - Alt + &
Lithuanian - Alt + ą
Mongolian - Alt + №
Languages that use Arabic script - Alt + ١
Please let me know if this is possible!

Bryan, hopefully, one last question: How do we pick equivalents for locales that use unique scripts (e.g., Korean, Lao, or Khmer)? Would you suggest using the symbol assigned to the same key as "1" in the en-US on these keyboards?

Comment 12

[Bryan Olsson [:bolsson]]

As I mentioned, using numbers could be complicated since keyboards are also quite complicated. I mentioned that devtools seems to be using an accesskey with the number 1 using the virtual key code (VK_1), but I'm not sure how well supported that is in the greater Firefox. I know we have the CMD + number shortcut to select tabs, so it could be possible.

The method of using Alt + [Symbol] will not work however. Using French as an example, there's multiple layouts possible so using alt + & likely won't work because it may be a different location depending on. the keyboard layout:
French (Legacy, AZERTY) Keyboard
French (Standard, AZERTY) Keyboard
French (Standard, BÉPO) Keyboard

In the French (Standard, BÉPO) Keyboard for example & is hidden behind the AltGr modifier.

Comment 13

[Francesco Lodolo [:flod]]

Nothing to add to the great research that Bryan did on the localization front.

What would be the shortcut on macOS? I don't think using alt+(character) provides a consistent experience with the OS, because that's not a combination that users expect to have to interact with the UI. Also, alt+(character) produces characters on that platform, depending on the keyboard layout (e.g. alt+1 is « in Italian).

Similarly, alt+(character) is tied to a very specific behavior on Linux and Windows (open menus), and it doesn't feel like a good (consistent) user experience to do something completely different.

ctrl + modifier key - 100% of the combinations are taken.
ctrl + shift + modifier key - 100% of the combinations are taken.

Is there a comprehensive and maintained list of these? I have a feeling there isn't, and we keep hitting this problem (the last time was with PiP).

Comment 14

[Dão Gottwald [:dao]]

(In reply to Francesco Lodolo [:flod] from comment #13)

Nothing to add to the great research that Bryan did on the localization front.

What would be the shortcut on macOS? I don't think using alt+(character) provides a consistent experience with the OS, because that's not a combination that users expect to have to interact with the UI. Also, alt+(character) produces characters on that platform, depending on the keyboard layout (e.g. alt+1 is « in Italian).

On Linux, Alt + 1 selects the first tab.

Similarly, alt+(character) is tied to a very specific behavior on Linux and Windows (open menus), and it doesn't feel like a good (consistent) user experience to do something completely different.

This is generally true, but there's at least one notable exception: Alt + D focuses the address bar on Linux and Windows. That's not to say that there's room for another such exception.

It might be worth looking into Ctrl + Alt + [letter] for Windows and Linux. Right now we only have Ctrl + Alt + R for toggling Reader Mode on Linux, and Ctrl + Alt + P/G as commands within print preview on both Linux and Windows.

Comment 15

[Ania]

Is there a comprehensive and maintained list of these?

There are two lists, both have some minor ommissions:
https://support.mozilla.org/en-US/kb/keyboard-shortcuts-perform-firefox-tasks-quickly
https://firefox-source-docs.mozilla.org/devtools-user/keyboard_shortcuts/index.html

The challenge, though, is not that the lists have omissions but that shortcuts that follow the most convenient and easy-to-use patterns (ctrl/cmd + character, ctrl/cmd + shift + character) are no longer available.

macOS

What would be the shortcut on macOS?

Right now, I'm trying to understand if we can use Ctrl + 1 for macOS.
Ctrl + letter is widely used in Apple's applications, and using a letter would be preferable, from my perspective.
Bryan, I am realizing that I might have misread your earlier message with links to strings for access keys, as it covers Alt + symbol on Windows and Option + symbol on mac, but not Ctrl. Is the Ctrl + symbol actually available on macOS with the symbols I listed above?

Windows + Linux

It might be worth looking into Ctrl + Alt + [letter] for Windows and Linux. Right now we only have Ctrl + Alt + R for toggling Reader Mode on Linux, and Ctrl + Alt + P/G as commands within print preview on both Linux and Windows.

Ctrl + Alt on Windows produces AltGr, AFAIK.
Windows interprets Ctrl+Alt as AltGr, to accommodate some compact keyboards like those of netbooks which have neither the AltGr key nor a right-hand Alt key. Thus Ctrl+Alt+a has the same effect as AltGr+a. Because of this feature, Microsoft advises that Ctrl+Alt not be used as part of any application keyboard shortcut, as it would prevent typing the matching AltGr character on such keyboards.

It looks like using this combination could create a problem for some locales for some symbols. I'm curious how did we pick + R and + P/G combinations, and what combinations do we use in locales with non-Latin scripts?

Comment 16

[Francesco Lodolo [:flod]]

(In reply to Ania from comment #15)

Ctrl + letter is widely used in Apple's applications, and using a letter would be preferable, from my perspective.

There are quite a few of them

Control-A: Move to the beginning of the line or paragraph.
Control-B: Move one character backward.
Control-D: Delete the character to the right of the insertion point. Or use Fn-Delete.
Control-E: Move to the end of a line or paragraph.
Control-F: Move one character forward.
Control-H: Delete the character to the left of the insertion point. Or use Delete.
Control-K: Delete the text between the insertion point and the end of the line or paragraph.
Control-L: Center the cursor or selection in the visible area.
Control-N: Move down one line.
Control-O: Insert a new line after the insertion point.
Control-P: Move up one line.
Control-T: Swap the character behind the insertion point with the character in front of the insertion point.

Some don't seem to work, and some seem not documented, e.g. CTRL+V does something for me in this edit field (page down?). I haven't tried them all.

It looks like using this combination could create a problem for some locales for some symbols. I'm curious how did we pick + R and + P/G combinations, and what combinations do we use in locales with non-Latin scripts?

Shortcuts are usually not localized, we ask locales to keep the same value as English (with the exception of PiP, because it's not using letters but symbols). Unfortunately I currently have no way to test if Ctrl+Alt+R, for example, is working on a layout with Cyrillic characters (I don't remember seeing bugs about it).

Comment 17

[Ania]

Just to make sure I understand correctly: even if we omit using the entire list ( Apple notes that the behavior of these shortcuts may vary with the app you're using.), there are still quite a few characters we can use that are not in use in Firefox on macOS:
Ctrl + c
Ctrl + g (potential Ctrl + Alt + G equivalent is taken for a PDF-specific shortcut)
Ctrl + i
Ctrl + j
Ctrl + q
Ctrl + w
Ctrl + r (potential Ctrl + Alt + G equivalent is taken for a PDF-specific shortcut)
Ctrl + y
Ctrl + u
Ctrl + x
Ctrl + z

Shortcuts are usually not localized
Let me double-check to make sure I'm not misunderstanding: we don't localize shortcuts, but we localize Alt + character combinations (presumably to avoid collision with special symbols in various locales), right?

If I understand both points correctly, that seems to leave us with a few potential equivalents (I can check all of them for any collisions on Windows with Cyrillic layout):
Can be pressed with one hand:
Ctrl + C (macos)/ Ctrl + alt + C (Linux and Windows)
Ctrl + X / Ctrl + alt + X
Ctrl + Z / Ctrl + alt + Z

Require two hands:
Ctrl + I / Ctrl + alt + I
Ctrl + J / Ctrl + alt + J
Ctrl + Q / Ctrl + alt + Q
Ctrl + W / Ctrl + alt + W
Ctrl + Y / Ctrl + alt +Y
Ctrl + U / Ctrl + alt + U

Comment 18

[Francesco Lodolo [:flod]]

Shortcuts are usually not localized
Let me double-check to make sure I'm not misunderstanding: we don't localize shortcuts, but we localize Alt + character combinations (presumably to avoid collision with special symbols in various locales), right?

Shortcuts are not localized for a few reasons. Among them: they're often shared with other apps or are parts of established OS paradigms (e.g. CTRL/Cmd+C for copy text), and it would be extremely confusing for users that Cmd+Q does one thing in English, but another thing in Spanish.

Locales can choose if they want to localize access keys (that's what Alt+character is, not a keyboard shortcut), given they depend on the text of the label they're associated with. It's worth noting that most locales using a non-Latin script keep them unchanged (that's the case for Chinese, Korean, Japanese).

Comment 19

[Dão Gottwald [:dao]]

Have you considered repurposing existing sidebar shortcuts such as Accel + B (bookmarks sidebar)? I suppose that might upset some users, but perhaps those could be detected so we could keep the old behavior for them.

Also, are you still planning on auto-expanding the sidebar on hover (bug 1930201)? I imagine that might make adding a shortcut less of a priority, although it might still be handy for keyboard-focused users. For accessibility purposes, I suppose we could auto-expand when keyboard focus moves into the sidebar launcher?

Comment 20

[Ania]

(In reply to Dão Gottwald [:dao] from comment #19)

Have you considered repurposing existing sidebar shortcuts such as Accel + B (bookmarks sidebar)? I suppose that might upset some users, but perhaps those could be detected so we could keep the old behavior for them.
900k users use Bookmarks shortcut daily, so that option feels off the table, from my perspective :(

Also, are you still planning on auto-expanding the sidebar on hover (bug 1930201)? I imagine that might make adding a shortcut less of a priority, although it might still be handy for keyboard-focused users. For accessibility purposes, I suppose we could auto-expand when keyboard focus moves into the sidebar launcher?

We do, but we are several releases from it. The on-hover behavior will likely become a default, but depending on one's setup, I still expect many users to find the shortcut valuable.

Comment 21

[Sarah Clements [:sclements]]

(In reply to Dão Gottwald [:dao] from comment #19)

Have you considered repurposing existing sidebar shortcuts such as Accel + B (bookmarks sidebar)? I suppose that might upset some users, but perhaps those could be detected so we could keep the old behavior for them.

To Ania's point, a user just filed bug 1933818 requesting to preserve the old behavior when using that particular keyboard shortcut. :)

Comment 22

[Ania]

After the consultation with our A11Y partners, we decided on using this combination for expanding the sidebar:

• Ctrl + Z - for macOS
• Ctrl + Alt + Z - for Linux and Windows

Kelly, please let me know if I should file a ticket to update the sidebar tooltip to:

• Collapse/Expand sidebar (⌃Z) - for macOS
• Collapse/Expand sidebar (Ctrl + Alt + Z) - for Linux/MacOS

Comment 23

[Kelly Cochrane [:kcochrane]]

I think I'm ok to update the tooltip in the same patch. We mean the tooltip for the sidebar toggle button, right?

Comment 24

[Ania]

Yes, this one. Thank you!

Comment 25

[Ania]

Attachment: Screen Shot 2024-12-05 at 6.41.42 PM.png

Comment 26

[TechHorse]

Hello. Looking through the list of current Firefox keyboard shortcuts found at:
https://support.mozilla.org/en-US/kb/keyboard-shortcuts-perform-firefox-tasks-quickly
I see several duplicates. Instances where there are two combos to achieve the same result. Couldn't one of these duplicates be used?

For example:
ctrl+E & ctrl+K
Ctrl + Y & Ctrl + Shift + Z
F3 & Ctrl + G
F12 & Ctrl + Shift + I

My personal preference would be to use Ctrl + Shift + Z, as it is a duplicate of the much more widely used and "official" OS Ctrl + Y command for the redo operation.

Plus it would be in keeping with other Ctrl + Shift + key combos for showing / hiding GUI elements, such as Ctrl + Shift + B for toggling the bookmarks toolbar.

A problem with using ctrl+alt+key commands has already been described. Another is that a lot of users consider ctrl+alt+key combos to be safe from conflict with the OS / applications, and so will use them for their own hotkeying purposes (for example, they might use them for Desktop / Start Menu shortcuts). They might have been using a particular user hotkey for a certain task for years, assuming, as I say, that they would be safe from being taken over.

Yes I am aware that if you change the function of one of a duplicate pair of Firefox commands then this will annoy those users who use that particular one of the pair, but that seems preferable (to me at least) to venturing out into "user-only" combos, and also going against Microsoft's advice. Just my 2p.

Comment 27

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/0cec1bf8ce28
Add keyboard shortcut for expanding/collapsing the new sidebar r=sidebar-reviewers,fluent-reviewers,bolsson,sclements

Comment 28

[Narcis Beleuzu [:NarcisB]]

Backed out for bc crashes on browser_private_mode.js

Backout link: https://hg.mozilla.org/integration/autoland/rev/f555f0d06e9fea61b31387bc84d90b452b05971a
Log link: https://treeherder.mozilla.org/logviewer?job_id=486158153&repo=autoland&lineNumber=5368

Comment 30

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/8a8f3cd8c4fa
Add keyboard shortcut for expanding/collapsing the new sidebar r=sidebar-reviewers,fluent-reviewers,bolsson,sclements

Comment 31

[amarc]

https://hg.mozilla.org/mozilla-central/rev/8a8f3cd8c4fa

Comment 33

[tabmix.onemen]

I see this error when the browser starts with sidebar.revamp set to true

TypeError: can't access property "dataset", this.toolbarButton is null
    updateToolbarButton chrome://browser/content/sidebar/browser-sidebar.js:1097
    onCreated resource:///modules/CustomizableWidgets.sys.mjs:300
    aEventName resource:///modules/CustomizableUI.sys.mjs:3475
    buildWidget resource:///modules/CustomizableUI.sys.mjs:2185
    getWidgetNode resource:///modules/CustomizableUI.sys.mjs:1480
    buildArea resource:///modules/CustomizableUI.sys.mjs:1274
    registerToolbarNode resource:///modules/CustomizableUI.sys.mjs:1185
    registerToolbarNode resource:///modules/CustomizableUI.sys.mjs:4624
    onDOMContentLoaded chrome://browser/content/browser-init.js:169
CustomizableUI.sys.mjs:3480:17

Comment 34

[:Gijs (he/him)]

(In reply to tabmix.onemen from comment #33)

I see this error when the browser starts with sidebar.revamp set to true

TypeError: can't access property "dataset", this.toolbarButton is null
    updateToolbarButton chrome://browser/content/sidebar/browser-sidebar.js:1097
    onCreated resource:///modules/CustomizableWidgets.sys.mjs:300
    aEventName resource:///modules/CustomizableUI.sys.mjs:3475
    buildWidget resource:///modules/CustomizableUI.sys.mjs:2185
    getWidgetNode resource:///modules/CustomizableUI.sys.mjs:1480
    buildArea resource:///modules/CustomizableUI.sys.mjs:1274
    registerToolbarNode resource:///modules/CustomizableUI.sys.mjs:1185
    registerToolbarNode resource:///modules/CustomizableUI.sys.mjs:4624
    onDOMContentLoaded chrome://browser/content/browser-init.js:169
CustomizableUI.sys.mjs:3480:17

Found independently through logs from bug 1932653 and filed as bug 1939639.

Comment 35

[Daniel Bodea [:danibodea]]

I can confirm the implementation of the CTRL+ALT+Z (Windows + Linux) and CTRL+Z (MacOS) hotkeys to expand or collapse the sidebar.
Also, the tooltips are:

• MacOS: Expand sidebar (^Z) / Collapse sidebar (^Z)
• Windows: Expand sidebar (Alt+Ctrl+Z) / Collapse sidebar (Alt+Ctrl+Z)
• Linux: Expand sidebar (Alt+Ctrl+Z) / Collapse sidebar (Alt+Ctrl+Z)

To test this, the sidebar feature has to be enabled with sidebar.revamp=true. Testing was performed in Nightly v136.0a1 from 2024-01-15 and Beta v135.0b4 on Windows 10, MacOS 11 and Ubuntu 22.
It would appear that the hotkey to "open/close tabs from other devices" has not been implemented.
Closing as verified; Thank you.