RichText not focusable in InnerBlocks

[MatzeKitt]

Description

When adding a new RichText component via the editor.BlockEdit filter after the BlockEdit, I cannot select it if the block is an inner block. On clicking on the block, the selection quickly changes to the parent block and then back to the inner block, but not to my RichText component.

import { RichText } from '@wordpress/block-editor';
import { createHigherOrderComponent } from '@wordpress/compose';
import { addFilter } from '@wordpress/hooks';
import { __ } from '@wordpress/i18n';

const addControls = createHigherOrderComponent( ( BlockEdit ) => ( props ) => {
    return (
        <>
            <BlockEdit { ...props } />

            <RichText
                allowedFormats={ [
                    'core/bold',
                    'core/italic',
                    'core/underline',
                ] }
                identifier="notes"
                placeholder={ __( 'Notes …' ) }
                style={ { position: 'relative', zIndex: 100 } }
                tagName="div"
            />
        </>
    );
} );

addFilter( 'editor.BlockEdit', 'rh/block-notes/add-controls', addControls );

(The style attribute is just for a better usability in this demo to prevent it from being overlapped by the inline block inserter.)

Step-by-step reproduction instructions

1. Use the code from above
2. Try to select/focus the RichText element of an inner block (e.g. inside a paragraph of a group block)

Screenshots, screen recording, code snippet

https://github.com/WordPress/gutenberg/assets/1018979/4464537a-826c-4ab9-9bce-41d2f9224322

Environment info

• WordPress 6.5

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

[megane9988]

Reproducibility was confirmed using a similar code.

I don't know if it is directly related to this issue. When I enter text into Notes, the following error appears on the browser console.

Uncaught TypeError: o is not a function
    at onChange (block-editor.min.js?ver=868d782fcb169133c92b:41:48611)
    at rich-text.min.js?ver=dd125966cf6cc0394ae0:2:28756
    at batch (data.min.js?ver=e6595ba1a7cd34429f66:2:20762)
    at Object.batch (data.min.js?ver=e6595ba1a7cd34429f66:2:22124)
    at w (rich-text.min.js?ver=dd125966cf6cc0394ae0:2:28737)
    at HTMLDivElement.a (rich-text.min.js?ver=dd125966cf6cc0394ae0:2:25467)

[MatzeKitt]

The same problem applies to all blocks in the widget area.

[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.

[MatzeKitt]

Still relevant.

[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.

[MatzeKitt]

Still relevant.

[torounit]

I was able to reproduce the same problem.

Navigation with the arrow keys also does not function properly.

[flickerbox-tom]

I'm seeing this pop up on many sites where custom blocks use rich-text in innerblocks.

Just wondering if this change has triggered something. https://github.com/WordPress/gutenberg/pull/60936