Clicking below bottom text block does not defocus it, which can be confusing

[markjaquith]

If the bottom text block is focused, its UI could be blocking the block above it. Clicking in the vast space below the bottom block does not defocus it. Instead, you have to click somewhere in the "gutter".

My expectation would be that clicking in a vast empty expanse would deselect a block. I found myself struggling to deselect the block and reveal the hidden block above it. Esc does not work. Clicking in the vast expanse below only works if you click in the GUTTER. Clicking above sometimes inserts a block, if you aren't careful with your click.

[aduth]

This is the opposite of the expectation proposed by #5541, when this behavior was first introduced. This was based on the assumption that, for consistency with other word processor applications (Google Docs, Word) and to simplify the selection of text in the editable area, clicking below the last text block should direct focus into the text block at a caret X coordinate aligned to the click position.

I do think it speaks to a broader issue of it being difficult to deselect a block. There's been some recent improvements here as in #5543 to make click-to-clear behaviors more reliable. To the point on whether Escape should deselect the block, there was some mention of this in #5513. At the very least, this needs to be consistent and account for some accessible behaviors which occur within a block such as Escape-to-return-focus (#5551).

Flagging for design, cc @jasmussen @karmatosed

[markjaquith]

The difference, I think, is that a normal word processor does not have as strong a concept of a focused block that you might want to escape (in this case, so I could see what was in the block above). There are not so many "get me out of here" clicks.

I don't think I'd mind if a "below-all-the-blocks" click made my caret go to an X-aligned location in a bottom-most text block, if it got rid of the UI buttons above it.

[aduth]

It would surely be an option to trigger the isTyping flag when redirecting the click (the value that dismisses toolbar when typing within a paragraph block).

[markjaquith]

If the bottom block is not a paragraph, a below-all-content click starts a new paragraph with isTyping enabled, which feels really nice. Makes me think that just changing isTyping also in the case where the bottom block is a paragraph is the right move here.

[jasmussen]

I do personally really like the ability to click anywhere below the canvas to set a text caret. It's similar in Dropbox Paper and in Medium, and it's a great callback to editors. Although I understand the ticket here, combined with the ability to click left and right to deselect, I'm not sure I would personally put a high priority on addressing this. (Noting here that the leads might have a different opinion, I don't know.)

However if we were to address it, the compromise described above seems like a fine balance.

[markjaquith]

On some screen widths you only have a handful of pixels of gutters in which to click.

[aduth]

There may be an interesting tangent discussion on this psychological desire to deselect blocks. Why do we feel this need, and in what way do we feel uncomfortable by having a selected block (and conversely, more comfortable in a state of complete deselection)? Is it heaviness of the UI (should be lighter)? Wanting to step back and view the post as a flow of content (better previewing modes)?

I don't think it's unexpected; I certainly experience it. And perhaps too deep a discussion, but an interesting phenomenon nonetheless.

[markjaquith]

Yes! I've been thinking about that a lot since opening this ticket. It reminds me of many other experiences:

• The experience of being physically stuck (in a deep chair, or in a tight space).
• The experience of trying to get a tight sweater or shirt off, and struggling.
• The experience of having something undesired (but not frightening) like an insect, upon my person.
• The experience of having something that isn't relevant stuck in my field of vision. (Desktop clutter, unwashed or unfolded laundry).
• The experience of having my vision obscured (dirty sunglasses, a dirty windshield or window, someone blocking my view of something I want to look at).

It also represents a loss of control. When I'm using a computing device and the UI is responding quickly and intuitively, I get into this state of flow, where I am master of the machine. When something gets stuck and I'm trying... so... many... things... and... failing, the illusion falls apart and I realize I'm actually losing a wrestling match with an unruly maze of electrons.

Also, the block-selected state seems to be a prelude to action. I've tapped it on the shoulder. I have its attention. And now I'll ask something of it. When it is stuck in this state, and I'm concerned with my content as a whole or perhaps specifically with content that is partially obscured by the selected block, I get annoyed by it being in my face asking me "hey, what do you want me to do? What's up? Look at what I can do. Stop ignoring me—YOU called ME, buddy. Hey. Hey. Hi."

This does seem related to both the heaviness of the UI, and the content-blocking nature of it. I find that I am MUCH less bothered when I have Fix Toolbar to Top enabled.

[karmatosed]

@jasmussen:

I do personally really like the ability to click anywhere below the canvas to set a text caret. It's similar in Dropbox Paper and in Medium, and it's a great callback to editors.

I also like this ability. @markjaquith you make some excellent observations, thank you.

My expectation would be that clicking in a vast empty expanse would deselect a block.

I think this is a valid expectation by some and I think #5541 is also valid by some. That's kind of the interesting bit here for me as feels like which side you fall on this is from past experience brought to Gutenberg. Both are valid.

On some screen widths you only have a handful of pixels of gutters in which to click.

I agree this is a problem on smaller screens and should be something we iterate on.

It also represents a loss of control. When I'm using a computing device and the UI is responding quickly and intuitively, I get into this state of flow, where I am master of the machine. When something gets stuck and I'm trying... so... many... things... and... failing, the illusion falls apart and I realize I'm actually losing a wrestling match with an unruly maze of electrons.

This is a really important behaviour to notice and design to ease. Anytime someone feels loss of control that's when their bond with the experience is taking a hit.

This does seem related to both the heaviness of the UI, and the content-blocking nature of it. I find that I am MUCH less bothered when I have Fix Toolbar to Top enabled.

That's super interesting an observation. The toolbar position is turning out from feedback to be such a personal preference. We've gone back and forth with it's placing, even having tests go both ways in feedback. The entire thing is interesting from a design challenge view. Thanks for adding feedback there.

[markjaquith]

That's super interesting an observation. The toolbar position is turning out from feedback to be such a personal preference. We've gone back and forth with it's placing, even having tests go both ways in feedback. The entire thing is interesting from a design challenge view. Thanks for adding feedback there.

Yeah, I get that this is a personal preference. I find myself toggling it even based on screen size or what I'm editing.

I think the obscuring nature of the on-the-block editing bar bothers me more than the clutter factor. The first paragraph block obscures the title (partially) and subsequent paragraph blocks obscure the last line of the paragraph block above them. When you're trying to do that lean-back in-your-chair thing and observe your content, you want to be able to see all of it.

[bahia0019]

I was actually searching for a similar topic when I ran across this, and figured I'd add my observation too.
Like Mark, I too feel trapped when I can't intuitively escape out of something like a focused field.
I think using the ESC key is the most natural method for un-focusing.

In addition, I too have the desire to click into the vast blank area below each block.
I think that it would work to focus the lowest block, AND also unfocus any block when in a block.

[hedgefield]

I understand both sides, but personally also prefer being able to click anywhere in the whitespace to hide the block UI. For me it's a kind of pre-preview - I want to see the whole text, with nothing obscuring it or pulling more attention to a certain section. Eeverything should be as I intend it so I can review the flow of the text.

[ehti]

I was wondering why I'm unable to get rid of the editing toolbar (of a block) that was hiding the actual text.

I kept trying until I figured out that it only works if you click on the left/right side, and not below the last block in the vast whitespace.

Personally prefer this so +1 to this issue.

[Clorith]

I find my self wanting to have the floating toolbar, it gives context with the block that's selected and I find that very useful, but it does obscure blocks above it, and when there is no clear way to deselect it, it's frustrating and I too feel that loss of control and a bit of hopelessness.

I find my self hitting ESC repeatedly to get out of this, I expect most users to turn to the ESC key to de-select what they are in, as most software today uses it as well (see CAD, accounting software, photo editing and so forth, a lot of the tools many use on a regular basis).

[jasmussen]

It's been good to have this ticket sit open to gather feedback. It seems there's a majority consensus that "click below to set caret in bottom paragraph" (which is inspired by classic editors like Notepad and TextEdit) is not as useful in a block-based editor as initially assumed.

So I'm going to file this for 5.0, but with low priority because it obviously works as it is today, and whether this makes the cut depends on someone having bandwidth to write a pull request. But if they appear, we'll merge them. Thanks everyone!

[ellatrix]

Any change in opinion, especially after the lighter block UI that shipped in WP 5.5?

[markjaquith]

Not really. I do like the lighter UI, but the toolbar for paragraph 2 still obscures paragraph 1, and it's hard to make it go away.

The red areas are where you can click that will make the toolbar go away but not send your focus to another element. It still seems very strange to me that all the empty space below the bottom paragraph doesn't hide the toolbar for the last item. That area below the paragraph is its bottom-margin. Clicking that works, but just a little bit south of there, you're out of luck.

And pressing Esc throws me into select mode.

[jasmussen]

It's definitely been discussed sufficiently, let's try it!

[paaljoachim]

Can we get a status update on this issue?
Thank you!

[paaljoachim]

Clicking below the bottom block should automatically create a new Empty Paragraph block or atleast deselect the block and bring the attention back to the Page settings. Similar to clicking top right of the Page title area brings attention to the Page settings.

Anyhow here is an update to what it looks like currently in WordPress 5.7 beta 2 and Gutenberg plugin version 10.0

Clicking-below-bottom-block.mp4

@jasmussen Joen. It would be great to get this issue fixed.