fix: Guard against a block styles crash due to null block values (#56903

)

* fix: Guard against a block styles crash due to null block values

In certain scenarios, e.g., when the editor hangs due to poor
performance, the `getBlock` value unexpectedly returns `null`. To guard
against a crash in this scenario, we now conditionally access attributes
on the block.

A ideal resolution would be improving editor performance to avoid the
scenario where a race condition causes a crash, but the fact remains
that `getBlock` _can_ return `null` values and that we should not
presume that it will not.

* docs: Add change log entry

packages/block-editor/src/components/block-styles/index.native.js

@@ -19,14 +19,16 @@ import StylePreview from './preview';
 import containerStyles from './style.scss';
 import { store as blockEditorStore } from '../../store';
 
+const EMPTY_ARRAY = [];
+
 function BlockStyles( { clientId, url } ) {
 	const selector = ( select ) => {
 		const { getBlock } = select( blockEditorStore );
 		const { getBlockStyles } = select( blocksStore );
 		const block = getBlock( clientId );
 		return {
-			styles: getBlockStyles( block.name ),
-			className: block.attributes.className || '',
+			styles: getBlockStyles( block?.name ) || EMPTY_ARRAY,
+			className: block?.attributes?.className || '',
 		};
 	};
 

packages/react-native-editor/CHANGELOG.md

@@ -12,6 +12,7 @@ For each user feature we should also add a importance categorization label  to i
 ## Unreleased
 -   [*] [internal] Move InserterButton from components package to block-editor package [#56494]
 -   [*] [internal] Move ImageLinkDestinationsScreen from components package to block-editor package [#56775]
+-   [*] Guard against an Image block styles crash due to null block values [#56903]
 
 ## 1.109.2
 -   [**] Fix issue related to text color format and receiving in rare cases an undefined ref from `RichText` component [#56686]