Fix inserting button block when pressing enter in a block with bound text attribute
#59361
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
SantosGuillamot
added
[Type] Bug
SantosGuillamot
requested review from
gziolo,
artemiomorales and
michalczaplinski
SantosGuillamot
requested review from
ellatrix,
fluiddot and
dcalhoun
as code owners
|
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
|
Size Change: -3 B (0%) Total Size: 1.71 MB
ℹ️ View Unchanged
|
gziolo
added
the
Backport to WP 6.7 Beta/RC
42 tasks
SantosGuillamot
requested review from
kevin940726 and
Mamaduka
as code owners
|
Hm. Could I have a look at this first tomorrow? |
ellatrix
reviewed
Feb 26, 2024
@ellatrix I was taking a look but will leave you to it! Thanks 🙏 |
github-actions
bot
added
the
[Status] In Progress
gziolo
reviewed
Feb 28, 2024
gziolo
reviewed
Feb 28, 2024
.../block-editor/src/components/block-list/use-block-props/use-selected-block-event-handlers.js
Outdated
Show resolved
Hide resolved
michalczaplinski
changed the title
text attribute
ellatrix
reviewed
Feb 29, 2024
ellatrix
reviewed
Feb 29, 2024
Co-authored-by: Greg Ziółkowski <[email protected]>
This reverts commit 63ffff87ca048a218567772710dcc45affcfd2aa.
SantosGuillamot
force-pushed
the
fix/insert-button-block-by-pressing-enter-with-bindings
branch
from
471c409
to
290273c
Compare
|
I'm working on adapting the tests to the latest changes added in |
gziolo
approved these changes
Mar 1, 2024
SantosGuillamot
deleted the
fix/insert-button-block-by-pressing-enter-with-bindings
branch
youknowriad
pushed a commit
that referenced
this pull request
Mar 4, 2024
…`text` attribute (#59361) * Add tabindex 0 to all disabled elements in rich text * Insert block when use enter in disabled rich text * Take default block into account * Add e2e tests when pressing enter in bound blocks * Revert initial implementation * Use `insertAfterBlock` instead of `insertDefaultBlock`. * Remove unnecessary `insertDefaultBlock` * Destructure innerBlocks array in tests Co-authored-by: Greg Ziółkowski <[email protected]> * Prettify tests * Remove unnecessary select in tests * Destructuring blocks in tests * Revert "Remove unnecessary select in tests" This reverts commit 63ffff87ca048a218567772710dcc45affcfd2aa. * Remove unnecessary select in tests * Adapt tests to latest changes --------- Co-authored-by: Greg Ziółkowski <[email protected]>
|
I just cherry-picked this PR to the update/packages-6.5-rc1 branch to get it included in the next release: 77ba590 |
youknowriad
added
Backported to WP Core
youknowriad
pushed a commit
that referenced
this pull request
Mar 4, 2024
…`text` attribute (#59361) * Add tabindex 0 to all disabled elements in rich text * Insert block when use enter in disabled rich text * Take default block into account * Add e2e tests when pressing enter in bound blocks * Revert initial implementation * Use `insertAfterBlock` instead of `insertDefaultBlock`. * Remove unnecessary `insertDefaultBlock` * Destructure innerBlocks array in tests Co-authored-by: Greg Ziółkowski <[email protected]> * Prettify tests * Remove unnecessary select in tests * Destructuring blocks in tests * Revert "Remove unnecessary select in tests" This reverts commit 63ffff87ca048a218567772710dcc45affcfd2aa. * Remove unnecessary select in tests * Adapt tests to latest changes --------- Co-authored-by: Greg Ziółkowski <[email protected]>
|
This PR introduced new behaviors for blocks with default blocks inside them (gallery, navigation). For example, adding a new link to the navigation block when a navigation link is selected will add a new link to the navigation block:
Same for adding images to a gallery:
Is this the intended behavior for these blocks? Screen.Recording.2024-03-19.at.2.32.35.PM.mov |
|
I would say it is the expected behavior. What do you think should be happening? If I am not mistaken, the function used here is using the default block defined by each block, and the According to the docs, For both the navigation and the gallery,
So, if that's not the expected behavior, I am not sure if it is related to this PR or to those properties in the relevant blocks. |
Previously, nothing happened when pressing Enter when the Navigation Link was active. Other possibilities would be:
Adding a new link could be a fine thing to do when pressing Enter. I'm only raising this to make sure it's an intentional decision. This is a big change in the interaction, and it appears accidental right now. This new behavior could be better though! I'm still undecided on it. It feels jarring to me to press Enter on a navigation link item and have a new link item added with a popover open. It's a lot of things unexpectedly happening.
That's the action from the block appender, not pressing enter on the selected block. I don't see a way in the docs to prevent an Enter keypress on the active item from adding a new default block. At the moment, I think I'd have to catch the Enter keypress within the navigation link block. |
|
I opened a new issue for this -- I don't think this PR is the cause of this behavior, but the design of the blockProps onKeydown: #60051 I'll keep looking, but I don't see a way to prevent adding a new block on Enter, and there are valid cases for not wanting that behavior. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What?
Discussed in this other pull request.
If a button block text is bound to a custom field, it disables its editing. However, when you try to add a new button by pressing enter when the bound button is selected, nothing happens. It should add a new button the same way it does with not connected ones. To reproduce it you can:
This pull request tries to solve that.
Why?
The current UX is not the expected one.
How?
There are two issues that need to be solved:
I'm solving this by always setting the tabindex to 0 when the rich text is bound: link.
I'm solving that part by manually inserting a new block when the rich text is not editable and the user press Enter: link. Not 100% sure this is the right approach but it seems to be working for the current use cases (paragraph, heading, and button).
Testing Instructions
Repeat the process with a paragraph and a heading and check they work as expected as well.