Hitting Backspace In the Reusable Block Naming Modal Deletes Modal and Selected Blocks

[jeffr0]

In WordPress 5.9 beta 3, I discovered the following bug. When selecting multiple blocks and adding them to a reusable block, in the modal that provides a way to name the reusable blocks, hitting the backspace key not only removes the modal from the screen, but all of the blocks that were selected are deleted.

I was not able to recover those blocks using Control Z. I ended up having to restore my content from an earlier save. The expected behavior is for the modal to allow me to erase characters in the case of fixing a typo. This bug can cause a loss of content.

How to reproduce:
Step 1: Create a few different blocks
Step 2: Select all of those blocks
Step 3: Click the three dots and Add those to reusable blocks.
Step 4: When the prompt comes up to name the reusable blocks, hit the backspace key.

[hellofromTonya]

Test: Attempt to reproduce reported issue on macOS Big Sure. Results: backspace does delete content; control Z restores the content.

[hellofromTonya]

Test Report

Env:

• OS: macOS Big Sur
• Browsers: Chrome, Safari, Edge, and Firefox
• WordPress: trunk, 5.9 Beta 3, and 5.8.1
• Theme: TT2 for 5.9, TT1 for 5.8.1
• Plugins: none
• Localhost: wp-env and Local

Steps to Reproduce

1. Add a new post
2. Add more than one block
3. Select more than one block
4. Press enter or click on the : to open the modal
5. Select "Add to Reusable blocks"
6. Start to type something in the modal
7. Then backspace to clear it

Result: Notice with 5.8.1 the modal stays open and the content is not deleted. Notice with 5.9, the modal closes and the content is deleted.

8. With 5.9, press control+Z.

Result: Should restore the content.

Results

I am able to reproduce the modal closing and the content being deleted when pressing backspace. However, I'm not able to reproduce the content not being restored when pressing control+Z. The content does restore for me in all 4 browsers.

[hellofromTonya]

Hello @jeffr0,

Welcome to WordPress Core's Trac! Thank you for reporting this issue with 5.9 beta 1.

In testing on macOS Big Sure with no plugins activated and using Twenty Twenty-Two (TT2) theme, I was able to reproduce backspace deleting the content, but not able to reproduce control+Z not restoring the content. I got the same results when activating the latest version of Gutenberg.

The behavior of closing the "Create Reusable Block" modal and deleting the content on backspace seems incorrect to me. This behavior is different from 5.8.1 which keeps the modal open and the content intact. I'll open a Gutenberg issue to report that upstream for resolution.

I'm curious why control+Z does not restore the content for you. Can you check this please? Highlight some content and delete it. Then do control+Z. Is the content restored?

If no, please open Dev Tools in your browser (typically by right clicking and then selecting "Inspect" or "Inspect Element"). Then go to the "Console" tab. Are there any errors in the console?

[hellofromTonya]

Reported the issue upstream in the Gutenberg repository ​https://github.com/WordPress/gutenberg/issues/37539 where it'll need to be investigated and resolved. Once resolved and merged into Gutenberg, the fix will be backported to WordPress Core as part of a backport package update.

Discussion, testing, and feedback should shift to the issue in Gutenberg to empower the Editor team in identifying and resolving the issue.

[costdev]

For reference: I can reproduce on trunk using TT2, including that Ctrl+Z doesn't restore the content (unless it was previously saved in a revision).

I've narrowed the issue to an event listener and I'll comment upstream to help the team resolve the issue.

[hellofromTonya]

Cool, thanks @costdev. Removing reporter-feedback keywords as Ctrl+Z is reproducible.

[codeamp]

I think this might be related to this old issue (I opened)?
​https://github.com/WordPress/gutenberg/issues/18755

Essentially, you would expect keyboard focus (and shortcuts) to be handled in the input in the the opened modal, but instead they are handled by the editor underneath.

Not 100% they are the same issue but I think there is some overlap.

[costdev]

A note that this has already been reported as an issue upstream ​here and has a PR that will also be tested with the Delete key and updated if that needs to be included as well. The issue mentioned earlier in this ticket by @hellofromTonya has been closed and the discussion moved to ​the original issue.

@codeamp I don't believe that this is the same issue. However, the Backspace/Delete problem may have created a scenario for reproducing the Ctrl-Z behaviour raised in the issue you mentioned.

[codeamp]

Ah ok thanks for the update. I see now it looks like a regression that probably highlighted the issue I previously reported, as you mentioned (which is now worked around by preventing event propagation).

My guess would be that issue I linked is still visible by pressing ctrl + z while the modal is up (after entering text) - but I guess that also existed pre 5.9 so I'm probably going off topic a bit 🙄

[costdev]

Looks like we have ​a fix merged upstream with 4 manual tests and automated tests included - looking forward to the backport so we can close off this ticket.

[hellofromTonya]

When @noisysocks does Gutenberg's backports update, ​https://github.com/WordPress/gutenberg/pull/37595 will be included. Marking this ticket for commit to move it out of the WIP ticket queue. Will close this ticket once the the backports are committed.

Committer: The commit for this ticket should be included in the next Gutenberg update. Please verify before closing this ticket.

[hellofromTonya]

Fix was backported in [52434].