Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Not possible to use tab for list indentations #8356

Closed
Clorith opened this issue Aug 1, 2018 · 5 comments
Closed

Not possible to use tab for list indentations #8356

Clorith opened this issue Aug 1, 2018 · 5 comments
Labels
[Feature] Blocks Overall functionality of blocks [Type] Enhancement A suggestion for improvement.

Comments

@Clorith
Copy link
Member

Clorith commented Aug 1, 2018

Describe the bug
When writing lists, it's often useful to have sub-lists as well in various places. This is possible in Gutenberg if you click on the indent buttons, but it's common practice to use tab and shift-tab to move indentations in/out.

Gutenberg just moves the cursor focus to the next block when tab is used.

It's expected that tab moves indentations in lists, and is the behavior of all other word processors.

To Reproduce
Steps to reproduce the behavior:

  1. Create your ontent
  2. Add a list block with a list item
  3. Create a new list item and hit tab to move it in one step as a sub-list

Desktop (please complete the following information):

  • OS: Windows 10
  • Browser Chrome 68
  • Gutenberg 3.4.0
@Soean Soean added the [Feature] Blocks Overall functionality of blocks label Aug 1, 2018
@youknowriad
Copy link
Contributor

I'm pretty sure this is a duplicate and this is by design for accessibility reasons because tab has another use-case in the web (navigation in the page). cc @afercia

@ZebulanStanphill
Copy link
Member

Notably, there is a block that uses Tab for something other than navigation: the Custom HTML block. Pressing Tab inserts, well, a tab character. Pressing Esc and then Tab lets you exit the block as usual. That said, I doubt having to press Esc and then Tab in the List block to navigate to the next block is desirable behavior. I think some different keyboard shortcut should be implemented for indenting list items.

@afercia
Copy link
Contributor

afercia commented Aug 1, 2018

@youknowriad yes a while ago I've opened #7051 for the List block, as follow up to #4181. I'd invite everyone to continue the discussion there.

Currently, in the List block indentation is made via meta+[ for list outdent and meta+] for list indent.

It's expected that tab moves indentations in lists, and is the behavior of all other word processors

@Clorith right: in word processors. I'd agree that would be the expected behavior in a desktop application or a full page editor, where navigation is provided by other means. However, Gutenberg is not a word processor, it's a web application and the native, expected, behavior of the Tab key on the Web is to navigate through focusable elements. In Google Docs, for example, the recommended shortcuts are meta+[ and meta+] (though Tab works too, but again Google Docs is a full page editor).

@SuperGeniusZeb right, that's a trade-off, an exception I'm not particularly happy with, but it was necessary to make the code editor (CodeMirror) in the HTML block work as an editor. It's the same trade-off solution core already uses in other places, for example the Plugin / Theme editors and the CSS editor in the Customizer. Without that, it would be impossible to tab away from the HTML block (there would be a so called "keyboard trap").

#7051 highlights the inconsistency with the Classic Block, I guess the Code block should be mentioned too.

@afercia afercia closed this as completed Aug 1, 2018
@bph
Copy link
Contributor

bph commented Aug 1, 2018

Hmmm, it's really hard to move away from current behavior when migrating to Gutenberg, I think there should be as little disruption as possible. And thank you @Clorith for filing an issue. It was on my list of little quirks for a while now.

Not only in word processors. The current WordPress editor really does support the tabbing in and tabbing out (shift+tab). In the video you don't see that I use the tab key, though... but I post it here anyway.
http://recordit.co/zIgXrBkYTc

@afercia I read through the other issues... I see your point. And I get that it's not possible to attach the tab behavior to the list block context alone, and now is the time to make it all accessible. I found that GMail actually doesn't use tab key either for list indentation. So the inconsistencies are already dealt with in different programs as well. 👍

@afercia
Copy link
Contributor

afercia commented Aug 1, 2018

@bph hello 👋 yep, lists in the Classic Editor are a bit different though, mentioned in #7051.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Blocks Overall functionality of blocks [Type] Enhancement A suggestion for improvement.
Projects
None yet
Development

No branches or pull requests

7 participants