From b33794de5a71df92b42562f326ebdec2d10ff6d8 Mon Sep 17 00:00:00 2001 From: Paul Von Schrottky Date: Tue, 15 Jun 2021 15:54:57 -0400 Subject: [PATCH] Fix component inspector error in React Native (#32628) An issue cropped up where the inspector (Debug Menu > Show Inspector) showed a red screen when loading. This happens because on loading the inspector, a hook is called which checks the editor capabilities. If the reusable block capability is `false`, the reusable block type is then unregistered. What seems to happen when opening the inspector is that the editor does not fully reload, so the reusable block is already unregistered and the app tries to unregister it again, causing a red screen. The fix here is to only unregister the block if it's currently registered. An alternative approach might be to put the code that unregisters the block in a hook that's only called when the editor is first loaded, not when it's only partially reloaded by the inspector. --- packages/react-native-editor/src/index.js | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/packages/react-native-editor/src/index.js b/packages/react-native-editor/src/index.js index bb97e34af5f590..2d9cd3ed6c79ac 100644 --- a/packages/react-native-editor/src/index.js +++ b/packages/react-native-editor/src/index.js @@ -18,7 +18,7 @@ import { validateThemeColors, validateThemeGradients, } from '@wordpress/block-editor'; -import { unregisterBlockType } from '@wordpress/blocks'; +import { unregisterBlockType, getBlockType } from '@wordpress/blocks'; const reactNativeSetup = () => { // Disable warnings as they disrupt the user experience in dev mode @@ -58,7 +58,10 @@ const setupInitHooks = () => { setupLocale( props.locale, props.translations ); const capabilities = props.capabilities ?? {}; - if ( capabilities.reusableBlock !== true ) { + if ( + getBlockType( 'core/block' ) !== undefined && + capabilities.reusableBlock !== true + ) { unregisterBlockType( 'core/block' ); } }