Block Editor: Allow editing invalid blocks as HTML (#69902)

Unlinked contributors: aduth, enriquesanchez.

Co-authored-by: Mamaduka <[email protected]>
Co-authored-by: t-hamano <[email protected]>
Co-authored-by: jasmussen <[email protected]>
Co-authored-by: ZebulanStanphill <[email protected]>
Co-authored-by: azaozz <[email protected]>
Co-authored-by: jordesign <[email protected]>
Co-authored-by: johngodley <[email protected]>

Author: 7 people

packages/block-editor/src/components/block-settings-menu/block-mode-toggle.js

@@ -14,7 +14,7 @@ import { store as blockEditorStore } from '../../store';
 const noop = () => {};
 
 export default function BlockModeToggle( { clientId, onToggle = noop } ) {
-	const { blockType, mode, isCodeEditingEnabled } = useSelect(
+	const { blockType, mode, enabled } = useSelect(
 		( select ) => {
 			const { getBlock, getBlockMode, getSettings } =
 				select( blockEditorStore );
@@ -23,7 +23,7 @@ export default function BlockModeToggle( { clientId, onToggle = noop } ) {
 			return {
 				mode: getBlockMode( clientId ),
 				blockType: block ? getBlockType( block.name ) : null,
-				isCodeEditingEnabled: getSettings().codeEditingEnabled,
+				enabled: getSettings().codeEditingEnabled && !! block?.isValid,
 			};
 		},
 		[ clientId ]
@@ -33,7 +33,7 @@ export default function BlockModeToggle( { clientId, onToggle = noop } ) {
 	if (
 		! blockType ||
 		! hasBlockSupport( blockType, 'html', true ) ||
-		! isCodeEditingEnabled
+		! enabled
 	) {
 		return null;
 	}

packages/block-editor/src/components/block-settings-menu/test/block-mode-toggle.js

@@ -20,7 +20,7 @@ function setupUseSelectMock( mode, blockType, codeEditingEnabled = true ) {
 		return {
 			mode,
 			blockType,
-			isCodeEditingEnabled: codeEditingEnabled,
+			enabled: codeEditingEnabled,
 		};
 	} );
 }