Deleting first item in an InnerBlocks list with delete key causes exception

[glendaviesnz]

Description

If the delete key or keyboard shortcut is used to delete the first item in an InnerBlocks list an exception is thrown. Using the 'Remove block' menu option for the block works as expected. Using the delete key for any block other than the first one also works as expected.

This issue can be replicated with the Navigation block, and also on the gallery block refactor PR

Step-by-step reproduction instructions:

1. Add a Navigation block and add several child navigation items to it.
2. Select the first item in the navigation and hit delete key to remove
3. Block shows unable to preview message and exception in console

Code snippet

Exception is thrown at https://github.com/WordPress/gutenberg/blob/trunk/packages/block-editor/src/components/block-list/use-block-props/index.js#L86

For some reason the useBlockProps hook for the block that has been deleted gets stuck in a loop and throws an exception when trying to get the title of the block that is now deleted.

[Quintis1212]

Hello ) I can reproduce this bug ) I will try to fix it )

[Quintis1212]

In my closed PR I fix yours bug , you just need to add more dependence to select function :
0e0eae3

In the latest version gutenberg there is no such bug

[talldan]

@glendaviesnz I was checking if this was affected by #29059, but I can't reproduce this one in trunk, would you be able to see if it's still happening?

[glendaviesnz]

@glendaviesnz I was checking if this was affected by #29059, but I can't reproduce this one in trunk, would you be able to see if it's still happening?

It doesn't happen in trunk for me with the navigation block, but I just rebased the Gallery PR and it still happens with that block - strange that it fixed it for one and not the other, but gallery has a slightly different innerBlock structure to the navigation block.

[talldan]

Also reported on #29722, this also happens when deleting a Page List block from within the Navigation block.

Closing that one as a duplicate.

[talldan]

The main cause seems to be that useBlockProps assumes that a block will always be defined, but when deleting, momentarily it isn't defined.

There seem to be a few cases where that's causing an issue:

• The type is undefined here, and attempting to access the title property throws an error -

  gutenberg/packages/block-editor/src/components/block-list/use-block-props/index.js

  Line 86 in 647a41c

  blockTitle: getBlockType( blockName ).title,

• Looks like that also might be a problem here -

  gutenberg/packages/block-editor/src/components/block-list/use-block-props/use-block-default-class-name.js

  Line 28 in 647a41c

  const blockType = getBlockType( name );

I think it's a similar issue to what Riad describes on this PR - #29059.

[talldan]

Also reported in #29958.

[paaljoachim]

Using the Backspace/Del key might cause a block error.

I was just about to create an issue for what I believe is the same error. As I was in the Site Editor in TT1.
I have earlier mentioned the error for Glen in relation to the updated Gallery block.

I am using WordPress 5.7.
Theme: TT1
Gutenberg plugin 10.3.1

Do-not-click-the-back-arrow-button-or-else-the-block-will-explode.mp4

[leeshadle]

I'm not sure if this is related, but I'm getting an error after updating to Gutenberg versions 10.3 & 10.3.1:
"Uncaught TypeError: Cannot read property 'apiVersion' of undefined"

I built a package that allows me to hot reload blocks during development.

During development, if a registered block's code changes I run unregisterBlockType(). I then immediately run registerBlockType() with the updated block's code.

I'm not sure what's causing the error, but it appears that the BlockListBlock component re-renders despite the block being unregistered?

[markhowellsmead]

The error Cannot read property 'apiVersion' of undefined is also thrown when trying to delete a block in the editor which is no longer registered.

[klokie]

I'm seeing what seems to be the same issue presented when following the recommended practice for replacing editor content, i.e. using resetBlocks().

[annezazu]

Noting that I found this error when deleting the Featured Image Block inside a Query Block. This was found as part of the fifth call for testing for the FSE Outreach Program:

bug.mov