Fix edited block name's initial state and fallback

WordPress · Jan 9, 2025 · 11a3660 · 11a3660
1 parent 7f82629
commit 11a3660
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 4 deletions.
diff --git a/packages/block-editor/src/components/block-rename/modal.js b/packages/block-editor/src/components/block-rename/modal.js
@@ -21,7 +21,7 @@ import { useBlockDisplayInformation } from '..';
 import isEmptyString from './is-empty-string';
 
 export default function BlockRenameModal( { clientId, onClose } ) {
-	const [ editedBlockName, setEditedBlockName ] = useState( '' );
+	const [ editedBlockName, setEditedBlockName ] = useState();
 
 	const blockInformation = useBlockDisplayInformation( clientId );
 	const { metadata } = useSelect(
@@ -47,7 +47,8 @@ export default function BlockRenameModal( { clientId, onClose } ) {
 			( binding ) => binding.source === 'core/pattern-overrides'
 		);
 
-	const nameHasChanged = editedBlockName !== blockName;
+	const nameHasChanged =
+		editedBlockName !== undefined && editedBlockName !== blockName;
 	const nameIsOriginal = editedBlockName === originalBlockName;
 	const nameIsEmpty = isEmptyString( editedBlockName );
 
@@ -107,7 +108,7 @@ export default function BlockRenameModal( { clientId, onClose } ) {
 					<TextControl
 						__nextHasNoMarginBottom
 						__next40pxDefaultSize
-						value={ editedBlockName || blockName }
+						value={ editedBlockName ?? blockName }
 						label={ __( 'Name' ) }
 						help={
 							hasOverridesWarning

diff --git a/test/e2e/specs/editor/various/block-renaming.spec.js b/test/e2e/specs/editor/various/block-renaming.spec.js
@@ -126,8 +126,9 @@ test.describe( 'Block Renaming', () => {
 			await pageUtils.pressKeys( 'primary+a' );
 			await page.keyboard.press( 'Delete' );
 
-			// Check placeholder for input is the original block name.
+			// Check that input is empty and placeholder is the original block name.
 			await expect( nameInput ).toHaveAttribute( 'placeholder', 'Group' );
+			await expect( nameInput ).toHaveValue( '' );
 
 			// It should be possible to submit empty.
 			await expect( saveButton ).toBeEnabled();