Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

RichText not focusable in InnerBlocks #61495

Open
MatzeKitt opened this issue May 8, 2024 · 4 comments
Open

RichText not focusable in InnerBlocks #61495

MatzeKitt opened this issue May 8, 2024 · 4 comments
Labels
[Feature] Rich Text Related to the Rich Text component that allows developers to render a contenteditable Needs Testing Needs further testing to be confirmed. [Type] Bug An existing feature does not function as intended

Comments

@MatzeKitt
Copy link
Contributor

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

Bildschirmaufnahme.2024-05-08.um.14.45.48.mov

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

@MatzeKitt MatzeKitt added the [Type] Bug An existing feature does not function as intended label May 8, 2024
@Mamaduka Mamaduka added [Feature] Rich Text Related to the Rich Text component that allows developers to render a contenteditable Needs Testing Needs further testing to be confirmed. labels May 8, 2024
@megane9988
Copy link
Contributor

Reproducibility was confirmed using a similar code.

image

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)

image

@MatzeKitt
Copy link
Contributor Author

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

Copy link

github-actions bot commented Jul 6, 2024

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.

@github-actions github-actions bot added the [Status] Stale Gives the original author opportunity to update before closing. Can be reopened as needed. label Jul 6, 2024
@MatzeKitt
Copy link
Contributor Author

Still relevant.

@github-actions github-actions bot removed the [Status] Stale Gives the original author opportunity to update before closing. Can be reopened as needed. label Jul 7, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Rich Text Related to the Rich Text component that allows developers to render a contenteditable Needs Testing Needs further testing to be confirmed. [Type] Bug An existing feature does not function as intended
3 participants