Cannot add a block into an empty `core/group` flex layout with one member in `allowedBlocks`

[wongjn]

Description

For core/group block that:

• Has the layout attribute value of {"type":"flex"}, i.e. a Row or Column variation.
• Has no inner blocks.
• Has a single value in its allowedBlocks attribute.

One cannot click on the button appender component to insert a block.

---

This seems to stem from the following CSS rule in dist/block-library/editor.min.css:

.wp-block-group.is-layout-flex.block-editor-block-list__block>.block-list-appender:only-child {
  gap: inherit;
  pointer-events: none;
}

Which seems to come from: https://github.com/WordPress/gutenberg/blob/fbc962cc618775a8df9d2a6b36b4785010dd0e14/packages/block-library/src/group/editor.scss#L50

Step-by-step reproduction instructions

1. Install and activate a core block theme, i.e. Twenty Twenty-Four.
2. Create a new Page.
3. Paste the group code provided further below.
4. In visual mode, attempt to click on the block appender button. Observe that no response is given.

Screenshots, screen recording, code snippet

Sample code:

<!-- wp:group {"allowedBlocks":["core/paragraph"],"layout":{"type":"flex"}} -->
<div class="wp-block-group"></div>
<!-- /wp:group -->

Screencast:

https://github.com/WordPress/gutenberg/assets/11310624/eb976bbe-d7e1-4c5c-a130-e5bcbfe0877c

Environment info

• WordPress 6.4.1 with Twenty Twenty-Four theme
• Chrome 119.0.6045.160
• Desktop Windows 11

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

[github-actions[bot]]

Hi, This issue has gone 30 days without any activity. This means it is time for a check-in to make sure it is still relevant. If you are still experiencing this issue with the latest versions, you can help the project by responding to confirm the problem and by providing any updated reproduction steps. Thanks for helping out.

[wongjn]

Confirming the problem still exists

[github-actions[bot]]

Hi, This issue has gone 30 days without any activity. This means it is time for a check-in to make sure it is still relevant. If you are still experiencing this issue with the latest versions, you can help the project by responding to confirm the problem and by providing any updated reproduction steps. Thanks for helping out.

[wongjn]

Confirming the problem still exists.

[github-actions[bot]]

Hi, This issue has gone 30 days without any activity. This means it is time for a check-in to make sure it is still relevant. If you are still experiencing this issue with the latest versions, you can help the project by responding to confirm the problem and by providing any updated reproduction steps. Thanks for helping out.

[wongjn]

Confirming the problem still exists.

[talldan]

Thanks for reporting it and keeping the issue open. I can reproduce too. I think it might be a good thing to consider fixing for WordPress 6.6, so I've added it to the project board.

[talldan]

The fix might just be adding the .block-list-appender classname to this selector: https://github.com/WordPress/gutenberg/blob/fbc962cc618775a8df9d2a6b36b4785010dd0e14/packages/block-library/src/group/editor.scss#L51-L53

[vipul0425]

Hi @talldan, Raised a PR to fix this issue.

Thanks.