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

Selecting the draggable handles of a block then typing does nothing #8541

Closed
tomjn opened this issue Aug 5, 2018 · 9 comments
Closed

Selecting the draggable handles of a block then typing does nothing #8541

tomjn opened this issue Aug 5, 2018 · 9 comments
Labels
[Feature] Drag and Drop Drag and drop functionality when working with blocks [Type] Bug An existing feature does not function as intended

Comments

@tomjn
Copy link
Contributor

tomjn commented Aug 5, 2018

Describe the bug
I clicked insert block, and selected the block with the cursor, then attempted to type hello but nothing happened.

To Reproduce
Steps to reproduce the behavior:

  1. Click insert block
  2. Select the newly created paragraph block with the mouse Click on the draggable handle
  3. try to type
  4. nothing is shown on screen

Expected behavior
I expected the inserter UI to dissapear and the word hello to show

Screenshots
screen shot 2018-08-05 at 01 50 15

Desktop (please complete the following information):

  • OS: MacOS High Sierra
  • Browser Chrome
  • Version 68

Additional context

  • Replicated on Testgutenberg.com
@tomjn
Copy link
Contributor Author

tomjn commented Aug 5, 2018

I saw testgutenberg.com runs v3.3, so I tested on frontenberg which is 3.4 with the same results

@abwdvm
Copy link

abwdvm commented Aug 5, 2018

I was not able to reproduce this error on Testgutenberg.com When I add block, paragraph, the flashing i beam is ready to enter text.
Chrome Version 68.0.3440.84 (Official Build) (64-bit)
Windows 7, Home Prem, SP 1

@tomjn
Copy link
Contributor Author

tomjn commented Aug 5, 2018

@abwdvm did you select the block though? Clicking insert then immediatley typing works, but I selected the block with my mouse cursor as shown in the screenshot

@tomjn
Copy link
Contributor Author

tomjn commented Aug 5, 2018

I get similar behaviour if I select a paragraph block with my cursor then attempt to type, nothing happens, I would expect instead to be moved into insertion mode with what I type appended to the end of the block

Note that when I say select, I'm not just clicking inside the block, I'm selecting the block. To do this you need to click on the periphery of the block, an easy way to do it is to click when the mouse cursor shows a hand for movement, or a pointer cursor ( as opposed to an caret/text cursor )

@designsimply designsimply changed the title Selecting the insert block then typing does nothing Selecting the draggable handles of a block then typing does nothing Aug 6, 2018
@designsimply
Copy link
Member

Tested and confirmed that I cannot interact with a block via keyboard while in drag-and-drop mode using WordPress 4.9.8 and Gutenberg 3.4.0 with Chrome 67.0.3396.99 on macOS 10.13.6 (59s).

draggable-handles-example
Seen at http://alittletestblog.com/wp-admin/post.php?post=14134&action=edit running WordPress 4.9.8 and Gutenberg 3.4.0 using Chrome 67.0.3396.99 on macOS 10.13.6.

I updated step 2 from "Select the newly created paragraph block with the mouse" to "Click on the draggable handle" to help clarify.

Possibly related: #7114.

@designsimply designsimply added [Type] Bug An existing feature does not function as intended [Feature] Drag and Drop Drag and drop functionality when working with blocks labels Aug 6, 2018
@oandregal
Copy link
Member

I think the fact that the draggable handle was invisible led to this kind of odd behavior/bug, as the user may have not been aware that the click happened in the draggable handle. Now that the draggable handle has its own icon within the block movers the expectations are clear: if you click on it, as with any other button, you'll lose focus on the block. With that in mind, I'm closing this.

@tomjn
Copy link
Contributor Author

tomjn commented Oct 16, 2018

@nosolosw my original issue was that if you selected a paragraph block then typed, nothing was typed. This issue with the dragging is just a subset of that problem. It's possible to select a block without using the draggable handle

@tomjn
Copy link
Contributor Author

tomjn commented Oct 16, 2018

@nosolosw For example, if I press tab to arrive at a block like this:

screenshot 2018-10-16 at 13 44 59

Typing does nothing, but I expect instead to see a caret appear and for what I type to become visible. Instead I have to either explicitly click, or tab through the entire toolbar. That's a lot of UI friction

Additionally, I clicked back to this github issue tab, and when I clicked back, and pressed tab, it went to the right hand sidebar.

Additionally, it's possible to click a non-draggable part of the inserter block, leaving the user in a situation where the block is selected but nothing can be typed:

screenshot 2018-10-16 at 13 48 01

Notice the lack of caret, and the missing selection highlight. Pressing tab brings it into focus. To do this, place the cursor above the block and move it upwards or downwards until the text cursor becomes a normal arrow cursor, and click.

@oandregal
Copy link
Member

I'd be fine with reopening but I see that you've already created a new one that is more general, so it makes sense to keep this closed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Drag and Drop Drag and drop functionality when working with blocks [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

No branches or pull requests

4 participants