Description

The textarea rendered when a block's edit mode is in HTML mode may overflow:

On the other hand, the problem doesn't occur when the active theme is a classic theme. This is because the forms.css applies box-sizing: border-box to form elements:

I'm not sure why the forms.css is loaded only when the active theme is a classic theme, but this stylesheet is for the dashboard, so the block editor components should not rely on this stylesheet. I think we need to apply an explicit box-sizing: border-box the the BlockHTML component.

Step-by-step reproduction instructions

• Enable any block theme.
• Create a new post.
• Click the "Edit as HTML" button from the initial empty Paragraph block.
• Open the List view.
• Hover the Paragraph block with your mouse cursor.
• Check the colored outline of the block.

Screenshots, screen recording, code snippet

No response

Environment info

No response

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

Please confirm which theme type you used for testing.

• Block
• Classic
• Hybrid (e.g. classic with theme.json)
• Not sure